@import url('../assets/bricolage.css');
:root{--paper:#f4f2e9;--ink:#392547;--purple:#d9caf2;--violet:#6d448e;--lemon:#e6f37b;--focus:#8d321d;--selection:#ded170}body{background:var(--paper);color:var(--ink)}h1,h2,h3{font-family:'Bricolage Grotesque',sans-serif}.detour-nav{display:flex;align-items:center;justify-content:space-between;margin:0 4vw;padding:22px 0 16px;border-bottom:1px solid #b8a7c4;gap:20px}.detour-small-logo{font-family:'Bricolage Grotesque',sans-serif;font-size:32px;font-weight:800;text-decoration:none;letter-spacing:-.04em}.detour-small-logo span{vertical-align:super;font-size:12px;margin-left:2px}.detour-nav>span{font-size:12px;letter-spacing:.07em}.detour-nav button{display:flex;align-items:center;gap:8px;border:1px solid #af9abd;border-radius:30px;background:none;padding:10px 16px;font-size:12px;min-height:43px}.detour-nav button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.detour-nav button>span{background:var(--purple);color:var(--ink);min-width:20px;border-radius:50%;padding:2px}.detour-nav .icon{width:15px}.detour-masthead{padding:30px 4vw 0}.detour-masthead h1{font-size:clamp(54px,7vw,96px);letter-spacing:-.04em;font-weight:800;line-height:1.02;margin:0 0 25px;text-align:center}.detour-masthead h1>span{color:var(--violet)}.masthead-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #b8a7c4;border-bottom:1px solid #b8a7c4;padding:12px 0;font-size:12px}.masthead-bottom>span:last-child{font-size:12px;letter-spacing:.05em}.detour-feature{display:grid;grid-template-columns:1.55fr 1fr;gap:35px;padding:35px 4vw 65px}.lead-story>a{display:block;text-decoration:none}.feature-photo{position:relative}.feature-photo>img{width:100%;height:350px;object-fit:cover}.round-stamp{position:absolute;right:22px;bottom:-25px;width:106px;height:106px;border-radius:50%;display:grid;place-content:center;text-align:center;background:var(--lemon);font-size:13px;line-height:1.15;font-weight:800;transform:rotate(12deg);border:1px dashed var(--ink)}.story-meta{display:flex;gap:18px;font-size:12px;letter-spacing:.08em;margin:20px 0 13px}.lead-story h2{font-size:clamp(28px,3vw,43px);line-height:1.05;font-weight:700;letter-spacing:-.03em;margin:0 0 19px}.read-link{display:flex;align-items:center;gap:13px;font-size:12px}.read-link .icon{width:17px;transition:transform .2s}.lead-story>a:hover .icon{transform:translateX(5px)}.editors-note{background:var(--purple);padding:35px 35px 29px;display:flex;flex-direction:column;align-items:flex-start;position:relative;justify-content:flex-end}.editors-note h2{font-size:37px;font-weight:700;line-height:1.1;letter-spacing:-.03em;margin:23px 0 20px}.editors-note h2 em{font-style:normal;color:#684186}.editors-note p{font-size:12px;max-width:39ch}.editors-note>button{display:flex;align-items:center;justify-content:space-between;gap:20px;border:0;background:var(--ink);color:var(--paper);border-radius:30px;width:100%;padding:15px 19px;font-size:12px;font-weight:600;margin:18px 0}.editors-note small{font-size:12px}.compass{width:120px;height:120px;border:1px solid #79638b;border-radius:50%;position:relative;align-self:flex-end;margin:0 5px 0 0}.compass>span{position:absolute;font-size:12px;font-weight:600}.compass>span:nth-child(1){top:8px;left:55px}.compass>span:nth-child(2){top:53px;right:10px}.compass>span:nth-child(3){bottom:8px;left:55px}.compass>span:nth-child(4){top:53px;left:8px}.compass::after{content:'';position:absolute;inset:24px;border:1px solid #9984ad;border-radius:50%}.compass-needle{position:absolute;left:55px;top:30px;width:10px;height:60px;background:linear-gradient(to bottom,#392547 50%,#f4f2e9 50%);transform:rotate(35deg);z-index:1}.compass.is-spinning .compass-needle{animation:detour-spin .65s cubic-bezier(.16,1,.3,1)}@keyframes detour-spin{from{transform:rotate(35deg)}to{transform:rotate(395deg)}}.story-section{padding:55px 4vw 65px;border-top:1px solid #b8a7c4}.stories-heading{display:flex;justify-content:space-between;gap:25px;align-items:flex-end}.stories-heading h2{font-size:42px;line-height:1.08;letter-spacing:-.03em;font-weight:600;margin:0}.stories-heading h2 span{color:var(--violet)}.stories-heading p{font-size:12px;margin:0 0 5px}.story-filters{display:flex;gap:9px;flex-wrap:wrap;margin:28px 0 30px}.story-filters button{background:transparent;border:1px solid #a58daf;border-radius:30px;padding:12px 19px;font-size:12px;min-height:42px}.story-filters button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.story-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px 27px}.story-card{position:relative}.story-card>a{text-decoration:none;display:block}.story-card img{width:100%;height:210px;object-fit:cover;transition:filter .3s,transform .3s}.story-card:nth-child(3n+2) img{border-radius:100px 100px 0 0}.story-card:nth-child(3n) img{border-radius:0 0 90px 0}.story-card>a:hover img{filter:saturate(1.2);transform:translateY(-3px)}.story-card .story-meta{margin:18px 40px 13px 0;gap:12px}.story-card h3{font-size:26px;letter-spacing:-.025em;line-height:1.1;font-weight:600;margin:0 0 12px}.story-card p{font-size:12px;color:#654d72;max-width:45ch;margin:0}.save-story{position:absolute;right:10px;top:10px;display:grid;place-items:center;background:var(--paper);color:var(--ink);border:1px solid #aa91b5;border-radius:50%;width:40px;height:40px}.save-story[aria-pressed=true]{background:var(--lemon)}.save-story[aria-pressed=true] .icon{fill:var(--ink)}#empty-stories{padding:40px 0}#empty-stories h3{font-size:30px}#empty-stories p{font-size:13px}.reader{background:#e2d6f0;padding:30px 4vw 65px;scroll-margin-top:20px}.reader-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #a893b8;padding-bottom:20px;margin-bottom:35px}.reader-toolbar button{background:none;border:0;display:flex;align-items:center;gap:10px;padding:10px 0;font-size:12px}.reader-toolbar .icon{width:17px}.reader-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:6vw;align-items:start}.reader-layout>img{width:100%;height:470px;object-fit:cover;position:sticky;top:25px}.reader-layout article{max-width:66ch}.reader-category{font-size:12px;letter-spacing:.09em;margin-top:0}.reader-layout h2{font-size:45px;letter-spacing:-.03em;line-height:1.08;margin:20px 0}.reader-credit{font-size:12px;color:#5c4668;padding-bottom:20px;border-bottom:1px solid #a893b8}.reader-layout #reader-body p{font-size:15px;line-height:1.9}.reader-layout #reader-body h3{font-size:25px;margin:30px 0 12px}.detour-signoff{position:relative;text-align:center;background:var(--lemon);padding:60px 25px}.signoff-circle{width:65px;height:65px;border:1px solid #5e6633;border-radius:50%;display:grid;place-items:center;margin:0 auto 25px}.signoff-circle .icon{width:33px;height:33px}.detour-signoff h2{font-size:clamp(36px,4.5vw,64px);font-weight:600;letter-spacing:-.04em;line-height:1.05}.detour-signoff h2 span{color:#536129}.detour-signoff .button{border-radius:30px;padding:14px 25px}.demo-footer a{white-space:normal}.demo-footer{background:#392547}@media(max-width:950px){.detour-feature{gap:25px}.editors-note{padding:25px}.editors-note h2{font-size:31px}.feature-photo>img{height:330px}.story-card img{height:180px}.story-card h3{font-size:23px}.compass{width:100px;height:100px}.compass>span:nth-child(1),.compass>span:nth-child(3){left:45px}.compass>span:nth-child(2),.compass>span:nth-child(4){top:43px}.compass-needle{left:45px;top:25px;height:50px}.reader-layout h2{font-size:35px}}@media(max-width:700px){.detour-nav{margin:0 22px;padding:17px 0 14px}.detour-nav>span{display:none}.detour-nav button{font-size:12px}.detour-masthead{padding:27px 20px 0}.detour-masthead h1{font-size:61px;line-height:.92;text-align:left;max-width:350px;margin-bottom:24px}.detour-masthead h1>span{display:block;margin-left:55px}.masthead-bottom{font-size:12px;line-height:1.5}.masthead-bottom>span:last-child{display:none}.detour-feature{grid-template-columns:1fr;padding:25px 22px 40px;gap:35px}.feature-photo>img{height:300px}.round-stamp{width:88px;height:88px;font-size:12px;right:12px;bottom:-18px}.lead-story h2{font-size:32px}.editors-note{padding:28px}.editors-note h2{font-size:37px;margin-top:0;max-width:220px}.editors-note .compass{position:absolute;right:20px;top:22px;width:75px;height:75px;opacity:.5}.compass>span:nth-child(1),.compass>span:nth-child(3){left:33px}.compass>span:nth-child(2),.compass>span:nth-child(4){top:31px}.compass-needle{left:33px;top:20px;height:35px;width:7px}.compass::after{inset:19px}.editors-note p{font-size:13px;max-width:34ch}.editors-note button{font-size:12px}.story-section{padding:40px 22px}.stories-heading{display:block}.stories-heading h2{font-size:34px}.stories-heading p{margin:17px 0 0}.story-filters{gap:8px}.story-filters button{padding:11px 13px}.story-grid{grid-template-columns:1fr;gap:33px}.story-card img{height:250px}.story-card h3{font-size:29px}.story-card p{font-size:12px}.reader{padding:25px 22px 40px}.reader-layout{grid-template-columns:1fr;gap:30px}.reader-layout>img{position:static;height:270px}.reader-layout h2{font-size:37px}.reader-toolbar button{font-size:12px}.detour-signoff{padding:45px 23px}.detour-signoff h2{font-size:42px}}

.editors-note p,.story-card p,.stories-heading p{font-size:14px}

.lead-story h2{margin-top:35px;margin-bottom:16px}.story-card h3{margin-top:20px}.story-card .story-meta{margin-top:0;margin-bottom:14px}.lead-story .story-meta{margin-top:0;margin-bottom:20px}
/* A lavender magazine cover, then a field-trip interlude. */
.detour-nav,.detour-masthead{background:#d9caf2}.detour-nav{margin:0;padding:22px 4vw;border-color:#a48bbd}.detour-masthead{padding-top:36px}.detour-masthead h1{text-align:left;max-width:1050px;margin:0 auto 26px;font-size:clamp(62px,8vw,96px);line-height:.96}.detour-masthead h1>span{display:inline-block;transform:rotate(-4deg);color:#392547;text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:10px}.masthead-bottom{border-bottom:0;border-color:#a48bbd}.detour-feature{background:#d9caf2;grid-template-columns:1.8fr 1fr;gap:5vw;padding-top:30px;align-items:center}.feature-photo{transform:rotate(-2deg);margin-bottom:35px;transition:transform .6s cubic-bezier(.16,1,.3,1)}.feature-photo img{height:390px;border:10px solid #f4f2e9;box-shadow:0 16px 28px #39254724}.lead-story>a:hover .feature-photo{transform:rotate(0)}.lead-story h2{font-size:35px}.editors-note{background:#e6f37b;transform:rotate(3deg);padding:30px;min-height:410px;border-radius:0 55px 0 0}.editors-note h2{font-size:34px}.editors-note p{font-size:14px}.compass{width:110px;height:110px}.compass>span:nth-child(1),.compass>span:nth-child(3){left:50px}.compass>span:nth-child(2),.compass>span:nth-child(4){top:48px}.compass-needle{left:50px;top:25px}.detour-journey{position:relative;background:#392547;color:#f4f2e9;display:grid;grid-template-columns:58% 42%}.journey-window{position:sticky;top:0;height:100svh;align-self:start;overflow:hidden}.journey-window img{height:100%;width:100%;object-fit:cover;will-change:transform;transform:scale(1.12)}.journey-window:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#20172b88,transparent 45%)}.journey-caption{position:absolute;z-index:1;bottom:35px;left:30px;font-size:11px;letter-spacing:.1em}.journey-words article{min-height:85svh;padding:80px 5vw;display:flex;flex-direction:column;justify-content:center}.journey-words h2{font-size:clamp(46px,5.3vw,74px);line-height:.98;letter-spacing:-.035em}.journey-words h2 em{font-style:normal;color:#e6f37b}.journey-words p{font-size:15px;color:#d5c4e2;max-width:30ch}.journey-words .button{align-self:flex-start;margin-top:25px;text-align:left}.story-section{padding-top:75px}.story-grid{grid-template-columns:1.1fr 1fr 1fr;gap:45px 30px}.story-card:nth-child(3n+2){padding-top:60px}.story-card img,.story-card:nth-child(3n+2) img,.story-card:nth-child(3n) img{border-radius:0}.story-card:nth-child(3n+2) img{height:280px}.story-card>a:hover img{transform:rotate(-2deg) translateY(-4px)}.story-card p{font-size:14px}.reader-layout img{border:8px solid #f4f2e9}.detour-signoff{padding:80px 25px}
@media(max-width:1000px){.detour-feature{gap:4vw;grid-template-columns:1.5fr 1fr}.editors-note{padding:24px;transform:rotate(2deg)}.editors-note h2{font-size:30px}.feature-photo img{height:330px}.journey-words article{padding:65px 4vw}.journey-words h2{font-size:56px}}
@media(max-width:700px){.detour-nav{padding:18px 22px}.detour-masthead{padding:30px 24px 0}.detour-masthead h1{font-size:clamp(59px,17vw,83px);text-align:left;max-width:360px;line-height:1.03}.masthead-bottom{font-size:11px}.detour-feature{grid-template-columns:1fr;padding:28px 26px 48px;gap:32px}.feature-photo img{height:280px;border-width:7px}.feature-photo{margin-bottom:38px}.lead-story h2{font-size:30px}.editors-note{min-height:0;padding:28px;transform:rotate(2deg);margin:0 4px}.editors-note h2{font-size:35px}.compass{position:absolute;right:22px;top:25px;transform:scale(.68);transform-origin:top right}.editors-note h2{padding-right:60px}.editors-note p{margin-top:10px}.detour-journey{display:block}.journey-window{height:43svh;min-height:260px;z-index:2}.journey-words article{min-height:62svh;padding:45px 28px}.journey-words h2{font-size:60px}.journey-caption{left:24px;bottom:22px}.story-grid{grid-template-columns:1fr}.story-card:nth-child(3n+2){padding-top:0}.story-card:nth-child(3n+2) img{height:240px}}
@media(prefers-reduced-motion:reduce){.journey-window{position:relative;height:65svh}.detour-journey{display:block}.journey-window img{transform:none!important}.journey-words{display:grid;grid-template-columns:repeat(3,1fr)}.journey-words article{min-height:0;padding:45px 4vw}.journey-words h2{font-size:40px}@media(max-width:700px){.journey-words{display:block}.journey-words article{padding:40px 24px}}}
@media(min-width:701px){.story-card:nth-child(3n+2) .save-story{top:70px}}