/* ==========================================================================
   Seagate Works — site.css
   Paper, ink, terracotta. Cormorant Garamond for display, Jost for text.
   ========================================================================== */

:root{
  --paper:#FBF8F2;
  --paper-deep:#F3EDE2;
  --paper-warm:#F7F1E6;
  --ink:#2B2622;
  --ink-deep:#1E1A17;
  --ink-soft:#6B615A;
  --ink-mute:#9A8F86;
  --stucco:#E9B79A;
  --stucco-tint:#F7E6DA;
  --terracotta:#B95F3B;
  --terracotta-deep:#9E4E2E;
  --palm:#6F7F52;
  --sky:#DCE6EC;
  --line:rgba(43,38,34,.14);
  --line-strong:rgba(43,38,34,.28);
  --line-light:rgba(251,248,242,.18);

  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Jost','Helvetica Neue',Arial,sans-serif;

  --gutter:clamp(20px,5vw,72px);
  --measure:58ch;
  --max:1440px;
  --max-text:1160px;

  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --dur:.9s;
  --header-h:84px;
}

/* ---- reset & base ---------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-weight:300;font-size:1rem;line-height:1.7;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:clip;
}
h1,h2,h3,h4,.serif{font-family:var(--serif);font-weight:400;margin:0;text-wrap:balance;line-height:1.08;letter-spacing:-.005em;}
h1 em,h2 em,h3 em,.serif em{font-style:italic;color:var(--terracotta);}
p{margin:0 0 1.1em;}
p:last-child{margin-bottom:0;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;height:auto;display:block;}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;}
address{font-style:normal;}
::selection{background:var(--stucco-tint);color:var(--ink);}
:focus-visible{outline:1.5px solid var(--terracotta);outline-offset:4px;border-radius:2px;}
[hidden]{display:none !important;}

.skip{position:absolute;left:-999px;top:12px;z-index:1000;background:var(--ink);color:var(--paper);padding:10px 16px;font-size:.8rem;}
.skip:focus{left:12px;}

/* Cross-document page transitions (progressive; Chrome/Safari 18+) */
@view-transition{navigation:auto;}
::view-transition-old(root){animation:vt-out .32s var(--ease-in-out) both;}
::view-transition-new(root){animation:vt-in .5s var(--ease-out) both;}
@keyframes vt-out{to{opacity:0;}}
@keyframes vt-in{from{opacity:0;transform:translateY(10px);}}

/* ---- type utilities -------------------------------------------------- */
.caps{font-family:var(--sans);font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-soft);font-weight:400;}
.eyebrow{display:block;margin-bottom:20px;color:var(--terracotta);font-size:.66rem;letter-spacing:.32em;text-transform:uppercase;font-weight:400;}
.eyebrow--light{color:var(--stucco);}
.eyebrow--center{text-align:center;}
.lede{font-size:clamp(1.05rem,1.4vw,1.2rem);color:var(--ink-soft);line-height:1.65;max-width:48ch;}
.measure{max-width:var(--measure);}
.muted{color:var(--ink-soft);}

.display-xl{font-size:clamp(2.9rem,7.2vw,6.4rem);line-height:.98;letter-spacing:-.015em;}
.display-lg{font-size:clamp(2.4rem,5.2vw,4.2rem);line-height:1.02;letter-spacing:-.01em;}
.display-md{font-size:clamp(2rem,3.8vw,3.1rem);line-height:1.08;}
.display-sm{font-size:clamp(1.55rem,2.6vw,2.2rem);line-height:1.15;}

/* ---- links & buttons ------------------------------------------------- */
.link-line{
  display:inline-flex;align-items:center;gap:14px;
  font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;font-weight:400;color:var(--ink);
  padding-bottom:6px;position:relative;
}
.link-line::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--terracotta);
  transform-origin:left;transition:transform .5s var(--ease-out);
}
.link-line:hover::after{transform:scaleX(.6);}
.link-line .arrow{transition:transform .5s var(--ease-out);}
.link-line:hover .arrow{transform:translateX(6px);}
.link-line--light{color:var(--paper);}
.link-line--light::after{background:var(--stucco);}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  padding:17px 40px;border:1px solid var(--ink);border-radius:999px;
  font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;font-weight:400;color:var(--ink);
  position:relative;overflow:hidden;isolation:isolate;
  transition:color .45s var(--ease-out),border-color .45s var(--ease-out),transform .45s var(--ease-out);
}
.btn::before{
  content:"";position:absolute;inset:0;background:var(--ink);z-index:-1;
  transform:translateY(101%);transition:transform .55s var(--ease-out);
}
.btn:hover{color:var(--paper);}
.btn:hover::before{transform:translateY(0);}
.btn:active{transform:scale(.985);}
.btn--fill{background:var(--ink);color:var(--paper);}
.btn--fill::before{background:var(--terracotta);}
.btn--fill:hover{border-color:var(--terracotta);}
.btn--light{border-color:rgba(251,248,242,.6);color:var(--paper);}
.btn--light::before{background:var(--paper);}
.btn--light:hover{color:var(--ink);border-color:var(--paper);}
.btn--small{padding:12px 24px;font-size:.62rem;letter-spacing:.22em;}
.btn--wide{width:100%;}

/* ---- header ---------------------------------------------------------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  transition:background .5s var(--ease-out),box-shadow .5s var(--ease-out),transform .6s var(--ease-out);
}
.site-header::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);
  opacity:0;transition:opacity .5s;
}
.site-header.is-scrolled{background:rgba(251,248,242,.82);-webkit-backdrop-filter:saturate(1.4) blur(18px);backdrop-filter:saturate(1.4) blur(18px);}
.site-header.is-scrolled::after{opacity:1;}
.site-header.is-hidden{transform:translateY(-100%);}
/* With the menu open the panel scrolls beneath the fixed header, so the
   header needs its own ground or the wordmark collides with the menu items
   passing under it. It also must never hide while the menu is open. */
body.menu-open .site-header{background:var(--paper);transform:none;}
.site-header__inner{
  max-width:var(--max);margin:0 auto;height:var(--header-h);
  padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.brand{display:block;flex:none;}
.brand__mark{width:clamp(210px,18vw,244px);height:auto;transition:opacity .3s;}
.brand:hover .brand__mark{opacity:.72;}

.nav{display:none;}
@media (min-width:1120px){.nav{display:block;}}
.nav__list{list-style:none;margin:0;padding:0;display:flex;gap:6px;}
.nav__item{position:relative;}
.nav__link{
  display:inline-flex;align-items:center;gap:8px;padding:12px 13px;
  font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;font-weight:400;color:var(--ink);
  position:relative;white-space:nowrap;
}
.nav__link::after{
  content:"";position:absolute;left:13px;right:13px;bottom:6px;height:1px;background:var(--terracotta);
  transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease-out);
}
.nav__item:hover>.nav__link::after,.nav__item.is-open>.nav__link::after{transform:scaleX(1);}
html[data-nav="spaces"] .nav__item:nth-child(1)>.nav__link::after,
html[data-nav="solutions"] .nav__item:nth-child(2)>.nav__link::after{transform:scaleX(1);}
.has-sub>.nav__link::before{
  content:"";width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:translateY(-2px) rotate(45deg);order:2;transition:transform .3s;
}
.nav__item.is-open>.nav__link::before{transform:translateY(1px) rotate(225deg);}
.nav__sub{
  position:absolute;top:calc(100% + 6px);left:4px;min-width:250px;
  background:rgba(251,248,242,.96);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border:1px solid var(--line);padding:10px;
  box-shadow:0 24px 60px -20px rgba(43,38,34,.25);
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .35s var(--ease-out),transform .35s var(--ease-out),visibility .35s;
}
.nav__item:hover>.nav__sub,.nav__item.is-open>.nav__sub,.nav__item:focus-within>.nav__sub{opacity:1;visibility:visible;transform:translateY(0);}
.nav__sub a{display:flex;flex-direction:column;gap:2px;padding:12px 16px;border-radius:2px;transition:background .25s;}
.nav__sub a:hover{background:var(--stucco-tint);}
.nav__sub-name{font-family:var(--serif);font-size:1.15rem;line-height:1.1;}
.nav__sub-desc{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);}

.site-header__actions{display:flex;align-items:center;gap:22px;}
/* Header controls sit on one row and must never break: "Request a Tour"
   wrapping is what made the button twice as tall as the row. Scoped to the
   header because the consent banner buttons DO need to wrap on a 320px phone. */
.site-header__actions .btn{white-space:nowrap;}
.nav__login{display:none;white-space:nowrap;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);transition:color .3s;}
.nav__login:hover{color:var(--terracotta);}
@media (min-width:1180px){.nav__login{display:inline-block;}}
.site-header__actions .btn--small{display:none;}
@media (min-width:640px){.site-header__actions .btn--small{display:inline-flex;}}

.burger{
  width:44px;height:44px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;
  margin-right:-10px;
}
@media (min-width:1120px){.burger{display:none;}}
.burger__line{width:24px;height:1px;background:var(--ink);transition:transform .5s var(--ease-out),opacity .3s;}
.burger[aria-expanded="true"] .burger__line:first-child{transform:translateY(3.5px) rotate(45deg);}
.burger[aria-expanded="true"] .burger__line:last-child{transform:translateY(-3.5px) rotate(-45deg);}

/* ---- mobile menu ----------------------------------------------------- */
.mobile-menu{
  position:fixed;inset:0;z-index:90;background:var(--paper);
  padding-top:var(--header-h);overflow-y:auto;
  clip-path:inset(0 0 100% 0);visibility:hidden;
  transition:clip-path .7s var(--ease-in-out),visibility .7s;
}
.mobile-menu.is-open{clip-path:inset(0 0 0 0);visibility:visible;}
.mobile-menu__inner{padding:24px var(--gutter) 48px;max-width:640px;}
.mobile-menu__group{padding:22px 0;border-bottom:1px solid var(--line);}
.mobile-menu__group .eyebrow{margin-bottom:10px;}
.mobile-menu__group a{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  font-family:var(--serif);font-size:clamp(1.55rem,5.4vw,2.1rem);line-height:1.2;padding:6px 0;
  opacity:0;transform:translateY(16px);
}
/* The descriptor holds one line on the right and never competes with the name
   for width; the name takes what is left. Without this a long label wraps and
   the descriptor floats away from the line it belongs to. */
.mobile-menu__group a small{
  flex:0 0 auto;white-space:nowrap;text-align:right;
  font-family:var(--sans);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);
}
.mobile-menu.is-open .mobile-menu__group a{
  animation:menu-in .8s var(--ease-out) forwards;
  animation-delay:calc(.25s + var(--i,0)*.05s);
}
@keyframes menu-in{to{opacity:1;transform:none;}}
.mobile-menu__cta{margin-top:30px;width:100%;}
.mobile-menu__foot{margin-top:24px;}
body.menu-open{overflow:hidden;}

/* ---- sections & layout ---------------------------------------------- */
.section{padding:clamp(80px,10vw,150px) var(--gutter);}
.section--tight{padding-top:clamp(56px,7vw,100px);padding-bottom:clamp(56px,7vw,100px);}
.section--flush-top{padding-top:0;}
.section--deep{background:var(--paper-deep);}
.section--ink{background:var(--ink-deep);color:var(--paper);}
.section--ink .eyebrow{color:var(--stucco);}
.section--ink .muted,.section--ink .lede{color:rgba(251,248,242,.66);}
.section--hairline{border-top:1px solid var(--line);}
.wrap{max-width:var(--max);margin:0 auto;}
.wrap--text{max-width:var(--max-text);margin:0 auto;}
.center{text-align:center;}
.center .lede{margin-left:auto;margin-right:auto;}
.head{max-width:680px;margin:0 auto clamp(48px,6vw,80px);text-align:center;}
.head .lede{margin:18px auto 0;}
.rule{height:1px;background:var(--line);border:0;margin:0;}
.hairline{width:32px;height:1px;background:var(--terracotta);margin:26px auto;}

/* ---- reveal ---------------------------------------------------------- */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity var(--dur) var(--ease-out),transform var(--dur) var(--ease-out);transition-delay:var(--d,0s);will-change:opacity,transform;}
[data-reveal="fade"]{transform:none;}
[data-reveal="scale"]{transform:scale(.96);}
[data-reveal].is-in{opacity:1;transform:none;}
.stagger>*{--d:calc(var(--i,0)*.09s);}

/* split-line headline reveal */
.lines .line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em;}
.lines .line>span{display:block;transform:translateY(110%);transition:transform 1.1s var(--ease-out);transition-delay:calc(.15s + var(--i,0)*.11s);}
.lines.is-in .line>span{transform:none;}

/* ---- hero ------------------------------------------------------------ */
.hero{
  position:relative;padding:calc(var(--header-h) + clamp(20px,4vw,48px)) var(--gutter) 0;
  text-align:center;overflow:hidden;
}
.hero__plate{
  position:relative;max-width:1360px;margin:0 auto;aspect-ratio:16/9;overflow:hidden;
}
.hero__plate img{
  width:100%;height:100%;object-fit:cover;object-position:center 60%;
  transform:scale(1.08);opacity:0;
  animation:hero-in 2.6s var(--ease-out) forwards;
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 74%,transparent 100%),linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to bottom,#000 0%,#000 74%,transparent 100%),linear-gradient(to right,transparent 0%,#000 7%,#000 93%,transparent 100%);
  mask-composite:intersect;
}
@keyframes hero-in{to{transform:scale(1);opacity:1;}}
.hero__caption{
  display:flex;align-items:center;justify-content:center;gap:18px;margin-top:-6px;
  opacity:0;animation:fade-up 1.2s var(--ease-out) .6s forwards;
}
.hero__caption::before,.hero__caption::after{content:"";width:44px;height:1px;background:var(--line-strong);flex:none;}
@media (max-width:640px){.hero__caption{font-size:.6rem;letter-spacing:.22em;gap:12px;}.hero__caption::before,.hero__caption::after{width:24px;}.hero__plate{aspect-ratio:4/3;}}
.hero h1{margin:clamp(26px,3.5vw,44px) auto 0;max-width:14ch;}
.hero__sub{
  margin:clamp(20px,2.5vw,30px) auto 0;max-width:46ch;color:var(--ink-soft);font-size:clamp(1rem,1.3vw,1.15rem);
  opacity:0;animation:fade-up 1.2s var(--ease-out) .9s forwards;
}
.hero__cta{
  display:flex;flex-wrap:wrap;gap:18px 34px;justify-content:center;align-items:center;margin-top:clamp(30px,3.5vw,44px);
  opacity:0;animation:fade-up 1.2s var(--ease-out) 1.1s forwards;
}
@keyframes fade-up{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.hero__scroll{
  margin:clamp(56px,7vw,96px) auto 0;width:1px;height:64px;position:relative;overflow:hidden;background:var(--line);
}
.hero__scroll::after{content:"";position:absolute;left:0;top:-100%;width:100%;height:100%;background:var(--terracotta);animation:scroll-cue 2.2s var(--ease-in-out) infinite;}
@keyframes scroll-cue{0%{top:-100%;}55%,100%{top:100%;}}

/* A 16/9 plate at 1360px wide is about 765px tall — taller on its own than a
   laptop viewport, which left the first screen as pure watercolor and pushed
   the proposition and the button onto the second and third. Where the screen
   is wide at all, the hero goes side by side: the headline, the sub and the
   CTA come up to the first screen and the painting keeps its whole
   composition rather than being cropped to fit.

   Measured, not guessed: the stacked hero needs 1450px of viewport height
   before its CTA clears the fold, which no ordinary display has. It was never
   working on a desktop. It still earns its place in portrait, where the plate
   leads and the page scrolls, so below 1024px nothing changes.

   This block must stay AFTER the base .hero rules: a media query adds no
   specificity, so sitting above them silently lost every property they also
   set, which is how the left edges went ragged. */
@media (min-width:1024px){
  .hero{
    display:grid;grid-template-columns:minmax(360px,5.5fr) 6.5fr;
    align-items:center;column-gap:clamp(36px,4vw,72px);
    max-width:var(--max);margin:0 auto;text-align:left;
    padding-top:calc(var(--header-h) + 16px);
    /* The scroll cue used to provide the gap under the CTA; it is hidden here,
       so the hero owns its own bottom space or the ticker touches the button. */
    padding-bottom:clamp(48px,5vw,72px);
  }
  .hero__plate{grid-column:2;grid-row:1 / span 4;margin:0;}
  /* One left edge for every line of the column. */
  .hero__caption{grid-column:1;grid-row:1;justify-content:flex-start;margin:0;}
  .hero__caption::before,.hero__caption::after{display:none;}
  /* No ch cap here — the column is the measure. A ch value narrower than the
     column forced a four-line headline with "space" orphaned on its own. */
  .hero h1{grid-column:1;grid-row:2;margin:18px 0 0;max-width:none;font-size:clamp(2.1rem,3vw,3.1rem);}
  .hero__sub{grid-column:1;grid-row:3;margin:20px 0 0;max-width:40ch;}
  .hero__cta{grid-column:1;grid-row:4;justify-content:flex-start;margin-top:30px;}
  .hero__scroll{display:none;}
}

/* ---- ticker ---------------------------------------------------------- */
.ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:16px 0;}
.ticker__track{display:flex;width:max-content;animation:ticker 48s linear infinite;}
.ticker:hover .ticker__track{animation-play-state:paused;}
.ticker__track span{display:inline-flex;align-items:center;gap:32px;padding-right:32px;white-space:nowrap;}
.ticker__track span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--terracotta);opacity:.7;}
@keyframes ticker{to{transform:translateX(-50%);}}

/* ---- intro ----------------------------------------------------------- */
.intro{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(40px,6vw,96px);align-items:start;}
@media (max-width:860px){.intro{grid-template-columns:1fr;gap:36px;}}
.intro blockquote{margin:0;font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(1.8rem,3.6vw,3rem);line-height:1.25;text-wrap:balance;}
.intro blockquote::before{content:"";display:block;width:32px;height:1px;background:var(--terracotta);margin-bottom:28px;}
.intro__text{padding-top:14px;color:var(--ink-soft);font-size:1.02rem;}
.intro__text .link-line{margin-top:22px;}

/* ---- the space ------------------------------------------------------- */
.space{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(40px,6vw,96px);align-items:center;}
@media (max-width:860px){.space{grid-template-columns:1fr;gap:44px;}}
.space__text p{color:var(--ink-soft);}
.facts{list-style:none;margin:36px 0 0;padding:0;display:grid;border-top:1px solid var(--line);}
.facts li{display:grid;grid-template-columns:96px 1fr;gap:20px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--line);font-size:.92rem;color:var(--ink-soft);}
.facts b{font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,3vw,2.8rem);line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;}
.plate{position:relative;overflow:hidden;}
.plate img{width:100%;transition:transform 1.4s var(--ease-out);}
.plate--wc img{
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 8%,#000 92%,transparent 100%),linear-gradient(to bottom,transparent 0%,#000 8%,#000 92%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent 0%,#000 8%,#000 92%,transparent 100%),linear-gradient(to bottom,transparent 0%,#000 8%,#000 92%,transparent 100%);
  mask-composite:intersect;
}
.plate__cap{margin-top:14px;text-align:center;}
[data-parallax]{will-change:transform;}

/* ---- amenities ------------------------------------------------------- */
.amen{border-top:1px solid var(--line);}
.amen__row{
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,5vw,72px);align-items:center;
  padding:clamp(28px,3.5vw,44px) 0;border-bottom:1px solid var(--line);
}
.amen__row:hover .amen__num{color:var(--terracotta);}
.amen__num{font-family:var(--serif);font-size:.95rem;color:var(--ink-mute);display:block;margin-bottom:14px;transition:color .3s;font-variant-numeric:tabular-nums;}
.amen__row h3{font-size:clamp(1.5rem,2.3vw,2rem);margin-bottom:10px;transition:color .3s;}
.amen__row:hover h3{color:var(--terracotta);}
.amen__row p{font-size:.95rem;color:var(--ink-soft);max-width:36ch;}
.amen__row .link-line{margin-top:18px;font-size:.62rem;}
.amen__art{display:flex;justify-content:flex-end;}
.amen__art .plate{width:100%;max-width:600px;aspect-ratio:16/10;}
.amen__art img{width:100%;height:100%;object-fit:cover;}
.amen__row:hover .plate img{transform:scale(1.035);}
@media (max-width:760px){
  .amen__row{grid-template-columns:1fr;gap:18px;}
  .amen__row .amen__art{order:-1;justify-content:center;}
}

/* ---- audience -------------------------------------------------------- */
.audience{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);}
.audience div{border-right:1px solid var(--line);border-bottom:1px solid var(--line);}
@media (max-width:820px){.audience{grid-template-columns:1fr 1fr;}}
@media (max-width:480px){.audience{grid-template-columns:1fr;}}
.audience div{background:var(--paper);padding:30px 26px;font-family:var(--serif);font-size:clamp(1.15rem,1.6vw,1.4rem);line-height:1.2;transition:background .35s;}
.audience div:hover{background:var(--stucco-tint);}
.audience small{display:block;margin-top:8px;font-family:var(--sans);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);}

/* ---- memberships ----------------------------------------------------- */
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:1040px){.tiers{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.tiers{grid-template-columns:1fr;}}
.tier{
  position:relative;background:var(--paper);padding:clamp(34px,3.5vw,48px) clamp(24px,2.5vw,34px) clamp(30px,3vw,40px);
  display:flex;flex-direction:column;transition:background .45s var(--ease-out);
}
.tier:hover{background:var(--paper-warm);}
.tier__tag{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);background:var(--terracotta);color:var(--paper);font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;padding:6px 14px;border-radius:999px;white-space:nowrap;}
.tier__name{font-family:var(--serif);font-size:clamp(1.7rem,2.2vw,2rem);line-height:1;}
.tier__desc{margin-top:8px;font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);}
.tier__price{margin-top:28px;font-family:var(--serif);font-size:clamp(2.4rem,3.2vw,3rem);line-height:1;letter-spacing:-.01em;}
.tier__price sup{font-size:.45em;vertical-align:.9em;margin-right:2px;font-weight:300;}
.tier__period{margin-top:6px;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);}
.tier__rule{width:28px;height:1px;background:var(--terracotta);margin:26px 0;}
.tier__note{font-size:.92rem;color:var(--ink-soft);flex:1;}
.tier__list{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:8px;font-size:.84rem;color:var(--ink-soft);}
.tier__list li{display:flex;gap:12px;}
.tier__list li::before{content:"";width:12px;height:1px;background:var(--terracotta);margin-top:.85em;flex:none;}
.tier .link-line{margin-top:28px;font-size:.64rem;align-self:flex-start;}
.fine{text-align:center;margin-top:28px;font-size:.8rem;color:var(--ink-soft);max-width:60ch;margin-left:auto;margin-right:auto;}

/* ---- location -------------------------------------------------------- */
.location{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(40px,6vw,96px);align-items:center;}
@media (max-width:900px){.location{grid-template-columns:1fr;gap:40px;}}
.location p{color:var(--ink-soft);}
.addr{margin-top:28px;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:22px;padding-top:24px;border-top:1px solid var(--line);}
.addr .k{display:block;margin-bottom:6px;}
.addr .v{font-size:.95rem;}
.glance{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:10px;font-size:.9rem;color:var(--ink-soft);}
.glance li{display:flex;gap:14px;}
.glance li::before{content:"";width:14px;height:1px;background:var(--terracotta);margin-top:.85em;flex:none;}
.map{
  position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--paper-deep);border:1px solid var(--line);
}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(1) sepia(.28) saturate(.9) contrast(.92) brightness(1.04);transition:filter .8s var(--ease-out);}
.map:hover iframe{filter:grayscale(.2) sepia(.1) saturate(.95);}
.map__pin{
  position:absolute;left:18px;bottom:18px;background:rgba(251,248,242,.94);padding:14px 18px;border:1px solid var(--line);
  font-size:.8rem;line-height:1.5;pointer-events:none;
}
.map__pin b{display:block;font-family:var(--serif);font-weight:500;font-size:1.05rem;}

/* ---- faq ------------------------------------------------------------- */
.faq{max-width:820px;margin:0 auto;border-top:1px solid var(--line);}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{
  list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;
  padding:24px 0;font-family:var(--serif);font-size:clamp(1.25rem,1.8vw,1.5rem);line-height:1.3;transition:color .3s;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary:hover{color:var(--terracotta);}
.faq summary .plus{flex:none;width:14px;height:14px;position:relative;}
.faq summary .plus::before,.faq summary .plus::after{content:"";position:absolute;background:var(--terracotta);transition:transform .45s var(--ease-out);}
.faq summary .plus::before{left:0;right:0;top:50%;height:1px;}
.faq summary .plus::after{top:0;bottom:0;left:50%;width:1px;}
.faq details[open] summary .plus::after{transform:rotate(90deg);}
.faq .faq__body{overflow:hidden;}
.faq .faq__body>div{padding:0 0 26px;color:var(--ink-soft);font-size:.96rem;max-width:62ch;}

/* ---- enquire band ---------------------------------------------------- */
.band{
  position:relative;overflow:hidden;background:var(--ink-deep);color:var(--paper);
  padding:clamp(80px,10vw,140px) var(--gutter);text-align:center;
}
.band::before{
  content:"";position:absolute;inset:-20%;background:radial-gradient(60% 50% at 50% 100%,rgba(185,95,59,.32),transparent 70%);
  pointer-events:none;
}
.band .wrap{position:relative;}
.band h2{max-width:20ch;margin:0 auto;}
.band .lede{margin:22px auto 0;color:rgba(251,248,242,.66);}
.band__cta{margin-top:40px;display:flex;flex-wrap:wrap;gap:16px 30px;justify-content:center;align-items:center;}
.band__note{margin-top:22px;font-size:.78rem;color:rgba(251,248,242,.5);}

/* ---- footer ---------------------------------------------------------- */
.site-footer{background:var(--ink);color:var(--paper);border-top:1px solid var(--line-light);}
.site-footer__inner{
  max-width:var(--max);margin:0 auto;padding:clamp(56px,7vw,88px) var(--gutter) clamp(40px,5vw,60px);
  display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px;
}
@media (max-width:900px){.site-footer__inner{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.site-footer__inner{grid-template-columns:1fr;gap:34px;}}
.site-footer__brand img{width:200px;opacity:.95;}
.site-footer__brand p{margin:22px 0 26px;max-width:32ch;color:rgba(251,248,242,.62);font-size:.92rem;}
.site-footer__col{display:flex;flex-direction:column;gap:9px;font-size:.92rem;}
.site-footer__col .eyebrow{margin-bottom:8px;}
.site-footer__col a{color:rgba(251,248,242,.78);transition:color .3s;width:fit-content;}
.site-footer__col a:hover{color:var(--stucco);}
.site-footer__col address{color:rgba(251,248,242,.78);}
.site-footer__hours{color:rgba(251,248,242,.5);font-size:.82rem;line-height:1.6;margin-top:4px;}
.site-footer__base{
  max-width:var(--max);margin:0 auto;padding:22px var(--gutter) max(28px,env(safe-area-inset-bottom));
  border-top:1px solid var(--line-light);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
  color:rgba(251,248,242,.45);
}
.site-footer__base a{color:rgba(251,248,242,.7);}
.site-footer__base a:hover{color:var(--stucco);}

/* ---- detail pages ---------------------------------------------------- */
.page-hero{padding:calc(var(--header-h) + clamp(28px,5vw,64px)) var(--gutter) 0;}
.crumb{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:clamp(28px,4vw,48px);}
.crumb a:hover{color:var(--terracotta);}
.crumb .sep{width:18px;height:1px;background:var(--line-strong);}
.page-head{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,72px);align-items:end;padding-bottom:clamp(40px,5vw,64px);}
@media (max-width:860px){.page-head{grid-template-columns:1fr;gap:24px;}}
.page-head h1{max-width:12ch;}
.page-head .lede{margin:0;}
.page-plate{max-width:1100px;margin:0 auto;}
.page-plate .plate{aspect-ratio:16/9;}
.page-plate img{width:100%;height:100%;object-fit:cover;}

.page-body{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(40px,6vw,88px);align-items:start;}
@media (max-width:860px){.page-body{grid-template-columns:1fr;}}
.page-body h2{margin-bottom:22px;}
.page-body .prose p{color:var(--ink-soft);font-size:1.02rem;}
.pairs{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:36px;}
@media (max-width:600px){.pairs{grid-template-columns:1fr;}}
.pairs>div{background:var(--paper);padding:26px 28px;transition:background .35s;}
.pairs>div:hover{background:var(--paper-warm);}
.pairs h3{font-size:1.35rem;margin-bottom:6px;}
/* h1-h4 are margin:0, so a heading takes its space from the preceding
   element. .pairs has no bottom margin, which left a heading after it
   sitting flush against the box. */
.pairs + h2,.pairs + h3{display:block;margin-top:clamp(44px,6vw,64px);}
.pairs p{font-size:.88rem;color:var(--ink-soft);}

.incl{position:sticky;top:calc(var(--header-h) + 24px);border:1px solid var(--line);background:var(--paper-deep);padding:clamp(28px,3vw,38px);}
.incl ul{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:11px;font-size:.92rem;color:var(--ink-soft);}
.incl li{display:flex;gap:14px;}
.incl li::before{content:"";width:14px;height:1px;background:var(--terracotta);margin-top:.85em;flex:none;}
.pricebox{margin-top:28px;padding-top:26px;border-top:1px solid var(--line);}
.pricebox__price{font-family:var(--serif);font-size:clamp(2.4rem,3vw,2.9rem);line-height:1;}
.pricebox__price sup{font-size:.45em;vertical-align:.9em;margin-right:2px;}
.pricebox__period{margin-top:8px;}
.pricebox .btn{margin-top:24px;width:100%;}
.pricebox__fine{margin-top:16px;font-size:.76rem;color:var(--ink-mute);}

.page-next{border-top:1px solid var(--line);padding:32px 0 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;}
.page-next a{display:inline-flex;align-items:center;gap:12px;transition:color .3s;}
.page-next a:hover{color:var(--terracotta);}
.page-next .arrow{transition:transform .45s var(--ease-out);display:inline-block;}
.page-next a:hover .arrow--r{transform:translateX(5px);}
.page-next a:hover .arrow--l{transform:translateX(-5px);}

/* ---- gallery strip --------------------------------------------------- */
.strip{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,2vw,28px);}
@media (max-width:700px){.strip{grid-template-columns:1fr;}}
.strip .plate{aspect-ratio:4/3;}
.strip img{width:100%;height:100%;object-fit:cover;}
.strip figure{margin:0;}
.strip figcaption{margin-top:12px;text-align:center;}
.strip .plate:hover img{transform:scale(1.04);}

/* ---- forms ----------------------------------------------------------- */
.form{display:grid;gap:22px;}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
@media (max-width:600px){.form__row{grid-template-columns:1fr;}}
.field{display:flex;flex-direction:column;gap:8px;}
.field label{font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);}
.field input,.field select,.field textarea{
  font:inherit;font-weight:300;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--line-strong);
  padding:10px 0;border-radius:0;transition:border-color .3s;width:100%;appearance:none;-webkit-appearance:none;
}
.field select{background-image:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%),linear-gradient(135deg,var(--ink-soft) 50%,transparent 50%);background-position:calc(100% - 12px) 55%,calc(100% - 7px) 55%;background-size:5px 5px;background-repeat:no-repeat;padding-right:28px;}
.field textarea{min-height:110px;resize:vertical;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--terracotta);}
.field input::placeholder,.field textarea::placeholder{color:var(--ink-mute);}
.form__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;margin-top:8px;}
.form__foot small{font-size:.76rem;color:var(--ink-mute);max-width:44ch;}
.form__success{display:none;padding:clamp(40px,5vw,64px) 0;text-align:center;}
.form__success h2{max-width:18ch;margin:0 auto 16px;}
.form.is-sent{display:none;}
.form.is-sent+.form__success{display:block;}
.form__error{display:none;font-size:.82rem;color:var(--terracotta);}
.form.has-error .form__error{display:block;}
.hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden;}

.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(40px,6vw,96px);align-items:start;}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;}.contact-grid>div{padding-top:40px;border-top:1px solid var(--line);}.form__foot .btn{width:100%;}}
.contact-aside .plate{margin-top:32px;aspect-ratio:4/3;}
.contact-aside img{width:100%;height:100%;object-fit:cover;}
.contact-aside dl{margin:28px 0 0;display:grid;gap:14px;padding-top:24px;border-top:1px solid var(--line);}
.contact-aside dt{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);}
.contact-aside dd{margin:2px 0 0;font-size:.95rem;}

/* ---- 404 ------------------------------------------------------------- */
.notfound{min-height:70vh;display:grid;place-items:center;text-align:center;padding:calc(var(--header-h) + 60px) var(--gutter) 80px;}

/* ---- motion preferences --------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
  [data-reveal],.lines .line>span{opacity:1;transform:none;}
  .hero__plate img,.hero__caption,.hero__sub,.hero__cta{opacity:1;transform:none;}
  .mobile-menu__group a{opacity:1;transform:none;}
  ::view-transition-old(root),::view-transition-new(root){animation:none;}
}

/* ---- the app ---------------------------------------------------------- */
.app{position:relative;overflow:hidden;}
.app::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(55% 60% at 78% 55%,rgba(185,95,59,.22),transparent 70%);
}
.app__grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;grid-template-areas:"text phone" "cta phone";column-gap:clamp(40px,6vw,96px);align-items:center;}
.app__text{grid-area:text;align-self:end;}
.app__cta{grid-area:cta;align-self:start;}
.app__phone{grid-area:phone;}
.app__text .lede{margin-top:22px;max-width:44ch;}
.app__tabs{margin-top:clamp(32px,4vw,48px);border-top:1px solid var(--line-light);}
.app__tab{
  display:grid;grid-template-columns:40px 1fr;gap:16px;width:100%;text-align:left;
  padding:20px 0;border-bottom:1px solid var(--line-light);color:var(--paper);
  opacity:.5;transition:opacity .45s var(--ease-out);position:relative;
}
.app__tab::before{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--stucco);transition:width .7s var(--ease-out);}
.app__tab:hover{opacity:.85;}
.app__tab.is-active{opacity:1;}
.app__tab.is-active::before{width:100%;}
.app__tab-num{font-family:var(--serif);font-size:.95rem;color:var(--stucco);padding-top:3px;font-variant-numeric:tabular-nums;}
.app__tab-body{display:flex;flex-direction:column;gap:6px;}
.app__tab-body b{font-family:var(--serif);font-weight:400;font-size:clamp(1.35rem,1.9vw,1.65rem);line-height:1.1;}
.app__tab-body span{font-size:.92rem;line-height:1.6;color:rgba(251,248,242,.62);max-width:46ch;overflow:hidden;
  display:block;max-height:0;opacity:0;transition:max-height .7s var(--ease-out),opacity .5s var(--ease-out),margin .5s var(--ease-out);}
.app__tab.is-active .app__tab-body span{max-height:12em;opacity:1;margin-top:4px;}
.app__cta{margin-top:clamp(30px,4vw,44px);}
.app__note{margin-top:16px;font-size:.78rem;color:rgba(251,248,242,.5);}

.app__phone{position:relative;justify-self:center;width:min(100%,360px);}
.app__glow{position:absolute;inset:8% -20% -6%;border-radius:50%;background:radial-gradient(closest-side,rgba(233,183,154,.28),transparent);filter:blur(20px);pointer-events:none;}
.app__screens{position:relative;aspect-ratio:571/1200;}
.app__screens img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  opacity:0;transform:translateY(14px) scale(.985);
  transition:opacity .8s var(--ease-out),transform .9s var(--ease-out);
  filter:drop-shadow(0 40px 60px rgba(0,0,0,.45));
}
.app__screens img.is-active{opacity:1;transform:none;}

@media (max-width:900px){
  .app__grid{grid-template-columns:1fr;grid-template-areas:"text" "phone" "cta";row-gap:40px;}
  .app__phone{width:min(78%,300px);}
  .app__cta{margin-top:0;text-align:center;}
  .app__cta .badges{justify-content:center;}
  .app__tabs{margin-top:28px;}
}

/* store badges */
.badges{display:flex;flex-wrap:wrap;gap:12px;}
.badge{
  display:inline-flex;align-items:center;gap:12px;padding:11px 20px 11px 16px;
  border:1px solid rgba(251,248,242,.35);border-radius:999px;color:var(--paper);
  transition:border-color .4s var(--ease-out),background .4s var(--ease-out),transform .4s var(--ease-out);
}
.badge:hover{border-color:var(--paper);background:rgba(251,248,242,.06);transform:translateY(-1px);}
.badge__icon{width:20px;height:20px;flex:none;}
.badge span{display:flex;flex-direction:column;line-height:1.05;font-size:.92rem;font-weight:400;letter-spacing:.01em;}
.badge span small{font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(251,248,242,.55);margin-bottom:3px;}
.site-footer__app{margin-top:30px;padding-top:26px;border-top:1px solid var(--line-light);}
.site-footer__app .eyebrow{margin-bottom:14px;}
.site-footer__app .badge{padding:9px 16px 9px 13px;}
.site-footer__app .badge span{font-size:.84rem;}


/* ---- cookie consent ------------------------------------------------- */
.consent{
  position:fixed;left:0;right:0;bottom:0;z-index:120;
  background:var(--paper);border-top:1px solid var(--line);
  transform:translateY(110%);transition:transform .55s var(--ease-out);
}
.consent.is-open{transform:none;}
.consent__inner{
  max-width:1080px;margin:0 auto;padding:18px var(--gutter);
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;
}
.consent__text{flex:1 1 320px;font-family:var(--sans);font-size:.8rem;line-height:1.6;color:var(--ink-soft);}
.consent__text a{color:var(--terracotta);text-decoration:underline;text-underline-offset:3px;}
.consent__actions{display:flex;gap:10px;flex:0 0 auto;}
@media (max-width:620px){
  .consent__actions{width:100%;}
  .consent__actions .btn{flex:1;text-align:center;}
}
@media (prefers-reduced-motion:reduce){.consent{transition:none;}}