/* ==========================================================================
   Our story (/our-story). Every class is prefixed os- so nothing here can
   affect, or be affected by, the shared site components.
   ========================================================================== */
.os-page{
  --os-forest:#1b2a1e;--os-green:#344e41;--os-sage:#a3b18a;--os-sage-deep:#6d987d;--os-orange:#e6a15c;--os-sand:#d4a373;
  --os-cream:#fcf9f2;--os-paper:#f4efe3;--os-muted:#5d685e;--os-line:#d5d9cc;--os-gold:#e6cf95;
  --os-display:var(--tv-font-display,Bricolage,"Bricolage Grotesque",Onest,system-ui,sans-serif);
  --os-body:var(--tv-font-body,Onest,system-ui,sans-serif);
  --os-gutter:clamp(18px,5vw,72px);--os-max:1240px;--os-radius:22px;--os-ease:cubic-bezier(.22,1,.36,1);
  background:var(--os-cream);color:var(--os-forest);font:400 16px/1.6 var(--os-body)
}
@media(min-width:1600px){.os-page{--os-max:1360px}}
.os-page h1,.os-page h2,.os-page h3{font-family:var(--os-display);font-weight:600;letter-spacing:-.025em;line-height:1.05;margin:0;color:inherit}
.os-page p{margin:0}
.os-page img{max-width:100%}
.os-wrap{width:min(100% - var(--os-gutter)*2,var(--os-max));margin-inline:auto}
.os-section{padding:clamp(64px,10vw,128px) 0}
.os-eyebrow{display:inline-flex;align-items:center;gap:10px;margin:0 0 14px;color:var(--os-green);font:600 12px/1.3 var(--os-body);letter-spacing:.16em;text-transform:uppercase}
.os-eyebrow::before{content:"";width:22px;height:2px;background:var(--os-orange)}
.os-lead{font-size:clamp(17px,1.6vw,20px);line-height:1.6;color:var(--os-muted)}
.os-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border:1px solid var(--os-forest);border-radius:999px;background:var(--os-orange);color:var(--os-forest);font:600 15px/1.1 var(--os-body);text-decoration:none;text-align:center;box-shadow:4px 4px 0 var(--os-forest);transition:transform .2s var(--os-ease),box-shadow .2s var(--os-ease)}
.os-btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--os-forest);color:var(--os-forest)}
.os-btn.is-ghost{background:transparent;color:inherit;border-color:currentColor;box-shadow:none}
.os-btn.is-ghost:hover{background:#fcf9f214;transform:none;color:inherit}
.os-link{display:inline-flex;align-items:center;gap:8px;margin-top:22px;color:var(--os-green);font-weight:600;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px}
.os-link:hover{color:var(--os-forest)}
/* Neutral fill for a photo slot that has no image yet. */
.os-fill{display:block;width:100%;height:100%;background:repeating-linear-gradient(135deg,#344e41 0 14px,#3b5848 14px 28px)}
.os-preview-note{margin:0;padding:12px var(--os-gutter);background:#fff6cf;color:#5b4a06;font:500 14px/1.5 var(--os-body);text-align:center;border-bottom:1px solid #e9d58a}
.os-preview-note a{color:inherit;font-weight:700}

/* ---- Hero -------------------------------------------------------------------------------------- */
.os-hero{position:relative;min-height:calc(var(--os-hero-space,min(calc(100svh - var(--nav-height,88px)),860px)) + var(--os-overlap,0px));display:flex;align-items:flex-end;color:var(--os-cream);background:var(--os-forest);overflow:hidden;isolation:isolate}
.os-hero-media{position:absolute;inset:0;z-index:-2}
.os-hero-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);animation:os-drift 18s ease-out forwards}
@keyframes os-drift{to{transform:scale(1)}}
.os-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#1b2a1e66 0%,#1b2a1e1a 32%,#1b2a1ecc 78%,#1b2a1ef2 100%),linear-gradient(90deg,#1b2a1e99 0%,transparent 65%)}
.os-hero .os-wrap{padding:calc(var(--os-fit,1)*clamp(90px,14vh,170px)) 0 calc(var(--os-fit,1)*clamp(36px,6vh,64px) + var(--os-overlap,0px))}
.os-hero .os-eyebrow{color:var(--os-gold)}
.os-hero h1{max-width:15ch;font-size:calc(var(--os-fit,1)*clamp(40px,7.2vw,96px));text-wrap:balance}
.os-hero h1 em{font-style:normal;color:var(--os-orange)}
.os-hero .os-lead{max-width:60ch;margin-top:calc(var(--os-fit,1)*22px);font-size:calc(max(.82,var(--os-fit,1))*clamp(17px,1.6vw,20px));color:#fcf9f2d9}
.os-hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:calc(var(--os-fit,1)*30px)}
.os-hero .os-btn.is-ghost{color:var(--os-cream)}
.os-dests{display:grid;grid-template-columns:repeat(var(--os-count,3),minmax(0,1fr));gap:clamp(10px,1.6vw,18px);margin-top:calc(var(--os-fit,1)*clamp(34px,6vh,56px));max-width:calc(var(--os-fit,1)*860px)}
.os-dests.is-1{--os-count:1;max-width:calc(var(--os-fit,1)*300px)}.os-dests.is-2{--os-count:2;max-width:calc(var(--os-fit,1)*580px)}
.os-dest{position:relative;display:block;aspect-ratio:4/3;border-radius:16px;overflow:hidden;text-decoration:none;color:var(--os-cream);border:1px solid #fcf9f240;transition:transform .4s var(--os-ease)}
.os-dest:hover{transform:translateY(-4px);color:var(--os-cream)}
.os-dest img{width:100%;height:100%;object-fit:cover}
.os-dest::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,#1b2a1ecc)}
.os-dest b{position:absolute;left:12px;right:12px;bottom:10px;z-index:1;font:600 clamp(13px,1.3vw,16px)/1.2 var(--os-display);text-shadow:0 1px 10px #000a}
.os-dest small{display:block;font:500 10px/1.3 var(--os-body);letter-spacing:.12em;text-transform:uppercase;opacity:.85}

/* ---- Hero: the homepage's field-journal language ------------------------------------------------------
   A hairline coordinates band, the 
︎ eyebrow, rectangular hard-shadow buttons like "Plan a journey", and the
   destination photos as tilted specimen cards with the brand's offset shadow: fanned at the right on wide
   screens, in a row under the text elsewhere. The copy rises in on arrival and the cards are dealt in. */
.os-hero-band{position:absolute;left:50%;top:clamp(16px,3vh,30px);z-index:1;display:flex;justify-content:space-between;gap:20px;width:min(100% - var(--os-gutter)*2,var(--os-max));padding-bottom:10px;color:#fcf9f2b8;font:600 10px/1.3 var(--os-body);letter-spacing:.18em;text-transform:uppercase;transform:translateX(-50%);pointer-events:none}
.os-hero-band i{position:absolute;left:0;right:0;bottom:0;height:1px;background:#fcf9f238}
.os-hero-band i::after{content:"";position:absolute;inset:0;background:var(--os-orange);transform:scaleX(0);transform-origin:left;animation:os-band 2.4s var(--os-ease) .4s forwards}
@keyframes os-band{to{transform:scaleX(.22)}}
.os-hero .os-eyebrow::before{content:"
︎";width:auto;height:auto;background:none;color:var(--os-orange);font-size:15px;letter-spacing:0}
.os-hero .os-btn{border-radius:2px;border-color:var(--os-forest);box-shadow:4px 4px 0 #fcf9f2e6}
.os-hero .os-btn:hover{box-shadow:6px 6px 0 var(--os-cream)}
.os-hero .os-btn.is-ghost{border-color:#fcf9f2b3;box-shadow:none}
.os-hero .os-btn.is-ghost:hover{background:#fcf9f214;border-color:var(--os-cream);box-shadow:4px 4px 0 var(--os-orange);transform:translate(-2px,-2px)}
.os-hero .os-dests{counter-reset:os-dest}
.os-hero .os-dest{counter-increment:os-dest;border:1px solid #fcf9f2b3;border-radius:3px;box-shadow:5px 5px 0 var(--os-orange);transition:transform .45s var(--os-ease),box-shadow .45s var(--os-ease),rotate .45s var(--os-ease),scale .45s var(--os-ease)}
.os-hero .os-dest:hover{scale:1.03;box-shadow:8px 8px 0 var(--os-orange)}
.os-hero .os-dest small::before{content:none}
.os-hero .os-wrap>*{animation:os-rise .9s var(--os-ease) both}
.os-hero .os-wrap>h1{animation-delay:.1s}.os-hero .os-wrap>.os-lead{animation-delay:.22s}.os-hero .os-wrap>.os-hero-actions{animation-delay:.32s}
.os-hero .os-wrap>.os-dests{animation:none}
.os-hero .os-dest{animation:os-deal 1s var(--os-ease) both}
.os-hero .os-dest:nth-child(1){animation-delay:.45s}.os-hero .os-dest:nth-child(2){animation-delay:.58s}.os-hero .os-dest:nth-child(3){animation-delay:.71s}
@keyframes os-rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes os-deal{from{opacity:0;transform:translate(60px,20px) rotate(9deg)}to{opacity:1;transform:none}}
/* Wide screens: the text takes the left, the specimen cards fan down the right. Each card overlaps the one
   below it, so every caption stays visible; hovering straightens a card and brings it forward. */
@media(min-width:1100px){
  .os-hero .os-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:clamp(40px,5vw,96px);align-items:end}
  .os-hero .os-wrap>*{grid-column:1}
  .os-hero .os-dests{grid-column:2;grid-row:1 / span 5;align-self:end;display:flex;flex-direction:column;align-items:flex-end;width:calc(var(--os-fit,1)*clamp(220px,18vw,290px));max-width:none;margin:0 max(0px,calc(min(100vw - var(--os-gutter)*2,var(--os-max))/2 - 50vw + 170px)) clamp(16px,3vh,40px) 0}   /* steps in from the right just enough to clear the floating chat buttons */
  .os-hero .os-dests.is-1,.os-hero .os-dests.is-2{max-width:none}
  .os-hero .os-dest{width:100%;flex:none}
  .os-hero .os-dest+.os-dest{margin-top:calc(var(--os-fit,1)*-44px)}
  .os-hero .os-dest:nth-child(1){z-index:3;rotate:-3deg;translate:-18% 0}
  .os-hero .os-dest:nth-child(2){z-index:2;rotate:2.5deg}
  .os-hero .os-dest:nth-child(3){z-index:1;rotate:-1.5deg;translate:-12% 0}
  .os-hero .os-dest:hover{z-index:5;rotate:0deg;scale:1.04}
}
/* Keep the text clear of the band wherever the band shows. */
@media(min-width:561px) and (min-height:501px){.os-hero .os-wrap{padding-top:max(calc(var(--os-fit,1)*clamp(90px,14vh,170px)),76px)}}
@media(max-width:760px){.os-hero-band span:nth-child(2){display:none}}
@media(max-width:560px){.os-hero-band{display:none}.os-hero .os-dest small::before{content:none}}
@media(max-height:500px) and (orientation:landscape){.os-hero-band{display:none}}

/* ---- In one minute ------------------------------------------------------------------------------
   Three cards in the site's own vocabulary rather than generic UI: the bordered "01 / Who" tag of the
   homepage collection cards, the hard offset shadow of the site's buttons (it stamps in as a card arrives
   and the card lifts into it on hover), leaf bullets from the range pages, and the orange arrow square of
   the collection cards. */
.os-minute{position:relative;overflow:hidden;background:var(--os-paper)}
.os-minute::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#1b2a1e1f 1px,transparent 1.3px);background-size:24px 24px;-webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 75%);mask-image:linear-gradient(180deg,#000 0%,transparent 75%);pointer-events:none}
.os-minute .os-wrap{position:relative}
.os-minute-head{margin-bottom:clamp(40px,5vw,68px)}
.os-minute-head h2{font-size:clamp(32px,4.6vw,58px);max-width:16ch;text-wrap:balance}
.os-trio{display:grid;grid-template-columns:repeat(var(--os-count,3),minmax(0,1fr));gap:clamp(20px,2.4vw,32px);align-items:stretch;padding:0 12px 12px 0}
.os-trio.is-1{--os-count:1;max-width:520px}.os-trio.is-2{--os-count:2;max-width:900px}
.os-card{--os-accent:var(--os-sage-deep);--os-shadow:var(--os-forest);position:relative;display:flex;flex-direction:column;overflow:hidden;isolation:isolate;padding:clamp(26px,2.8vw,38px);border:1px solid var(--os-forest);border-radius:4px;background:var(--os-cream);color:var(--os-forest);box-shadow:8px 8px 0 var(--os-shadow)}
.os-card.is-what{--os-accent:var(--os-orange);--os-shadow:var(--os-orange)}
.os-card.is-why{--os-accent:var(--os-sand)}
.os-page .os-trio .os-card{transition:opacity .9s var(--os-ease) var(--os-delay,0s),transform .9s var(--os-ease) var(--os-delay,0s),translate .45s var(--os-ease),box-shadow .5s var(--os-ease) calc(var(--os-delay,0s) + .25s)}
.os-trio .os-card.os-d1{--os-delay:.12s}.os-trio .os-card.os-d2{--os-delay:.24s}
.os-page.os-js .os-trio .os-card:not(.is-in){box-shadow:0 0 0 var(--os-shadow)}
.os-page .os-trio .os-card:hover{translate:-4px -4px;box-shadow:12px 12px 0 var(--os-shadow);transition-delay:0s}
/* The card word (Who / What / Why) runs in full as a vertical spine inside the card's right edge, behind the
   content: a faint accent outline over an even fainter fill, quiet enough to sit behind text. It drifts up
   and its outline strengthens slightly on hover. */
.os-card-ghost{position:absolute;top:50%;right:clamp(4px,.8vw,12px);z-index:-1;color:transparent;font:700 clamp(92px,7.6vw,128px)/1 var(--os-display);letter-spacing:-.03em;white-space:nowrap;writing-mode:vertical-rl;background:linear-gradient(90deg,color-mix(in srgb,var(--os-accent) 10%,transparent),color-mix(in srgb,var(--os-accent) 4%,transparent));-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:1px color-mix(in srgb,var(--os-accent) 32%,transparent);transform:translateY(-46%);pointer-events:none;user-select:none;transition:transform .9s var(--os-ease),-webkit-text-stroke-color .5s}
.os-card:hover .os-card-ghost{transform:translateY(-52%);-webkit-text-stroke-color:color-mix(in srgb,var(--os-accent) 50%,transparent)}
.os-card-q{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;margin:0 0 clamp(26px,2.6vw,34px)!important;padding:7px 12px;border:1px solid currentColor;background:#fffdf8;color:var(--os-forest);font:600 11px/1 var(--os-body);letter-spacing:.16em;text-transform:uppercase}
.os-card-q span{font:600 12px/1 var(--os-display);letter-spacing:0}
.os-card-q span::after{content:" /";color:var(--os-accent);filter:brightness(.85)}
.os-card h3{margin-bottom:20px;font-size:clamp(22px,2vw,28px);line-height:1.1;text-wrap:balance}
.os-card ul{display:grid;margin:0 0 26px;padding:0;list-style:none}
.os-card li{position:relative;padding:11px 0 11px 22px;border-top:1px dashed #1b2a1e24;color:var(--os-muted);font-size:15px;line-height:1.5}
.os-card li:first-child{border-top:0;padding-top:0}
.os-card li::before{content:"";position:absolute;left:0;top:17px;width:9px;height:9px;border-radius:0 100%;background:var(--os-accent)}
.os-card li:first-child::before{top:6px}
.os-card .os-link{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;margin-top:auto;padding:18px 0 0;border:0;border-top:1px solid #1b2a1e24;color:inherit;font:600 15px/1.2 var(--os-body);text-decoration:none}
.os-card .os-link:hover{color:inherit}
.os-card .os-link span{display:grid;place-items:center;flex:none;width:42px;height:42px;border:1px solid var(--os-forest);background:var(--os-accent);color:var(--os-forest);font-size:16px;transition:transform .45s var(--os-ease)}
.os-card:hover .os-link span{transform:rotate(-45deg)}
@media(max-width:900px){.os-trio{grid-template-columns:1fr;max-width:620px}}
@media(max-width:560px){
  .os-trio{gap:22px;padding:0 8px 8px 0}
  .os-card{padding:24px 22px;box-shadow:6px 6px 0 var(--os-shadow)}
  .os-card-ghost{font-size:84px}
  .os-page .os-trio .os-card:hover{translate:-3px -3px;box-shadow:9px 9px 0 var(--os-shadow)}
}

/* ---- Who · our story ----------------------------------------------------------------------------- */
.os-story{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(30px,6vw,90px);align-items:center}
.os-story.is-text{grid-template-columns:minmax(0,1fr);max-width:820px}
.os-story h2{font-size:clamp(32px,4.4vw,56px);margin-bottom:22px;max-width:14ch}
.os-story p+p{margin-top:16px}
.os-pull{margin:26px 0;padding-left:20px;border-left:3px solid var(--os-orange);font:500 clamp(19px,1.8vw,23px)/1.45 var(--os-display);color:var(--os-green)}
.os-pull span{display:block}
.os-jump{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.os-jump a{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1px solid var(--os-line);border-radius:999px;background:var(--os-cream);color:var(--os-forest);text-decoration:none;font-weight:600;font-size:14px;transition:background .2s,border-color .2s,color .2s}
.os-jump a:hover{background:var(--os-forest);border-color:var(--os-forest);color:var(--os-cream)}
.os-collage{position:relative;aspect-ratio:4/5}
.os-collage figure{position:absolute;margin:0;overflow:hidden;border-radius:var(--os-radius);box-shadow:0 30px 60px -36px #1b2a1e}
.os-collage figure img{width:100%;height:100%;object-fit:cover}
.os-collage .is-a{inset:0 18% 26% 0}
.os-collage .is-b{inset:44% 0 0 34%;border:8px solid var(--os-cream)}
.os-collage.is-single .is-a{inset:0}
.os-badge{position:absolute;left:4%;bottom:6%;z-index:2;margin:0;padding:14px 18px;border-radius:16px;background:var(--os-orange);font:600 15px/1.2 var(--os-display);box-shadow:4px 4px 0 var(--os-forest);transform:rotate(-3deg)}
.os-badge small{display:block;font:600 10px/1.2 var(--os-body);letter-spacing:.14em;text-transform:uppercase;opacity:.8}
@media(max-width:900px){.os-story{grid-template-columns:1fr}.os-collage{max-width:520px}}

/* ---- What · where we go: three panels, one open at a time ---------------------------------------- */
.os-what{background:var(--os-forest);color:var(--os-cream)}
.os-what .os-eyebrow{color:var(--os-gold)}
.os-what-head{max-width:760px;margin-bottom:clamp(34px,5vw,56px)}
.os-what-head h2{font-size:clamp(32px,4.4vw,56px);margin-bottom:18px}
.os-what-head .os-lead{color:#fcf9f2cc}
.os-vista{--os-open:3.4;display:flex;gap:clamp(8px,1vw,14px);height:clamp(560px,78vh,700px)}
.os-vista.is-1{--os-open:1}
.os-panel{position:relative;flex:1 1 0;min-width:0;overflow:hidden;isolation:isolate;border-radius:var(--os-radius);background:var(--os-green);transition:flex-grow .8s var(--os-ease)}
.os-panel.is-open{flex-grow:var(--os-open)}
.os-panel::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#1b2a1e66 0%,transparent 28%,#1b2a1ecc 66%,#1b2a1ef7 100%)}
.os-panel-media{position:absolute;inset:0;z-index:-2}
.os-panel-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);filter:saturate(.75) brightness(.8);transition:transform 1.4s var(--os-ease),filter .6s}
.os-panel.is-open .os-panel-media img{transform:scale(1);filter:none}
.os-panel:not(.is-open):hover .os-panel-media img{filter:saturate(.95) brightness(.95)}
.os-panel-tab{position:absolute;inset:0;z-index:2;display:block;width:100%;padding:0;margin:0;border:0;border-radius:0;background:none;color:var(--os-cream);font:inherit;text-align:left;cursor:pointer}
.os-panel.is-open .os-panel-tab{bottom:auto;height:72px;cursor:default}
.os-panel-tab:focus-visible{outline:3px solid var(--os-orange);outline-offset:-3px;border-radius:var(--os-radius)}
.os-panel-num{position:absolute;left:clamp(16px,1.8vw,26px);top:clamp(18px,1.8vw,26px);font:600 13px/1 var(--os-body);letter-spacing:.14em;color:var(--os-gold);white-space:nowrap}
.os-panel-num i{font-style:normal;color:var(--os-cream);letter-spacing:.08em;opacity:0;transition:opacity .4s}
.os-panel.is-open .os-panel-num i{opacity:1;transition-delay:.4s}
.os-panel-name{position:absolute;left:clamp(12px,1.4vw,22px);bottom:clamp(20px,2.2vw,30px);writing-mode:vertical-rl;transform:rotate(180deg);font:600 clamp(26px,2.8vw,38px)/1 var(--os-display);letter-spacing:-.02em;white-space:nowrap;transition:opacity .3s}
.os-panel-plus{position:absolute;right:clamp(12px,1.4vw,20px);top:clamp(12px,1.4vw,18px);display:grid;place-items:center;width:38px;height:38px;border:1px solid #fcf9f266;border-radius:50%;font-size:20px;line-height:1;transition:transform .4s var(--os-ease),background .3s,color .3s,border-color .3s,opacity .3s}
.os-panel:not(.is-open) .os-panel-tab:hover .os-panel-plus{background:var(--os-orange);border-color:var(--os-orange);color:var(--os-forest);transform:rotate(90deg)}
.os-panel.is-open .os-panel-name,.os-panel.is-open .os-panel-plus{opacity:0}
/* The story fades in once the panel has opened; its width is fixed so text never reflows mid-animation. */
.os-panel-body{position:absolute;left:0;bottom:0;width:min(600px,calc((min(100vw - var(--os-gutter)*2,var(--os-max)) - 40px)*.6));padding:clamp(22px,2.6vw,40px);opacity:0;visibility:hidden;transform:translateY(18px);transition:opacity .3s,transform .5s var(--os-ease),visibility 0s .3s}
.os-vista.is-1 .os-panel-body{width:min(640px,100%)}
.os-panel.is-open .os-panel-body{opacity:1;visibility:visible;transform:none;transition:opacity .6s .35s,transform .8s .35s var(--os-ease),visibility 0s}
.os-panel-kicker{margin-bottom:10px!important;font:600 12px/1.3 var(--os-body);letter-spacing:.14em;text-transform:uppercase;color:var(--os-gold)}
.os-panel-body h3{margin-bottom:14px;font-size:clamp(28px,3vw,42px);text-wrap:balance}
.os-panel-text{max-width:46ch;color:#fcf9f2d9;font-size:clamp(15px,1.2vw,17px)}
.os-chips{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.os-chips li{padding:7px 12px;border:1px solid #fcf9f240;border-radius:999px;background:#fcf9f214;font-size:13px;font-weight:500;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.os-source{margin-top:14px!important;font-size:12px;color:#fcf9f2a6}
.os-source a{color:var(--os-cream)}
.os-panel-body .os-btn{margin-top:22px}
@media(max-width:760px){
  .os-vista{flex-direction:column;height:auto}
  .os-panel{flex:none;transition:none}
  .os-panel:not(.is-open) .os-panel-tab{position:relative;display:flex;align-items:center;gap:14px;height:84px;padding:0 18px}
  .os-panel:not(.is-open) .os-panel-tab>*{position:static;transform:none}
  .os-panel:not(.is-open) .os-panel-num i{display:none}
  .os-panel-name{writing-mode:horizontal-tb;font-size:24px}
  .os-panel-plus{margin-left:auto}
  .os-panel::after{background:linear-gradient(180deg,#1b2a1e59 0%,transparent 18%,#1b2a1ee6 44%,#1b2a1e 62%)}
  .os-panel:not(.is-open)::after{background:linear-gradient(90deg,#1b2a1ee6,#1b2a1e99)}
  .os-panel:not(.is-open) .os-panel-body{display:none}
  .os-panel.is-open .os-panel-body{position:relative;width:auto;padding:clamp(210px,60vw,320px) 20px 24px}
  .os-panel-body .os-btn{display:flex;width:100%}
  /* The other places' bars sit above the open card, so switching never needs a scroll down past it. */
  .os-panel.is-open{order:1}
}

/* ---- Gallery (opens in the site's shared gallery viewer) ------------------------------------------ */
.os-gallery-head{max-width:760px;margin-bottom:clamp(28px,4vw,46px)}
.os-gallery-head h2{font-size:clamp(32px,4.4vw,56px);margin-bottom:14px}
.os-gallery-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(150px,18vw,240px);gap:clamp(8px,1.2vw,14px)}
.os-gallery-grid .gallery-item{position:relative;display:block;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:16px;overflow:hidden;background:var(--os-paper);cursor:zoom-in}
.os-gallery-grid .gallery-item:nth-child(6n+1){grid-column:span 2;grid-row:span 2}
.os-gallery-grid .gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--os-ease)}
.os-gallery-grid .gallery-item:hover img{transform:scale(1.05)}
.os-gallery-grid .gallery-item:focus-visible{outline:3px solid var(--os-orange);outline-offset:3px}
@media(max-width:900px){.os-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.os-gallery-grid{grid-auto-rows:150px}.os-gallery-grid .gallery-item:nth-child(6n+1){grid-column:span 2;grid-row:span 1}}

/* ---- Why --------------------------------------------------------------------------------------- */
.os-why{background:var(--os-paper)}
.os-why-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,5vw,80px);align-items:center}
.os-why-grid.is-text{grid-template-columns:minmax(0,1fr)}
.os-why h2{font-size:clamp(32px,4.4vw,56px);margin-bottom:26px;max-width:14ch}
.os-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.os-point{padding:22px;border-radius:18px;background:var(--os-cream);border:1px solid var(--os-line);transition:transform .3s var(--os-ease)}
.os-point:hover{transform:translateY(-3px)}
.os-point-icon{display:grid;place-items:center;width:46px;height:46px;margin-bottom:14px;border-radius:14px;background:var(--os-sage);font-size:20px}
.os-point h3{font-size:19px;margin-bottom:6px}
.os-point p{font-size:14px;color:var(--os-muted)}
.os-why-photos{position:relative;aspect-ratio:1/1}
.os-why-photos figure{position:absolute;margin:0;border-radius:var(--os-radius);overflow:hidden;box-shadow:0 30px 60px -36px #1b2a1e}
.os-why-photos img{width:100%;height:100%;object-fit:cover}
.os-why-photos .is-a{inset:0 22% 22% 0}
.os-why-photos .is-b{inset:42% 0 0 38%;border:8px solid var(--os-paper);border-radius:28px}
.os-why-photos.is-single .is-a{inset:0}
@media(max-width:900px){.os-why-grid{grid-template-columns:1fr}.os-why-photos{max-width:520px}}
@media(max-width:480px){.os-points{grid-template-columns:1fr}}

/* ---- CTA ---------------------------------------------------------------------------------------- */
.os-cta{position:relative;color:var(--os-cream);background:var(--os-forest);overflow:hidden;isolation:isolate}
.os-cta-media{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.os-cta::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#1b2a1ecc,#1b2a1ef5)}
.os-cta .os-wrap{padding:clamp(80px,12vw,150px) 0;text-align:center}
.os-cta .os-eyebrow{color:var(--os-gold)}
.os-cta h2{font-size:clamp(38px,6vw,84px);max-width:13ch;margin:0 auto 20px}
.os-cta .os-lead{color:#fcf9f2cc;max-width:58ch;margin:0 auto}
.os-cta-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:34px}
.os-cta .os-btn.is-ghost{color:var(--os-cream)}
.os-cta-phone{margin-top:28px!important;font-size:15px;color:#fcf9f2cc}
.os-cta-phone a{color:var(--os-cream);font-weight:700;text-decoration:none}

/* ---- Field-journal finish for the remaining sections ---------------------------------------------------
   The same vocabulary as the hero and the "In one minute" cards: the 
︎ eyebrow, 1px forest borders with
   square corners, hard offset shadows (they stamp in as a block arrives and deepen on hover), bordered tags
   instead of pills, and rectangular buttons. Markup and behaviour are unchanged. */
.os-page .os-section .os-eyebrow::before,.os-cta .os-eyebrow::before{content:"
︎";width:auto;height:auto;background:none;color:var(--os-orange);font-size:15px;letter-spacing:0}
.os-page .os-btn{border-radius:2px}
.os-section h2{text-wrap:balance}
/* Story: photos as pinned prints, the badge as a stamped tag, place links as bordered tags. */
.os-collage figure{border:1px solid var(--os-forest);border-radius:3px;box-shadow:8px 8px 0 var(--os-forest);transition:translate .5s var(--os-ease),box-shadow .5s var(--os-ease)}
.os-collage .is-a{rotate:-1.2deg}
.os-collage .is-b{border:6px solid var(--os-cream);outline:1px solid var(--os-forest);box-shadow:8px 8px 0 var(--os-orange);rotate:2deg}
.os-collage figure:hover{translate:-3px -3px;box-shadow:11px 11px 0 var(--os-forest)}
.os-collage .is-b:hover{box-shadow:11px 11px 0 var(--os-orange)}
.os-badge{border:1px solid var(--os-forest);border-radius:2px;box-shadow:5px 5px 0 var(--os-forest);rotate:-2deg}
.os-pull{position:relative;margin-top:44px;border-left:2px solid var(--os-orange);padding-left:24px}
.os-pull::before{content:"“";position:absolute;left:-2px;top:-34px;color:var(--os-orange);font:700 52px/1 Georgia,"Times New Roman",serif;opacity:.4}
.os-jump a{border:1px solid var(--os-forest);border-radius:2px;background:transparent;color:var(--os-forest);font-weight:600;transition:translate .3s var(--os-ease),box-shadow .3s var(--os-ease),background .3s,color .3s}
.os-jump a:hover{translate:-2px -2px;background:var(--os-forest);color:var(--os-cream);box-shadow:4px 4px 0 var(--os-orange)}
/* Where we go: framed panels, the open one carries the orange stamp; square controls and tags. */
.os-vista{padding:0 10px 10px 0}
.os-panel{border:1px solid var(--os-forest);border-radius:4px;transition:flex-grow .8s var(--os-ease),box-shadow .6s var(--os-ease)}
.os-panel.is-open{box-shadow:8px 8px 0 var(--os-orange)}
.os-panel-tab:focus-visible{border-radius:4px}
.os-panel-plus{border-radius:2px}
.os-panel-num{padding:6px 10px;border:1px solid #fcf9f266;background:#1b2a1e8c}
.os-panel:not(.is-open) .os-panel-num i{display:none}
.os-chips li{border-radius:2px;border-color:#fcf9f259}
.os-panel-body .os-btn{box-shadow:4px 4px 0 var(--os-cream)}
.os-panel-body .os-btn:hover{box-shadow:6px 6px 0 var(--os-cream)}
/* Gallery: framed prints that lift into an orange stamp. */
.os-gallery-grid{padding:0 8px 8px 0}
.os-gallery-grid .gallery-item{border:1px solid var(--os-forest);border-radius:3px;transition:translate .45s var(--os-ease),box-shadow .45s var(--os-ease)}
.os-gallery-grid .gallery-item:hover,.os-gallery-grid .gallery-item:focus-visible{translate:-3px -3px;box-shadow:6px 6px 0 var(--os-orange)}
/* Why: points as stamped cards with a bordered icon tile; photos as pinned prints. */
.os-points{padding:0 8px 8px 0;gap:18px}
.os-point{border:1px solid var(--os-forest);border-radius:4px;box-shadow:6px 6px 0 var(--os-forest);transition:translate .4s var(--os-ease),box-shadow .4s var(--os-ease)}
.os-point:nth-child(4n+2),.os-point:nth-child(4n+3){box-shadow:6px 6px 0 var(--os-orange)}
.os-point:hover{transform:none;translate:-3px -3px;box-shadow:9px 9px 0 var(--os-forest)}
.os-point:nth-child(4n+2):hover,.os-point:nth-child(4n+3):hover{box-shadow:9px 9px 0 var(--os-orange)}
.os-point-icon{border:1px solid var(--os-forest);border-radius:2px;background:var(--os-paper)}
.os-why-photos figure{border:1px solid var(--os-forest);border-radius:3px;box-shadow:8px 8px 0 var(--os-forest)}
.os-why-photos .is-a{rotate:1.2deg}
.os-why-photos .is-b{border:6px solid var(--os-paper);outline:1px solid var(--os-forest);border-radius:3px;box-shadow:8px 8px 0 var(--os-orange);rotate:-2deg}
/* Closing call: a hairline field frame inside the photo, hard-shadow buttons as in the hero. */
.os-cta::after{content:"";position:absolute;inset:clamp(12px,2vw,28px);border:1px solid #fcf9f22e;pointer-events:none}
.os-cta .os-btn{border-color:var(--os-forest);box-shadow:4px 4px 0 #fcf9f2e6}
.os-cta .os-btn:hover{box-shadow:6px 6px 0 var(--os-cream)}
.os-cta .os-btn.is-ghost{border-color:#fcf9f2b3;box-shadow:none}
.os-cta .os-btn.is-ghost:hover{background:#fcf9f214;border-color:var(--os-cream);box-shadow:4px 4px 0 var(--os-orange);transform:translate(-2px,-2px)}
@media(max-width:760px){.os-panel.is-open{box-shadow:6px 6px 0 var(--os-orange)}.os-vista{gap:12px}}
@media(max-width:560px){
  .os-collage figure,.os-why-photos figure{box-shadow:5px 5px 0 var(--os-forest)}
  .os-collage .is-b,.os-why-photos .is-b{box-shadow:5px 5px 0 var(--os-orange)}
  .os-points{gap:16px}
  .os-point{box-shadow:5px 5px 0 var(--os-forest)}
  .os-point:nth-child(4n+2),.os-point:nth-child(4n+3){box-shadow:5px 5px 0 var(--os-orange)}
}
@media(max-width:480px){.os-points{grid-template-columns:1fr}}

/* ---- Section motion (story.js adds the classes, so nothing stays hidden without it) ----------------- */
.os-page.os-js .os-wipe{clip-path:inset(100% 0 0 0);transition:clip-path 1.1s var(--os-ease) calc(var(--os-i,0)*.12s),translate .5s var(--os-ease),box-shadow .5s var(--os-ease)}
.os-page.os-js .os-wipe.is-in{clip-path:inset(-20px -20px -20px -20px)}
.os-page.os-js .os-wipe img{scale:1.18;transition:scale 1.6s var(--os-ease) calc(var(--os-i,0)*.12s)}
.os-page.os-js .os-wipe.is-in img{scale:1}
.os-collage figure,.os-why-photos figure{transform:translateY(var(--os-par,0px))}
.os-page.os-js .os-up{opacity:0;translate:0 22px;transition:opacity .7s var(--os-ease) calc(var(--os-i,0)*.09s),translate .8s var(--os-ease) calc(var(--os-i,0)*.09s),box-shadow .4s var(--os-ease),background .3s,color .3s}
.os-page.os-js .os-up.is-in{opacity:1;translate:0 0}
.os-page.os-js .os-up.is-in:hover{translate:-3px -3px;transition-delay:0s}
.os-section .os-eyebrow::after{content:"";width:0;height:1px;margin-left:4px;background:var(--os-orange);transition:width 1.2s var(--os-ease) .3s}
.os-section .is-in .os-eyebrow::after,.os-section .os-eyebrow.is-in::after{width:40px}

/* Section entrance (story.js sets --os-enter from 0 to 1 while a section scrolls up into view). */
.os-sections-move .os-entering{clip-path:inset(0 calc((1 - var(--os-enter,1))*5vw) 0 calc((1 - var(--os-enter,1))*5vw) round calc((1 - var(--os-enter,1))*44px))}
.os-sections-move .os-entering>.os-wrap{opacity:calc(.25 + var(--os-enter,1)*.75);transform:translateY(calc((1 - var(--os-enter,1))*70px)) scale(calc(.97 + var(--os-enter,1)*.03))}
@media(prefers-reduced-motion:reduce){.os-sections-move .os-entering{clip-path:none}.os-sections-move .os-entering>.os-wrap{opacity:1;transform:none}}
html.reduce-motion .os-sections-move .os-entering{clip-path:none}
html.reduce-motion .os-sections-move .os-entering>.os-wrap{opacity:1;transform:none}

/* ---- Small screens --------------------------------------------------------------------------------- */
@media(max-width:560px){
  .os-collage{aspect-ratio:1/1}
  .os-badge{font-size:13px;padding:10px 12px}
  .os-hero-actions .os-btn{flex:1 1 auto}
  .os-cta-actions .os-btn{width:100%}
}
@media(max-width:380px){.os-panel-body .os-btn{padding-inline:14px;font-size:14px}}
@media(max-width:360px){
  .os-dest small{font-size:8px}.os-dest b{font-size:12px;left:8px;right:8px;bottom:8px}
  .os-point{padding:18px}
}
@media(max-height:500px) and (orientation:landscape){.os-hero .os-wrap{padding-top:calc(var(--os-fit,1)*60px)}.os-dests{display:none}.os-hero h1{font-size:calc(max(.5,var(--os-fit,1))*clamp(40px,7.2vw,96px))}}
/* Phones: the title uses the full width (fewer lines) and never drops below about 25px; spacing and tiles
   give way first. On very cramped screens story.js adds os-compact and the tiles step aside (they are
   shortcuts to sections further down the page). */
@media(max-width:560px){
  .os-hero .os-wrap{padding-top:calc(var(--os-fit,1)*40px)}
  .os-hero h1{max-width:none;font-size:calc(max(.62,var(--os-fit,1))*clamp(40px,7.2vw,96px))}
  .os-hero .os-lead{line-height:1.5}
  .os-hero-actions{gap:10px}
  .os-dest{aspect-ratio:auto;height:calc(var(--os-fit,1)*clamp(64px,24vw,110px))}
}
.os-hero.os-compact .os-dests{display:none}

/* ---- Lift-up (the site curtain, curtain.js): as on the range pages, the hero stays pinned and recedes
   (scales back, rounds, darkens, its words drift up) while the next section rises over it on a rounded
   paper sheet whose corners flatten as it reaches the header. Only active while the curtain is enabled. */
.os-page .curtain-enabled{--os-sheet-radius:clamp(24px,3.5vw,56px)}
.os-page .curtain-enabled .os-hero{--os-overlap:var(--os-sheet-radius)}   /* the sheet tucks up by its radius */
.os-page .curtain-enabled>.curtain-hero{transform:scale(calc(1 - var(--curtain-progress,0)*.06));transform-origin:50% 0;border-radius:calc(var(--curtain-progress,0)*26px);overflow:hidden}
.os-page .curtain-enabled>.curtain-hero:after{opacity:calc(var(--curtain-progress,0)*.55)}
.os-page .curtain-enabled .os-hero .os-wrap{opacity:calc(1 - var(--curtain-progress,0)*1.6);transform:translateY(calc(var(--curtain-progress,0)*-60px))}
.os-page .curtain-page.curtain-enabled>.curtain-sheet{padding-top:0;background:var(--os-cream);border-top-left-radius:calc((1 - var(--curtain-progress,0))*var(--os-sheet-radius));border-top-right-radius:calc((1 - var(--curtain-progress,0))*var(--os-sheet-radius))}
.os-page .curtain-enabled>.curtain-sheet>:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}
@media(max-width:600px){.os-page .curtain-enabled{--os-sheet-radius:28px}}

/* ---- Reveal on scroll (only once story.js is running, so content never stays hidden) -------------- */
.os-page.os-js .os-reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--os-ease),transform .9s var(--os-ease)}
.os-page.os-js .os-reveal.is-in{opacity:1;transform:none}
.os-page .os-d1{transition-delay:.1s}.os-page .os-d2{transition-delay:.2s}.os-page .os-d3{transition-delay:.3s}
@media(prefers-reduced-motion:reduce){
  .os-page *,.os-page *::before,.os-page *::after{animation:none!important;transition:none!important}
  .os-page.os-js .os-reveal{opacity:1;transform:none}
}
html.reduce-motion .os-page *,html.reduce-motion .os-page *::before,html.reduce-motion .os-page *::after{animation:none!important;transition:none!important}
html.reduce-motion .os-page.os-js .os-reveal{opacity:1;transform:none}