/* ESPA prototype - one stylesheet for every page.
   Order: tokens, base, chrome (header / search / overlay), page sections,
   drawers, footer, prototype nav, responsive. */

:root{
  --paper:#FCFBF8;
  --linen:#EFEBE3;
  --shell:#DFD9CD;
  --ink:#22201D;
  --ink-soft:#55504A;
  --mist:#877F75;
  /* neutral — state: active, selected, focus. Never gold; gold means action. */
  --state-50:#F2EEE7;
  --state-100:#E5DFD4;
  --state-200:#CCC5B7;
  --state-300:#A79F92;
  --state-400:#6E6862;
  --state-500:#332F2A;
  --state-600:#282420;
  --state-700:#22201D;
  --state-800:#191714;
  --state-900:#0F0E0C;
  /* gold — action: buttons and calls to action */
  --gold-50:#FFF8E8;
  --gold-100:#FFEFC9;
  --gold-200:#FFDF97;
  --gold-300:#FFCB5C;
  --gold-400:#FFBC33;
  --gold-500:#FFAE0C;
  --gold-600:#E09600;
  --gold-700:#B87A00;
  --gold-800:#8A5C00;
  --gold-900:#5C3D00;
  /* aliases */
  --marine:var(--state-500);
  --marine-deep:var(--state-700);
  --marine-light:#C4BCAF;
  --action:var(--gold-500);
  --action-hover:var(--gold-300);
  --on-action:#2A1F05;
  --slate:#050300;
  --slate-2:#0F0A00;
  --line:rgba(34,32,29,.14);
  /* status: same 100% saturation as the gold, dark enough for text on linen (4.5:1+) */
  --err:#CC0E00;
  --ok:#007A33;
  --ease:cubic-bezier(.65,0,.25,1);
  --ease-out:cubic-bezier(.2,.8,.2,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);
  --radius:4px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth; scrollbar-gutter:stable; overflow-x:clip; overflow-y:auto;}
html.locked{overflow:hidden;}
body{
  background:var(--paper); color:var(--ink);
  font-family:'Archivo', system-ui, sans-serif; font-weight:300;
  font-size:18px; line-height:1.65; -webkit-font-smoothing:antialiased;
  /* the off-canvas cart and reservation drawers park past the right edge and
     would otherwise let phones scroll sideways. clip, not hidden: it creates
     no scroll container, so position:sticky keeps working. */
  overflow-x:clip;
}
img{display:block; max-width:100%;}
a{color:inherit; text-decoration:none;}
h1,h2,h3,.serif{font-family:'Spectral', Georgia, serif; font-weight:500;letter-spacing:-1.5px}
.wrap{max-width:1340px; margin:0 auto; padding:0 40px;}
input{font-family:inherit;}
/* form fields show focus with their own border colour, never the browser ring */
:is(input,select,textarea):focus{outline:none;}
button:focus-visible,a:focus-visible{outline:2px solid var(--marine); outline-offset:3px;}
/* ---- underline: contracts to 50% and holds, picks up accent ---- */
.ulink{position:relative; display:inline-block; padding-bottom:4px; font-size:16px; transition:color .3s var(--ease);}
.ulink::before{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:currentColor; opacity:.32;
}
.ulink::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:currentColor; transform:scaleX(0); transform-origin:center;
  transition:transform .45s var(--ease);
}
.ulink:hover{color:var(--marine);}
.ulink:hover::after{transform:scaleX(1);}
.about .ulink:hover{color:var(--marine-light);}
.panel .ulink{color:#fff;}
.panel .ulink:hover{color:#fff;}
.panel .ulink::before{opacity:.45;}
/* any plain link inside text in the page content gets the .ulink look
   (faint line, darker line growing from the centre on hover), drawn with
   backgrounds so it can wrap across lines. Designed links carry a class
   and header/footer sit outside main, so neither is affected */
main :where(p,li,td,dd,blockquote) a:not([class]){
  color:var(--ink); padding-bottom:2px;
  background:
    linear-gradient(currentColor,currentColor) center bottom / 0 1px no-repeat,
    linear-gradient(color-mix(in srgb,currentColor 32%,transparent),color-mix(in srgb,currentColor 32%,transparent)) left bottom / 100% 1px no-repeat;
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
  transition:color .3s var(--ease), background-size .45s var(--ease);
}
/* bold in content reads as emphasis, not as a second text colour that
   could pass for a link; weight only, so it works on dark sections too */
main :where(b,strong){font-weight:500;}
main :where(p,li,td,dd,blockquote) a:not([class]):hover{
  color:var(--marine); background-size:100% 1px, 100% 1px;
}
/* lists in content are editor rich text: dots for ul, quiet numbers for ol.
   Zero specificity past main, so template lists that act as menus opt out
   with a plain class selector (.svc-other) */
main :where(ul,ol):where(:not([class])){list-style:none; margin:0 0 20px; padding:0; display:grid; gap:8px;}
main :where(li > ul, li > ol):where(:not([class])){margin:8px 0 0;}
main :where(ul,ol):where(:not([class])) > li{position:relative; padding-left:22px;}
main :where(ul):where(:not([class])) > li::before{
  content:''; position:absolute; left:2px; top:calc(.5lh - 3px);
  width:6px; height:6px; border-radius:50%; background:var(--state-300);
}
main :where(ol):where(:not([class])){counter-reset:li;}
main :where(ol):where(:not([class])) > li{counter-increment:li;}
main :where(ol):where(:not([class])) > li::before{
  content:counter(li) '.'; position:absolute; left:0; top:0;
  font-size:14px; color:var(--mist); font-variant-numeric:tabular-nums;
}
/* ---------- fixed top ---------- */
.site-top{position:fixed; top:0; left:0; right:0; z-index:60;}
.announce{
  background:var(--gold-500); color:var(--on-action); font-size:14px; text-align:center;
  padding:10px 20px; overflow:hidden; max-height:60px; transition:max-height .4s ease, padding .4s ease;
}
/* collapsed content is hidden once it has closed, so its links leave the tab order */
.site-top.compact .announce{max-height:0; padding-top:0; padding-bottom:0; visibility:hidden; transition:max-height .4s ease, padding .4s ease, visibility 0s .4s;}
.announce a{border-bottom:1px solid color-mix(in srgb, var(--on-action) 45%, transparent);}
.announce a:hover{border-color:var(--on-action); color:var(--on-action);}
.hdr{color:#fff; background:transparent; transition:background .4s ease, box-shadow .4s ease, color .4s ease;}
.site-top.compact .hdr,.site-top.searching .hdr{
  color:var(--ink); background:rgba(252,251,248,.72);
  -webkit-backdrop-filter:blur(16px) saturate(1.4); backdrop-filter:blur(16px) saturate(1.4);
  box-shadow:0 1px 0 var(--line);
}
/* equal side columns keep the logo centred whatever sits either side */
.hrow{max-width:1340px; margin:0 auto; padding:10px 40px; display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:24px;}
.h-left{display:flex; align-items:center; gap:18px;}
.h-right{display:flex; align-items:center; justify-content:flex-end; gap:6px;}
.logos{display:flex; align-items:center; gap:24px; justify-content:center;}
/* full lockup at rest; on scroll it cross-fades to a mark-only SVG whose
   viewBox is cropped to the circle, so the mark centres exactly */
.logos .logo{
  position:relative; display:flex; align-items:center;
  height:84px; overflow:hidden; transition:height .45s var(--ease);
}
.logos .logo .logo-svg{height:84px; width:auto; display:block; transition:opacity .3s var(--ease);}
.logos .logo .logo-mark-only{
  position:absolute; left:0; top:50%; transform:translateY(-50%);
  height:42.5px; width:auto; opacity:0; pointer-events:none;
  transition:opacity .3s var(--ease);
}
.logo-text{fill:#fff;}
.site-top.compact .logos .logo{height:54px;}
.site-top.compact .logos .logo .logo-svg{opacity:0;}
.site-top.compact .logos .logo .logo-mark-only{opacity:1;}
/* on the light overlay the white wordmark would vanish */
.overlay .logo-text{fill:var(--ink);}
.overlay .logo .logo-mark-only{display:none;}
.burger{background:none; border:none; cursor:pointer; color:inherit; padding:10px 10px 10px 0; display:flex;}
.burger i{display:block; width:26px; height:1px; background:currentColor; position:relative; transition:width .4s var(--ease);}
.burger i::before,.burger i::after{content:''; position:absolute; left:0; height:1px; background:currentColor; transition:width .4s var(--ease);}
.burger i::before{top:-7px; width:18px;}
.burger i::after{top:7px; width:23px;}
.burger:hover i,.burger:hover i::before,.burger:hover i::after{width:26px;}
.lang{display:flex; align-items:center; gap:15px; font-size:14px; line-height:1;}
.lang form{display:flex; margin:0;}
.lang svg{display:block; opacity:.55;}
.lang .ulink{font-size:14px; letter-spacing:.1em; text-transform:lowercase; padding-bottom:0; line-height:1; opacity:.72; transition:opacity .3s var(--ease);}
.lang button.ulink{background:none; border:none; padding:0; margin:0; cursor:pointer; color:inherit; font-family:inherit; font-weight:inherit;}
.lang .ulink::after{bottom:-5px;}
.lang .ulink::before{display:none;}
.lang .ulink:hover{color:inherit; opacity:1;}
.act{display:flex; align-items:center; gap:8px; background:none; border:none; cursor:pointer; color:inherit;
  font-family:'Archivo', system-ui, sans-serif; font-weight:300; font-size:14px; padding:10px 12px; position:relative; transition:opacity .2s;}
.act:hover{opacity:.6;}
.cart-count{position:absolute; top:4px; right:5px; width:16px; height:16px; border-radius:50%; background:currentColor; display:flex; align-items:center; justify-content:center;}
.cart-count i{font-style:normal; font-size:10px; color:var(--state-700);}
.site-top.compact .cart-count i,.site-top.searching .cart-count i{color:var(--paper);}
/* ---------- search band ---------- */
.searchband{
  background:var(--paper); max-height:0; overflow:hidden;
  transition:max-height .45s var(--ease-soft); border-bottom:0 solid var(--line);
}
.site-top.searching .searchband{max-height:560px; border-bottom-width:1px;}
.sb-in{max-width:1340px; margin:0 auto; padding:34px 40px 30px;}
.sb-field{display:flex; align-items:center; gap:18px; border-bottom:1px solid var(--ink); padding-bottom:14px;}
.sb-field svg{flex-shrink:0; opacity:.55;}
.sb-field input{flex:1; border:none; background:none; font-size:clamp(20px,2.4vw,30px); font-weight:300; color:var(--ink); font-family:'Spectral';}
.sb-field input::placeholder{color:var(--mist);}
.sb-close{background:none; border:none; cursor:pointer; color:var(--mist); font-size:14px; display:flex; align-items:center; gap:8px;}
.sb-close:hover{color:var(--ink);}
.sb-sugg[hidden],.sb-live[hidden],.sb-clear[hidden]{display:none;}
.sb-live{margin-top:6px;}
.sb-live a.hit{display:flex; align-items:baseline; justify-content:space-between; gap:24px; padding:11px 0; border-bottom:1px solid var(--line); font-family:'Spectral', Georgia, serif; font-weight:300; font-size:18px; line-height:1.3; color:var(--ink);}
.sb-live a.hit:hover{color:var(--marine);}
.sb-live .hp{font-family:'Archivo', sans-serif; font-size:14px; color:var(--ink); flex-shrink:0;}
.sb-live .empty{padding:14px 0 2px; font-size:14px; color:var(--mist);}
.sb-live .all{margin-top:14px;}
.sb-sugg{display:flex; align-items:center; gap:22px; flex-wrap:wrap; margin-top:20px; font-size:14px; color:var(--mist);}
.sb-sugg a{color:var(--mist); position:relative; transition:color .3s var(--ease);}
.sb-sugg a::after{content:''; position:absolute; left:0; right:0; bottom:-3px; height:1px; background:currentColor; transform:scaleX(0); transform-origin:center; transition:transform .35s var(--ease);}
.sb-sugg a:hover{color:var(--marine);}
.sb-sugg a:hover::after{transform:scaleX(1);}
.scrim{
  position:fixed; inset:0; z-index:55; background:rgba(26,23,20,.42);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
  opacity:0; pointer-events:none; transition:opacity .4s ease;
}
.scrim.on{opacity:1; pointer-events:auto;}
/* ---------- overlay menu ---------- */
.overlay{position:fixed; inset:0; z-index:80; background:var(--paper); color:var(--ink);
  transform:translateY(-100%); transition:transform .55s cubic-bezier(.7,0,.2,1); overflow-y:auto;}
.overlay.open{transform:translateY(0);}
.ov-top{max-width:1340px; margin:0 auto; padding:15px 40px; display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:24px;}
/* sits where the burger was, lined up with its left edge */
.ov-close{background:none; border:none; cursor:pointer; color:var(--ink); display:flex; align-items:center; padding:10px 10px 10px 0; transition:opacity .25s var(--ease);}
.ov-close:hover{opacity:.55;}
.ov-body{max-width:1340px; margin:0 auto; padding:40px 40px 80px; display:grid; grid-template-columns:3fr .85fr; gap:60px;}
.ov-cols{display:grid; grid-template-columns:repeat(3,1fr); gap:44px;}
.ov-group a.top{font-family:'Spectral'; font-size:24px; display:block; margin-bottom:12px; line-height:1.2;}
/* several sections share a column; space them apart */
.ov-item + .ov-item{margin-top:32px;}
.ov-tog{display:none;}
.ov-group a.top:hover{color:var(--marine);}
.ov-group ul{list-style:none;}
/* tight inside an item, looser between items, so a wrapped link still reads as one */
.ov-group li{margin-bottom:12px; line-height:1.4;}
.ov-group li a{font-size:16px; color:var(--ink-soft); transition:color .2s;}
.ov-group li a:hover{color:var(--marine);}
.ov-side{border-left:1px solid var(--line); padding-left:50px;}
.ov-links{display:grid; gap:2px; margin-bottom:28px; padding-bottom:28px; border-bottom:1px solid var(--line);}
/* secondary to the page sections: menu-link size, sans */
.orow{display:grid; grid-template-columns:18px 1fr; gap:12px; align-items:center; padding:6px 0;
  font-size:16px; line-height:1.4; transition:color .2s;}
.orow svg{opacity:.55; transition:opacity .25s;}
.orow:hover{color:var(--marine);}
.orow:hover svg{opacity:.9;}
/* ---------- icon info list ---------- */
.ilist{display:grid; gap:12px;}
.irow{display:grid; grid-template-columns:18px 1fr; gap:14px; align-items:start; font-size:16px;}
.irow svg{margin-top:4px; opacity:.6;}
/* in the menu the contact details are secondary to the page sections */
.ov-side .irow{gap:12px; font-size:14px; line-height:1.6; color:var(--ink-soft);}
.ov-side .irow svg{margin-top:2px;}
.irow a{transition:color .2s;}
.hours{display:grid; grid-template-columns:auto 1fr; gap:3px 20px;}
.hours dt{opacity:.7;}
.hours dd{font-variant-numeric:tabular-nums;}
/* footer hours block */
.oh{display:grid; gap:0;}
.oh-row{
  display:flex; justify-content:space-between; gap:24px;
  padding:11px 0; border-bottom:1px solid rgba(255,255,255,.1); font-size:16px;
}
.oh-row:last-of-type{border-bottom:none;}
.oh-row dt{color:#A69E93; white-space:nowrap;}
.oh-row dd{font-variant-numeric:tabular-nums; white-space:nowrap;}
.oh-note{font-size:14px; color:#8C857A; margin-top:12px; line-height:1.55;}
.oh-status{display:flex; align-items:center; gap:9px; font-size:14px; color:#fff; margin-bottom:16px;}
.oh-status .dot{width:7px; height:7px; border-radius:50%; background:#79B58C; position:relative;}
.oh-status .dot::after{
  content:''; position:absolute; inset:-4px; border-radius:50%;
  border:1px solid #79B58C; opacity:.45; animation:ping 2.6s var(--ease-out) infinite;
}
@keyframes ping{0%{transform:scale(.7); opacity:.55;}70%{transform:scale(1.5); opacity:0;}100%{opacity:0;}}
.oh-status .dot.is-closed{background:#8C857A;}
.oh-status .dot.is-closed::after{display:none;}
/* ---------- hero ---------- */
.hero{position:relative; height:78vh; min-height:540px; max-height:780px; overflow:hidden; display:flex; align-items:flex-end;}
.hslide{position:absolute; inset:0; opacity:0; animation-name:kb4; animation-duration:calc(var(--n, 4) * 5s); animation-delay:calc(var(--i, 0) * 5s); animation-iteration-count:infinite;}
.hslide img{width:100%; height:100%; object-fit:cover; display:block;}
.hero[data-slides="1"] .hslide,.hslide.is-solo{animation:none; opacity:1;}
.hero[data-slides="2"] .hslide{animation-name:kb2;}
.hero[data-slides="3"] .hslide{animation-name:kb3;}
.hero[data-slides="4"] .hslide{animation-name:kb4;}
.hero[data-slides="5"] .hslide{animation-name:kb5;}
.hero[data-slides="6"] .hslide{animation-name:kb6;}
.hero[data-slides="7"] .hslide{animation-name:kb7;}
.hero[data-slides="8"] .hslide{animation-name:kb8;}
@keyframes kb2{0%{opacity:0;transform:scale(1.03);}6%{opacity:1;}44%{opacity:1;transform:scale(1.1);}50%{opacity:0;}100%{opacity:0;}}
@keyframes kb3{0%{opacity:0;transform:scale(1.03);}4%{opacity:1;}29.33%{opacity:1;transform:scale(1.1);}33.33%{opacity:0;}100%{opacity:0;}}
@keyframes kb4{0%{opacity:0;transform:scale(1.03);}3%{opacity:1;}22%{opacity:1;transform:scale(1.1);}25%{opacity:0;}100%{opacity:0;}}
@keyframes kb5{0%{opacity:0;transform:scale(1.03);}2.4%{opacity:1;}17.6%{opacity:1;transform:scale(1.1);}20%{opacity:0;}100%{opacity:0;}}
@keyframes kb6{0%{opacity:0;transform:scale(1.03);}2%{opacity:1;}14.67%{opacity:1;transform:scale(1.1);}16.67%{opacity:0;}100%{opacity:0;}}
@keyframes kb7{0%{opacity:0;transform:scale(1.03);}1.71%{opacity:1;}12.57%{opacity:1;transform:scale(1.1);}14.29%{opacity:0;}100%{opacity:0;}}
@keyframes kb8{0%{opacity:0;transform:scale(1.03);}1.5%{opacity:1;}11%{opacity:1;transform:scale(1.1);}12.5%{opacity:0;}100%{opacity:0;}}
.hero::after{content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(0deg, rgba(20,17,14,.72) 0%, rgba(20,17,14,.14) 46%, rgba(20,17,14,.36) 100%);}
.hero-in{position:relative; z-index:2; width:100%; padding-bottom:64px; color:#fff;}
.hero-rule{width:56px; height:1px; background:rgba(255,255,255,.7); margin-bottom:26px;}
.hero-in h1{font-size:clamp(38px,4.8vw,64px); line-height:1.1; max-width:680px; letter-spacing:-.012em;}
/* ---------- two-panel offers ---------- */
.panels{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.panel{position:relative; overflow:hidden; display:block; aspect-ratio:16/10; background:var(--linen);}
.panel img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:saturate(.7) brightness(.93); transform:scale(1);
  transition:filter .85s var(--ease), transform 1.8s var(--ease-out);
}
.panel:hover img{filter:saturate(1.08) brightness(1.03); transform:scale(1.035);}
.panel::after{content:''; position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,17,14,.76) 0%, rgba(20,17,14,.05) 66%);}
.panel-cap{position:absolute; z-index:2; left:38px; right:38px; bottom:34px; color:#fff; transition:transform .55s var(--ease);}
.panel:hover .panel-cap{transform:translateY(-4px);}
.panel-cap h3{font-size:32px; line-height:1.18;}
.panel-cap .d{margin-top:9px;}
.panel-cap p{font-size:16px; color:rgba(255,255,255,.8); max-width:340px; margin-bottom:16px;}
/* ---------- sections ---------- */
section{padding:104px 0;}
.shead{display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:20px; flex-wrap:wrap;}
.shead h2{font-size:clamp(30px,3.2vw,44px); line-height:1.15;}
.slead{font-size:16px; color:var(--ink-soft); max-width:620px; margin-bottom:46px;}
/* ---------- procedures (hierarchy) ---------- */
.proc{display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:250px; gap:16px;}
.pcard{position:relative; overflow:hidden; display:block; background:var(--linen);}
.pcard.feature{grid-column:span 2; grid-row:span 2;}
.pcard img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:saturate(.7) brightness(.93); transform:scale(1);
  transition:filter .85s var(--ease), transform 1.8s var(--ease-out);
}
.pcard:hover img{filter:saturate(1.08) brightness(1.03); transform:scale(1.035);}
.pcard::after{content:''; position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,17,14,.78) 0%, rgba(20,17,14,0) 62%);}
.pcard .cap{position:absolute; z-index:2; left:24px; right:24px; bottom:22px; color:#fff; transition:transform .55s var(--ease);}
.pcard:hover .cap{transform:translateY(-4px);}
.pcard .cap .t{display:block; font-family:'Spectral'; font-size:24px; line-height:1.2;}
.pcard.feature .cap{left:34px; right:34px; bottom:32px;}
.pcard.feature .cap .t{font-size:36px;}
.pcard .d{font-size:14px; color:rgba(255,255,255,.72); margin-top:6px;}
.pcard.feature .d{font-size:16px; max-width:420px;}
/* caption reveal — title rests alone, description opens upward on hover */
@media(hover:hover){
  .pcard .d,.panel-cap .d{
    display:grid; grid-template-rows:0fr; margin-top:0; opacity:0;
    transition:grid-template-rows .55s var(--ease), opacity .4s var(--ease), margin-top .55s var(--ease);
  }
  .pcard .d .di,.panel-cap .d .di{overflow:hidden;}
  .pcard:hover .d,.pcard:focus-visible .d{grid-template-rows:1fr; opacity:1; margin-top:6px;}
  .panel:hover .d,.panel:focus-visible .d{grid-template-rows:1fr; opacity:1; margin-top:9px;}
}
/* ---------- news ---------- */
.news-sec{padding:56px 0 96px;}
.news-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:34px;}
.ncard .imgbox{overflow:hidden; margin-bottom:20px;}
.ncard img{
  width:100%; height:auto; aspect-ratio:5/3.4; object-fit:cover;
  filter:saturate(.7) brightness(.93); transform:scale(1);
  transition:filter .85s var(--ease), transform 1.8s var(--ease-out);
}
.ncard:hover img{filter:saturate(1.08) brightness(1.03); transform:scale(1.035);}
.ncard .meta{font-size:14px; color:var(--marine); margin-bottom:9px;}
.ncard h3{font-size:22px; line-height:1.25; margin-bottom:9px; transition:color .2s;}
.ncard:hover h3{color:var(--marine);}
.ncard p{font-size:16px; color:var(--ink-soft);}
.ncard--person img{aspect-ratio:3/4;}
.news-intro{max-width:640px; margin:0 0 48px;}
.news-intro p{color:var(--ink-soft); font-size:16px; margin-bottom:16px;}
/* ---------- about ---------- */
.about{background:var(--slate-2); color:#EBE7E0;}
.about-in{display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center;}
.about-in.is-flipped > img{order:-1;}
.about-in img{width:100%; height:auto; aspect-ratio:5/4; object-fit:cover;}
.about-in h2{font-size:clamp(28px,3vw,40px); line-height:1.18; margin-bottom:22px;}
.about-in p{color:#B8B0A5; font-size:16px; margin-bottom:26px; max-width:450px;}
.facts{display:flex; gap:52px; margin-top:38px; flex-wrap:wrap;}
.facts .n{font-family:'Spectral'; font-size:34px; color:#fff;}
.facts .l{font-size:14px; color:#989085; margin-top:3px;}
/* ---------- footer ---------- */
footer{background:var(--slate); color:#CFC8BE; padding:78px 0 26px;}
.fgrid{display:grid; grid-template-columns:1.25fr 1fr 1fr 1.15fr; gap:56px; margin-bottom:52px;}
.fgrid h4{font-size:12px; letter-spacing:.06em; color:#8C857A; font-weight:400; margin-bottom:18px;}
.fgrid ul{list-style:none;}
.fgrid li{margin-bottom:10px; font-size:16px;}
.fgrid li a{transition:color .2s;}
.fgrid li a:hover,footer .irow a:hover{color:var(--marine-light);}
.flogos{display:flex; align-items:center; gap:22px; margin-bottom:26px;}
.flogos img{filter:brightness(0) invert(1);}
.flogos img.espa{height:46px;}
.flogos img.radisson{height:32px;}
/* newsletter: a quiet outlined button that opens the sign-up dialog */
.fnews-cta{
  display:inline-flex; align-items:center; gap:10px; padding:12px 20px;
  background:none; border:1px solid rgba(255,255,255,.3); border-radius:var(--radius); cursor:pointer;
  font-family:'Archivo'; font-weight:300; font-size:14px; color:#fff;
  transition:border-color .3s var(--ease), background-color .3s var(--ease);
}
.fnews-cta svg{opacity:.72;}
.fnews-cta:hover{border-color:#fff; background:rgba(255,255,255,.06);}
.nl-modal{
  width:min(560px, calc(100% - 32px)); max-height:calc(100% - 32px); margin:auto; padding:0; border:none;
  border-radius:var(--radius); background:#fff; overflow:auto; box-shadow:0 24px 60px rgba(26,23,20,.28);
}
.nl-modal::backdrop{background:rgba(20,17,14,.6);}
/* taller than the Brevo form so it never scrolls inside the frame;
   on short screens the dialog scrolls instead */
.nl-modal iframe{display:block; width:100%; height:680px; border:0;}
.nl-close{
  position:absolute; top:8px; right:8px; width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  background:none; border:none; cursor:pointer; color:var(--ink); transition:opacity .25s var(--ease);
}
.nl-close:hover{opacity:.55;}
.fbot{border-top:1px solid rgba(255,255,255,.14); padding-top:24px; display:flex; justify-content:space-between; align-items:center; gap:26px; flex-wrap:wrap;}
.fbot-l{display:flex; gap:26px; flex-wrap:wrap; align-items:center; font-size:14px; color:#8C857A;}
.fbot-l a{transition:color .2s;}
.fbot-l a:hover{color:#fff;}
.fbot-r{display:flex; align-items:center; gap:26px;}
.fbadges{display:flex; align-items:center; gap:22px;}
.fbadges img{height:32px; width:auto; object-fit:contain; filter:brightness(0) invert(1); opacity:.5; transition:opacity .25s;}
.fbadges img:hover{opacity:.9;}
.fsocial{display:flex; align-items:center; gap:16px; padding-left:26px; border-left:1px solid rgba(255,255,255,.14);}
.fsocial a{display:flex; opacity:.6; transition:opacity .25s;}
.fsocial a:hover{opacity:1;}
/* ---------- cart drawer ---------- */
.cart{
  position:fixed; top:0; right:0; bottom:0; width:428px; max-width:92vw; z-index:85;
  background:var(--paper); display:flex; flex-direction:column;
  transform:translateX(101%); transition:transform .55s var(--ease);
  box-shadow:-24px 0 60px rgba(26,23,20,.16);
}
.cart.open{transform:translateX(0);}
.cart-head{
  display:flex; align-items:flex-start; justify-content:space-between;
  padding:22px 28px 18px; background:var(--linen);
  box-shadow:0 18px 30px -24px rgba(26,23,20,.18); position:relative; z-index:2;
}
.cart-head h2{font-size:24px; line-height:1.15;}
.cart-head .n{
  display:block; font-family:'Archivo', sans-serif; font-weight:300;
  font-size:14px; color:var(--mist); margin-top:4px;
}
.cart-close{background:none; border:none; cursor:pointer; color:var(--ink); display:flex; padding:6px; align-self:center; transition:opacity .25s var(--ease);}
.cart-close:hover{opacity:.55;}
.cart-body{flex:1; overflow-y:auto; overflow-x:hidden; scrollbar-gutter:stable; padding:0 28px 14px;}
.cart-empty{margin:8px 0 0; color:var(--ink-soft); font-size:16px; line-height:1.5;}
.citem{
  display:grid; grid-template-columns:1fr auto; gap:14px; align-items:start;
  margin:0 -28px; padding:17px 28px 16px;
  border-bottom:1px solid var(--line); position:relative;
}
.citem:last-child{border-bottom:none;}
.citem .nm{font-size:16px; font-weight:500; letter-spacing:-.015em; line-height:1.3;}
.citem>div:first-child{min-width:0;}
.citem .mt{font-size:12px; color:var(--mist); margin-top:3px;}
.citem .right{display:flex; flex-direction:column; align-items:flex-end; gap:12px;}
.citem .pr{font-size:16px; font-weight:400; line-height:1.3; white-space:nowrap; font-variant-numeric:tabular-nums;}
/* discounted lines: the price before the sale or code, struck through under the total */
:is(.citem .pr,.bline .bp){display:flex; flex-direction:column; align-items:flex-end;}
:is(.citem .pr,.bline .bp) .was{font-size:14px; line-height:1.4; color:var(--mist); text-decoration-thickness:1px;}
.citem .rm{
  background:none; border:none; cursor:pointer; color:var(--mist);
  display:flex; padding:2px; margin:1px -2px 0 0; opacity:.55;
  transition:opacity .25s var(--ease), color .25s var(--ease);
}
.citem .rm:hover{opacity:1; color:var(--marine);}
/* borderless, but the button box is 28px so the target clears the 24px
   minimum — the glyph stays small, only the hit area grows */
/* pulled left by the button's own padding so the minus glyph, not the
   invisible button box, lines up with the text above it */
.qty{display:inline-flex; align-items:center; gap:2px; margin-top:6px; margin-left:-9px; line-height:1;}
.qty button{
  width:28px; height:28px; background:none; border:none; cursor:pointer; padding:0;
  color:var(--mist); font-size:16px; line-height:1; display:flex; border-radius:var(--radius);
  align-items:center; justify-content:center;
  transition:color .25s var(--ease), background .25s var(--ease);
}
.qty button:hover:not(:disabled){color:var(--state-700); background:var(--state-50);}
.qty button:disabled{opacity:.3; cursor:default;}
.qty .v{min-width:20px; text-align:center; font-size:14px; line-height:1; font-variant-numeric:tabular-nums; color:var(--ink);}
.cart-foot{
  background:var(--linen); padding:20px 28px 26px;
  box-shadow:0 -18px 30px -22px rgba(26,23,20,.16);
}
.gift{display:inline-flex; align-items:center; gap:8px;
  background:none; border:none; cursor:pointer; padding:0; color:var(--mist);
  font-family:'Archivo'; font-weight:300; font-size:14px; transition:color .3s var(--ease);}
.gift:hover{color:var(--marine);}
.gift svg{transition:transform .35s var(--ease);}
.gift.open svg{transform:rotate(45deg);}
.gift-field{max-height:0; overflow:hidden; visibility:hidden; transition:max-height .4s var(--ease-soft), visibility 0s .4s;}
.gift-field.open{max-height:80px; visibility:visible; transition:max-height .4s var(--ease-soft);}
.gift-field form{width:100%;}
.gift-in{display:flex; border-bottom:1px solid var(--shell); margin:4px 0 6px; transition:border-color .3s var(--ease);}
.gift-in:focus-within{border-bottom-color:var(--marine);}
.coupon-on:not([hidden]){display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:14px; color:var(--ink);}
.coupon-code{font-weight:400; letter-spacing:.04em;}
.coupon-remove{border:none; background:none; cursor:pointer; padding:0; font-family:'Archivo'; font-weight:300; font-size:14px; color:var(--marine);}
.coupon-error, .coupon-msg{margin:8px 0 0; font-size:13px; line-height:1.4;}
.coupon-error{color:var(--err);}
.coupon-msg{color:var(--marine);}
.gift-in input{flex:1; border:none; background:none; padding:9px 0; font-size:14px; color:var(--ink);}
.gift-in input::placeholder{color:var(--mist);}
.gift-in button{border:none; background:none; cursor:pointer; font-family:'Archivo'; font-weight:300; font-size:14px; color:var(--marine);}
.summary{margin-top:20px;}
.crow.total{display:flex; justify-content:space-between; align-items:baseline; line-height:1.2;}
.crow.total span:first-child{font-size:16px; line-height:1.2;}
.crow.total .v{font-size:26px; font-weight:400; line-height:1.2; font-variant-numeric:tabular-nums;}
.cart-fine{display:flex; flex-direction:column; align-items:center; gap:11px; margin-top:22px;}
.cart-note{font-size:12px; color:var(--mist); line-height:1.45; text-align:center;}
.cart-pay{font-size:12px; color:var(--mist); line-height:1.45; text-align:center;}
.cbtn{
  display:flex; align-items:center; justify-content:center; gap:10px;
  width:100%; margin-top:20px; min-height:52px; padding:15px; font-size:16px;
  font-weight:400; border-radius:var(--radius);
  background:var(--action); color:var(--on-action); border:1px solid var(--gold-600); cursor:pointer;
  position:relative; overflow:hidden; isolation:isolate; transition:color .8s var(--ease);
}
.cbtn::before{
  content:''; position:absolute; background:var(--action-hover); z-index:-1;
  border-radius:50%; width:170%; aspect-ratio:1/1; left:var(--px,50%); top:var(--py,50%);
  transform:translate(-50%,-50%) scale(0); transition:transform 1.35s var(--ease-out);
}
.cbtn:hover::before{transform:translate(-50%,-50%) scale(1);}
.cbtn:active{transform:translateY(1px);}
.cart-cont{
  display:block; width:100%; text-align:center; margin-top:14px; padding:6px;
  background:none; border:none; cursor:pointer; font-family:'Archivo'; font-weight:300;
  font-size:14px; color:var(--ink-soft); transition:color .3s var(--ease);
}
.cart-cont:hover{color:var(--marine);}
.cart-fine img{height:22px; width:auto; opacity:.75;}
/* ---------- page hero ---------- */
/* min-height instead of a fixed height, so a long title grows the hero
   rather than pushing the crumbs up under the fixed header */
.phero{position:relative; min-height:clamp(400px,52vh,560px); overflow:hidden; display:flex; align-items:flex-end; padding:160px 0 0;}
.phero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.phero::after{content:''; position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,17,14,.74) 0%, rgba(20,17,14,.12) 62%, rgba(20,17,14,.32) 100%);}
.phero-in{position:relative; z-index:2; width:100%; padding-bottom:46px; color:#fff;}
.crumbs{display:flex; align-items:center; gap:10px; font-size:14px; color:rgba(255,255,255,.72); margin-bottom:18px; min-width:0; white-space:nowrap;}
.crumbs a{transition:color .3s var(--ease);}
.crumbs a:hover{color:#fff;}
.crumbs a{min-width:0; overflow:hidden; text-overflow:ellipsis;}
.phero h1{font-size:clamp(28px,18px + 2.5vw,54px); line-height:1.1; letter-spacing:-.01em; text-wrap:balance;}
.phero-sub{margin-top:14px; max-width:460px; font-size:16px; line-height:1.65; color:rgba(255,255,255,.84);}
/* no photograph on the error page: a solid ground keeps the white header lockup readable */
.phero--solid{background:var(--state-800);}
.phero-actions{margin-top:28px; display:flex;}
.phero-actions .btn-fill,.phero-actions .btn-line{width:auto;}
/* ---------- segmented sub-nav ---------- */
.segbar{background:var(--paper);}
.seg{display:flex; gap:6px; padding:26px 0 0;}
.seg a{
  padding:9px 20px; font-size:14px; color:var(--ink-soft); border-radius:var(--radius);
  transition:background .3s var(--ease), color .3s var(--ease);
}
.seg a:hover{color:var(--ink); background:var(--state-50);}
.seg a.is-active{background:var(--state-700); color:var(--paper);}
/* ---------- service list ---------- */
.services{padding:56px 0 96px;}
.search-form{margin-bottom:28px;}
.search-form .btn-line{flex-shrink:0;}
.search-empty{font-size:16px; color:var(--ink-soft);}
.search-pager{display:flex; gap:28px; margin-top:36px;}
.svc-layout{display:grid; grid-template-columns:.72fr 1.28fr; gap:70px; align-items:start;}
.svc-intro h2{font-size:clamp(26px,2.8vw,36px); line-height:1.18; margin-bottom:18px;}
.svc-intro p{color:var(--ink-soft); font-size:16px; margin-bottom:14px; max-width:340px;}
/* a list in the intro is what the procedure includes: set apart on linen */
.svc-intro ul:not([class]){margin:22px 0; padding:20px 22px; max-width:340px; background:var(--linen); border-radius:var(--radius);}
.svc-intro ul:not([class]) > li{font-size:14px; line-height:1.56; color:var(--ink-soft);}
.svc-intro ul:not([class]) > li::before{background:var(--mist);}
.svc-aside{
  margin-top:28px; padding:20px 22px; background:var(--linen);
  border-radius:var(--radius); max-width:340px;
}
.svc-aside h4{font-size:12px; letter-spacing:.06em; color:var(--mist); font-weight:400; margin-bottom:12px;}
.svc-aside p{font-size:14px; color:var(--ink-soft); margin-bottom:11px; max-width:none; line-height:1.55;}
.svc-aside .ic{display:grid; grid-template-columns:16px 1fr; gap:11px; align-items:start;}
.svc-aside .ai{margin-top:4px; color:var(--mist);}
.svc-aside .tel{margin-top:14px; padding-top:13px; border-top:1px solid rgba(34,32,29,.1); color:var(--mist);}
.svc-aside .tel:empty{display:none;}
.svc-aside p:last-child{margin-bottom:0;}
.srow{border-bottom:1px solid var(--line);}
.srow:last-child{border-bottom:none;}
.srow-head{
  width:100%; background:none; border:none; cursor:pointer; text-align:left;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:22px 4px; color:var(--ink); transition:color .3s var(--ease);
}
.srow-head:hover{color:var(--marine);}
.srow-link .sign{transform:rotate(-90deg);}
.s-main{display:flex; flex-direction:column; align-items:flex-start; gap:11px;}
.s-name{font-family:'Spectral', Georgia, serif; font-weight:300; font-size:22px; line-height:1.25;}
.s-meta{
  font-size:12px; color:var(--state-600); background:var(--state-50);
  padding:5px 12px; border-radius:var(--radius); line-height:1.2;
}
.s-side{display:flex; align-items:center; gap:20px; flex-shrink:0;}
.s-price{font-size:16px; font-weight:400; font-variant-numeric:tabular-nums; white-space:nowrap;}
/* procedures sold at several durations quote the lowest price */
.s-price .from{font-size:14px; color:var(--mist); margin-right:3px;}
/* discounted variations — class names mirror the Wagtail template
   (tag tag--sale / old-price) so the markup maps across directly.
   Not gold: gold is reserved for actions, and this is a label. */
.s-tags{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.tag--sale{
  display:inline-flex; align-items:center; flex-shrink:0;
  font-size:12px; line-height:1.2; padding:5px 11px; letter-spacing:.03em;
  border-radius:var(--radius); background:var(--state-700); color:var(--paper);
}
/* the struck price leads so the live one stays last, and therefore keeps the
   same right edge as the undiscounted rows in the price column */
.old-price{
  margin-right:9px; font-size:14px; color:var(--mist);
  text-decoration:line-through; text-decoration-thickness:1px;
}
.vopt .old-price{margin-right:6px; font-size:13px;}
.srow .sign{width:18px; height:18px; position:relative; flex-shrink:0; transition:transform .4s var(--ease);}
.srow .sign::before,.srow .sign::after{
  content:''; position:absolute; top:7px; width:9px; height:1px; background:currentColor;
}
.srow .sign::before{left:1px; transform:rotate(45deg);}
.srow .sign::after{right:1px; transform:rotate(-45deg);}
.srow.open .sign{transform:rotate(180deg);}
.s-panel{max-height:0; overflow:hidden; visibility:hidden; transition:max-height .5s var(--ease-soft), visibility 0s .5s;}
.srow.open .s-panel{visibility:visible; transition:max-height .5s var(--ease-soft);}
.s-inner{padding:2px 4px 26px;}
.s-desc{font-size:16px; color:var(--ink-soft); max-width:520px; margin-bottom:22px;}
.s-desc + .s-desc{margin-top:-12px;}
/* descriptions are rich text, so they arrive as paragraphs */
.s-desc p + p{margin-top:10px;}
/* what the procedure includes, where the description alone runs long */
.s-points{list-style:none; max-width:520px; margin:-8px 0 22px; display:grid; gap:7px;}
.s-points li{
  position:relative; padding-left:19px; font-size:14px;
  color:var(--ink-soft); line-height:1.55;
}
.s-points li::before{
  content:''; position:absolute; left:2px; top:10px;
  width:5px; height:5px; border-radius:50%; background:var(--state-300);
}
/* duration chooser sits with the buttons, where the decision is made */
.s-inner .vopts{margin:0 0 16px -8px;}
.s-choose{font-size:12px; color:var(--mist); margin-bottom:2px;}
.s-buy{display:grid; grid-template-columns:1fr 1fr; gap:14px; max-width:560px;}
.s-opt{display:flex; flex-direction:column; gap:8px;}
.btn-fill,.btn-line{
  width:100%; min-height:52px; padding:15px 20px;
  font-family:'Archivo'; font-weight:400; font-size:14px; letter-spacing:.005em;
  display:flex; align-items:center; justify-content:center; gap:11px;
  cursor:pointer; border-radius:var(--radius); position:relative; overflow:hidden; isolation:isolate;
  transition:color .8s var(--ease), transform .12s var(--ease-out), box-shadow .3s var(--ease);
}
.btn-fill{background:var(--action); color:var(--on-action); border:1px solid var(--gold-600);}
.btn-fill:disabled{opacity:.45; cursor:not-allowed;}
.btn-fill:disabled:hover::before{transform:translate(-50%,-50%) scale(0);}
.btn-fill:active,.btn-line:active{transform:translateY(1px);}
.btn-fill::before{
  content:''; position:absolute; background:var(--action-hover); z-index:-1; border-radius:50%;
  width:170%; aspect-ratio:1/1; left:var(--px,50%); top:var(--py,50%);
  transform:translate(-50%,-50%) scale(0); transition:transform 1.35s var(--ease-out);
}
.btn-fill:hover::before{transform:translate(-50%,-50%) scale(1);}
.btn-line{background:none; color:var(--ink); border:1px solid var(--action);}
.btn-line::before{
  content:''; position:absolute; background:var(--gold-200); z-index:-1; border-radius:50%;
  width:170%; aspect-ratio:1/1; left:var(--px,50%); top:var(--py,50%);
  transform:translate(-50%,-50%) scale(0); transition:transform 1.35s var(--ease-out);
}
.btn-line:hover{color:var(--ink);}
.btn-line:hover::before{transform:translate(-50%,-50%) scale(1);}
.btn-fill .bi,.btn-line .bi{flex-shrink:0; opacity:1; shape-rendering:geometricPrecision;}
.btn-fill .bp{font-weight:500; font-variant-numeric:tabular-nums;}
/* secondary size: fits its content, still a full tap target */
.btn-fill.btn-sm,.btn-line.btn-sm{width:auto; min-height:44px; padding:10px 14px; gap:8px;}
.btn-sm .bi{width:16px; height:16px;}
.s-more{margin-top:20px; font-size:14px;}
/* other groups in the same section, where a pill bar would wrap */
.svc-other{margin-top:64px;}
.svc-other h4{font-size:12px; letter-spacing:.06em; color:var(--mist); font-weight:400; margin-bottom:16px;}
.svc-other ul{display:block; margin:0; columns:2; column-gap:44px;}
.svc-other li{margin-bottom:9px; padding-left:0; font-size:16px; break-inside:avoid;}
.svc-other li::before{content:none;}
.svc-other li a{color:var(--ink-soft); background:none; transition:color .2s;}
.svc-other li a:hover{color:var(--marine);}

/* ---------- procedure detail ---------- */
.pd{padding:56px 0 96px;}
.pd-layout{display:grid; grid-template-columns:1.35fr .65fr; gap:70px; align-items:start;}
.pd-main h2{font-size:clamp(24px,2.5vw,32px); line-height:1.2; margin-bottom:18px;}
.pd-lead{font-size:18px; line-height:1.6; color:var(--ink); max-width:560px; margin-bottom:20px;}
.pd-main p{font-size:16px; color:var(--ink-soft); max-width:560px; margin-bottom:16px;}
.pd-incl{
  margin-top:30px; padding:22px 24px; background:var(--linen);
  border-radius:var(--radius); max-width:560px;
}
.pd-incl h4{font-size:12px; letter-spacing:.06em; color:var(--mist); font-weight:400; margin-bottom:13px;}
.pd-incl .s-points{margin:0; max-width:none;}
.pd-incl .s-points li::before{background:var(--mist);}

/* booking card — the summary card from the reservation flow, one procedure deep */
.pd-side{position:sticky; top:110px;}
/* an info row right after a product section reads as part of it */
.pd:has(+ .stat-facts){padding-bottom:0;}
.pd + .stat-facts{padding:0 0 96px;}
/* gift card description is rich text: editors use h1 for the heading and
   h3 for the opening text, which reads as body copy like the mockup's */
.pd-desc h1,.pd-desc h2{font-size:clamp(24px,2.5vw,32px); line-height:1.2; margin-bottom:18px;}
.pd-desc h3{
  font-family:'Archivo', sans-serif; font-weight:300; letter-spacing:0;
  font-size:16px; line-height:1.7; color:var(--ink-soft); max-width:560px; margin-bottom:16px;
}
.pd-desc p:empty{display:none;}
.pd-fine{font-size:14px; color:var(--mist); margin-top:26px;}
/* values are two or three characters, so they pair up rather than stacking
   five near-empty rows down the card */
.pd-card .vopts.gvals{display:grid; grid-template-columns:1fr 1fr; gap:2px; margin:6px 0 0 -8px;}
.gcustom{margin-top:16px; padding-top:16px; border-top:1px solid var(--line);}
.gcustom label{display:block; font-size:12px; color:var(--mist); margin-bottom:8px;}
.gc-in{position:relative;}
.gc-in .gc-cur{
  position:absolute; left:14px; top:50%; transform:translateY(-50%);
  font-size:16px; color:var(--mist); pointer-events:none;
}
.gc-in input{
  width:100%; border:1px solid var(--shell); background:#fff; border-radius:var(--radius);
  padding:12px 14px 12px 32px; font-family:'Archivo'; font-weight:300; font-size:16px;
  color:var(--ink); font-variant-numeric:tabular-nums;
  -webkit-appearance:none; -moz-appearance:textfield; appearance:none; transition:border-color .3s var(--ease);
}
.gc-in input::placeholder{color:var(--marine-light);}
.gc-in input:hover{border-color:var(--mist);}
.gc-in input:focus{border-color:var(--marine); outline:none;}
.gcustom.is-invalid .gc-in input,
.gcustom.is-invalid .gc-in input:hover,
.gcustom.is-invalid .gc-in input:focus{border-color:var(--err);}
.gcustom.is-invalid .gc-note{color:var(--err);}
.gc-in input::-webkit-outer-spin-button,
.gc-in input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
.gc-note{font-size:12px; color:var(--mist); line-height:1.5; margin-top:8px;}
.pd-card{background:var(--paper); border:1px solid var(--shell); border-radius:var(--radius); overflow:hidden;}
.pd-card .sum-head{border-bottom:1px solid var(--shell);}
.pd-card .sum-body{padding:16px 22px 18px;}
.pd-card .vopts{flex-direction:column; gap:2px; margin:6px 0 0 -8px;}
.pd-card .vopt{width:100%; justify-content:flex-start; padding:9px 11px 9px 8px;}
.pd-card .vopt .vp{margin-left:auto; padding-left:16px;}
.pd-card .sum-foot{border-top:1px solid var(--shell);}
.pd-card .btn-fill,.pd-card .btn-line{margin-top:12px;}
.pd-why{display:grid; gap:11px; margin-top:18px;}
.pd-why p{display:grid; grid-template-columns:16px 1fr; gap:11px; align-items:start;
  font-size:12px; color:var(--mist); line-height:1.5; margin:0;}
.pd-why svg{margin-top:3px;}

/* add-ons — sold only alongside a procedure, so they read as suggestions */
.addons{margin-top:76px; padding-top:38px; border-top:1px solid var(--line);}
.addons h3{font-size:clamp(22px,2.2vw,28px); line-height:1.2; margin-bottom:24px;}
.addons .slead{margin-bottom:34px;}
.addon-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.addon{
  display:flex; flex-direction:column; padding:24px 26px 22px;
  background:#fff; border:1px solid var(--shell); border-radius:var(--radius);
  transition:background-color .4s var(--ease), border-color .4s var(--ease);
}
/* added from the card itself, so the card carries the confirmation */
.addon.is-added{background:var(--linen); border-color:var(--state-200);}
.addon h4{font-family:'Spectral', Georgia, serif; font-weight:300; font-size:20px; line-height:1.25; margin-bottom:12px;}
.addon p{font-size:14px; color:var(--ink-soft); line-height:1.55; margin-bottom:20px;}
.addon .foot{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  margin-top:auto; padding-top:16px; border-top:1px solid rgba(34,32,29,.1);
}
.addon .p{font-size:16px; font-variant-numeric:tabular-nums;}
.addon .dur{color:var(--mist); font-size:14px; margin-right:10px;}
.addon .a{
  background:none; border:none; cursor:pointer; padding:0; color:var(--ink-soft);
  min-height:44px; margin:-14px 0; /* full tap target without moving the row */
  font-family:'Archivo'; font-weight:300; font-size:14px;
  display:inline-flex; align-items:center; gap:8px; transition:color .3s var(--ease);
}
.addon .a:hover{color:var(--marine);}
.addon .a .ic-done,.addon .a.is-added .ic-add{display:none;}
.addon .a.is-added .ic-done{display:block;}
.addon .a.is-added{color:var(--ink); cursor:default;}

/* ---------- prose page ---------- */
/* styles the text page's rich-text field as editors fill it: sections are h3
   (h1/h2 treated the same), h4 is a sub-heading, bold-only paragraphs stand in
   for headings on older pages so they get room above them */
.prose-sec{padding:72px 0 100px;}
.prose-sec--block{padding-top:0;}
.prose{max-width:680px; margin:0 auto;}
/* a page intro above its own content (subscription tables): same column, lined up with what follows */
.prose--start{margin:0;}
.prose-sec--lead:has(+ .subs-sec){padding-bottom:0;}
.prose p{font-size:16px; line-height:1.75; color:var(--ink-soft); margin-bottom:17px;}
.prose p:empty{display:none;}
.prose p:has(> b:only-child){margin-top:34px; margin-bottom:9px;}
.prose :is(h1,h2,h3,h4) + p:has(> b:only-child),
.prose p:has(> b:only-child) + p:has(> b:only-child){margin-top:0;}
.prose > :first-child,
.prose > p:empty:first-child + *{margin-top:0;}
.prose h1,.prose h2,.prose h3{
  font-size:clamp(22px,2.3vw,28px); line-height:1.22; color:var(--ink);
  margin:56px 0 17px; padding-top:24px; border-top:1px solid var(--line);
}
.prose > h1:first-child,.prose > h2:first-child,.prose > h3:first-child{padding-top:0; border-top:none;}
.prose h4{
  font-family:'Archivo', sans-serif; font-weight:500; letter-spacing:-.015em;
  font-size:17px; line-height:1.5; color:var(--ink); margin:32px 0 9px;
}
.prose li{font-size:16px; line-height:1.65; color:var(--ink-soft);}

/* ---------- faq ---------- */
/* built from .srow, so the block drops into any column width unchanged.
   questions are full sentences, so they take the sans face at reading size */
.faq-sec{padding:56px 0 96px;}
.faq-layout{display:grid; grid-template-columns:minmax(0,680px) minmax(260px,340px); gap:70px; justify-content:space-between; align-items:start;}
.faq .s-name{font-family:'Archivo', sans-serif; font-size:18px; letter-spacing:-.01em; line-height:1.4;}
.faq .srow-head{gap:32px; align-items:flex-start;}
.faq .s-side{padding-top:3px;}
.faq .s-desc{max-width:none;}
.faq .s-desc:last-child{margin-bottom:0;}
/* answers are rich text, so paragraphs and lists come from the editor */
.faq .s-desc p + p{margin-top:10px;}
.faq .s-desc li{font-size:14px; line-height:1.55;}
.faq-aside{margin-top:0;}
.faq-aside h4{margin-bottom:14px;}
/* attached under a page's description rather than standing alone */
.faq--inline{max-width:560px; margin-top:70px;}
.faq-head{display:flex; justify-content:space-between; align-items:baseline; gap:24px; margin-bottom:6px;}
.faq-head h3{font-size:clamp(20px,2vw,25px); line-height:1.2;}

/* ---------- subscription table ---------- */
/* editor-built TableBlock: first column names the benefit, the others are plans */
.subs-sec{padding:72px 0 96px;}
.table-scroll{overflow-x:auto;}
.subscriptions{width:100%; border-collapse:collapse; table-layout:fixed; font-size:16px; line-height:1.5; color:var(--ink-soft);}
.subscriptions th,.subscriptions td{padding:16px 20px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line);}
.subscriptions :where(th,td):first-child{padding-left:0; width:32%;}
.subscriptions :where(th,td):last-child{padding-right:0;}
.subscriptions th{font-weight:400; color:var(--ink);}
.subscriptions thead th{vertical-align:bottom; padding-bottom:20px; font-size:14px; border-bottom-color:var(--state-300);}
/* plan columns read as a matrix: values, icons and buttons centred under their plan */
.subscriptions :where(th,td):not(:first-child){text-align:center;}
.subscriptions :where(.tick,.dash,.btn-fill){margin-inline:auto;}
.subscriptions thead strong{white-space:nowrap;}
.subscriptions .tick{display:block; margin-top:2px; color:var(--ink);}
.subscriptions .dash{display:block; margin-top:2px; color:var(--state-300);}
.subscriptions tfoot td{border-bottom:0; padding-top:28px;}
.subscriptions__btn-label{font-size:14px; line-height:1.4; color:var(--ink); margin-bottom:8px;}
.subscriptions .btn-fill + .subscriptions__btn-label{margin-top:24px;}
.subscriptions .bp{white-space:nowrap;}

/* ---------- editorial static page ---------- */
.stat{padding:72px 0 0;}
.stat-lead{max-width:700px; margin:0 auto; text-align:center;}
.stat-lead p{
  font-family:'Spectral', Georgia, serif; font-weight:300;
  font-size:clamp(21px,2.1vw,27px); line-height:1.5; letter-spacing:-.01em; color:var(--ink);
}
.lead-sec--tint{background:var(--linen);}
.lead-grid.is-flipped .lead-img{order:-1;}
.lead-copy h3{
  font-family:'Archivo', sans-serif; font-weight:500; letter-spacing:-.015em;
  font-size:17px; margin:26px 0 8px;
}
.lead-copy h3:first-child{margin-top:0;}
/* a light-ground twin of the dark .facts row used on the homepage */
.facts--light .n{color:var(--ink);}
.facts--light .l{color:var(--mist);}
/* four tiles pointing into the gallery */
.strip{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.strip a{position:relative; overflow:hidden; display:block; aspect-ratio:4/3; background:var(--linen);}
.strip img{
  width:100%; height:100%; object-fit:cover; filter:saturate(.72) brightness(.94);
  transition:filter .85s var(--ease), transform 1.8s var(--ease-out);
}
.strip a:hover img{filter:saturate(1.06) brightness(1.02); transform:scale(1.04);}
/* .know already carries a 56px top margin, so this only tops it up */
.stat-facts{padding:32px 0 88px;}
.stat-cta{
  margin-top:80px; padding:40px; background:var(--linen); border-radius:var(--radius);
  display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap;
}
.stat-cta h3{font-size:clamp(21px,2.2vw,27px); line-height:1.25; max-width:460px;}
.stat-cta .links{display:flex; gap:28px; flex-wrap:wrap;}

/* ---------- basket page ---------- */
/* no thumbnails: procedures are not products with a picture, so the row is
   name / price / remove on one baseline, with quantity beneath the name */
.blines{border-top:1px solid var(--line);}
/* one row: title block, stepper, price, remove — all set against the title's
   first line rather than the two-line block, so the row reads on one baseline */
.bline{
  display:grid; grid-template-columns:1fr auto 92px 32px; gap:0 22px; align-items:start;
  padding:20px 0; border-bottom:1px solid var(--line);
}
.binfo{min-width:0;}
.bline .bn{font-size:18px; line-height:1.4; letter-spacing:-.015em;}
.bline .bc{font-size:14px; line-height:1.4; color:var(--mist); margin-top:3px;}
/* same stepper as the drawer — only the optical offset differs, because here
   it sits against the title's first line rather than under it */
.bline .qty{margin-top:-2px;}
.bline .bp{
  font-size:18px; line-height:1.4; font-variant-numeric:tabular-nums;
  white-space:nowrap; text-align:right;
}
.bline .brm{
  justify-self:end; background:none; border:none; cursor:pointer; color:var(--mist);
  padding:5px; margin:-2px -5px 0 0; display:flex; border-radius:50%;
  transition:color .25s var(--ease), background .25s var(--ease);
}
.bline .brm:hover{color:var(--state-700); background:var(--state-50);}
.bline-empty{
  display:grid; grid-template-columns:19px 1fr; gap:14px; align-items:start;
  padding:32px 0; color:var(--ink-soft); font-size:16px; line-height:1.55;
}
.bline-empty svg{margin-top:4px; opacity:.55;}

/* step sections — one rhythm for every block on the form step */
.fsec{margin-top:40px;}
.fsec:first-of-type{margin-top:0;}
.fsec-lead{font-size:14px; color:var(--ink-soft); line-height:1.55; margin:-4px 0 18px; max-width:520px;}
.fsec-note{font-size:12px; color:var(--mist); line-height:1.55; margin-top:14px; max-width:520px;}
.consent + .consent{margin-top:14px;}
.consent--tight{margin-top:2px;}
.pay-opts{grid-template-columns:repeat(2,1fr);}

/* per-item recipient, and the company block, both disclose on demand */
.recv{padding:17px 0; border-top:1px solid var(--line);}
.recv:last-child{padding-bottom:0;}
.recv .rn{font-size:16px; line-height:1.4;}
.recv .rc{font-size:14px; line-height:1.4; color:var(--mist); margin-top:3px;}
.recv .vopts{margin:10px 0 0 -8px;}
/* matches one column of .frow above, so every field shares a left and right edge */
.recv .fgroup{margin:14px 0 4px; max-width:calc(50% - 7px);}
.disclose{max-height:0; overflow:hidden; visibility:hidden; transition:max-height .45s var(--ease-soft), visibility 0s .45s;}
.disclose.open{max-height:460px; visibility:visible; transition:max-height .45s var(--ease-soft);}
.disclose > .disclose-in{padding-top:16px;}

/* summary panel carries the code field and the call to action */
.sum-disc{padding:14px 22px 16px; border-top:1px solid var(--line);}
.sum-disc .gift-in{max-width:none;}
.sum-foot .rz-next{margin-top:18px;}
.sum-foot .rz-back{display:block; width:100%; text-align:center; margin-top:12px; padding:6px 0;}
.sum-cards{margin-top:18px; display:flex; justify-content:center;}
.sum-cards img{height:26px; width:auto;}

/* ---------- gallery ---------- */
.gal{padding:56px 0 96px;}
.gal-intro{max-width:560px; margin-bottom:44px;}
.gal-intro h2{font-size:clamp(24px,2.5vw,32px); line-height:1.2; margin-bottom:16px;}
.gal-intro p{font-size:16px; color:var(--ink-soft);}
/* quilted — same rhythm as the homepage procedure grid, every ninth tile large */
.gal-grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  grid-auto-rows:240px; grid-auto-flow:dense; gap:16px;
}
.gal-item{
  position:relative; overflow:hidden; display:block; padding:0;
  border:none; background:var(--linen); cursor:pointer; text-align:left;
}
.gal-item:nth-child(9n+1){grid-column:span 2; grid-row:span 2;}
.gal-item img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:saturate(.72) brightness(.94);
  transition:filter .85s var(--ease), transform 1.8s var(--ease-out);
}
.gal-item:hover img,.gal-item:focus-visible img{filter:saturate(1.06) brightness(1.02); transform:scale(1.04);}
.gal-item::after{
  content:''; position:absolute; inset:0; opacity:0;
  background:linear-gradient(0deg, rgba(20,17,14,.72) 0%, rgba(20,17,14,0) 58%);
  transition:opacity .45s var(--ease);
}
.gal-item:hover::after,.gal-item:focus-visible::after{opacity:1;}
.gal-cap{
  position:absolute; z-index:2; left:18px; right:18px; bottom:15px; color:#fff;
  font-size:14px; line-height:1.35; opacity:0; transform:translateY(5px);
  transition:opacity .45s var(--ease), transform .45s var(--ease);
}
.gal-item:nth-child(9n+1) .gal-cap{left:24px; right:24px; bottom:20px; font-size:16px;}
.gal-item:hover .gal-cap,.gal-item:focus-visible .gal-cap{opacity:1; transform:none;}

/* lightbox — native <dialog>, so Escape and the focus trap come for free */
.lb{
  width:100vw; max-width:100vw; height:100dvh; max-height:100dvh;
  margin:0; padding:0; border:none; overflow:hidden;
  background:rgba(14,12,10,.99); color:#fff;
}
.lb::backdrop{background:rgba(14,12,10,.99);}
.lb[open]{display:flex; align-items:center; justify-content:center;}
.lb-fig{
  margin:0; width:100%; height:100%; padding:64px 76px 74px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px;
}
.lb-fig img{
  max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain;
  opacity:0; transition:opacity .35s var(--ease);
}
.lb-fig img.is-in{opacity:1;}
.lb-fig figcaption{
  display:flex; align-items:baseline; gap:16px; flex-shrink:0;
  font-size:15px; color:rgba(255,255,255,.82);
}
.lb-n{font-size:13px; color:rgba(255,255,255,.5); font-variant-numeric:tabular-nums; white-space:nowrap;}
.lb-btn{
  position:absolute; z-index:2; background:none; border:none; cursor:pointer;
  color:rgba(255,255,255,.72); padding:14px; display:flex;
  transition:color .25s var(--ease), background .25s var(--ease); border-radius:50%;
}
.lb-btn:hover{color:#fff; background:rgba(255,255,255,.1);}
.lb-btn:focus-visible{outline:2px solid rgba(255,255,255,.7); outline-offset:2px;}
.lb-close{top:18px; right:20px;}
.lb-prev{left:16px; top:50%; transform:translateY(-50%);}
.lb-next{right:16px; top:50%; transform:translateY(-50%);}

/* ---------- reservation drawer ---------- */
.resv{
  position:fixed; top:0; right:0; bottom:0; width:452px; max-width:92vw; z-index:85;
  background:var(--paper); display:flex; flex-direction:column;
  transform:translateX(101%); transition:transform .55s var(--ease);
  box-shadow:-24px 0 60px rgba(26,23,20,.16);
}
.resv.open{transform:translateX(0);}
.resv-head{
  display:flex; align-items:flex-start; justify-content:space-between;
  padding:22px 28px 18px; background:var(--linen);
  box-shadow:0 18px 30px -24px rgba(26,23,20,.18); position:relative; z-index:2;
}
.resv-head h2{font-size:24px; line-height:1.15;}
.resv-head .n{display:block; font-size:14px; color:var(--mist); margin-top:4px;}
.resv-body{flex:1; overflow-y:auto; scrollbar-gutter:stable; padding:24px 28px 8px;}
.fgroup{margin-bottom:18px;}
.fgroup label:not(.vopt){display:block; font-size:12px; color:var(--mist); margin-bottom:7px;}
.fgroup input,.fgroup textarea,.fgroup select{
  width:100%; border:1px solid transparent; background:#fff; border-radius:var(--radius);
  padding:12px 14px; font-family:'Archivo'; font-weight:300; font-size:16px; color:var(--ink);
  transition:border-color .3s var(--ease);
}
.fgroup input:focus,.fgroup textarea:focus,.fgroup select:focus{border-color:var(--marine);}
.fgroup textarea{resize:vertical; min-height:78px;}
/* phone: country-code prefix and number in one field (built by site.js) */
.phone-field{
  display:flex; align-items:stretch; background:#fff; border:1px solid var(--shell);
  border-radius:var(--radius); transition:border-color .3s var(--ease);
}
.phone-field:hover{border-color:var(--mist);}
.phone-field:focus-within{border-color:var(--marine);}
.fgroup.error .phone-field{border-color:var(--err);}
.fgroup .phone-field input{flex:1; min-width:0; border:none; background:none; padding-left:12px;}
.phone-cc{
  position:relative; flex-shrink:0; display:flex; align-items:center; gap:6px;
  padding:0 12px 0 14px; border-right:1px solid var(--line);
  font-size:16px; color:var(--ink); font-variant-numeric:tabular-nums; white-space:nowrap;
}
.phone-cc::after{
  content:''; width:6px; height:6px; margin:-4px 0 0 2px;
  border-right:1px solid var(--mist); border-bottom:1px solid var(--mist); transform:rotate(45deg);
}
/* the native select sits invisibly on top: its own picker, keyboard and screen reader */
.phone-cc select{position:absolute; inset:0; width:100%; opacity:0; cursor:pointer; font-size:16px;}
.frow{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.resv-foot{background:var(--linen); padding:20px 28px 26px; box-shadow:0 -18px 30px -22px rgba(26,23,20,.16);}
.resv-note{font-size:12px; color:var(--mist); line-height:1.45; text-align:center; margin-top:12px;}
/* ---------- category landing ---------- */
.lead-sec{padding:64px 0 72px;}
.lead-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:70px; align-items:center;}
.lead-copy h2{font-size:clamp(27px,2.9vw,38px); line-height:1.18; margin-bottom:22px; max-width:480px;}
.lead-copy p{color:var(--ink-soft); font-size:16px; margin-bottom:16px; max-width:520px;}
/* an article opens with its intro, so the first paragraph leads */
.lead-copy--intro > p:first-of-type{font-size:18px; line-height:1.6; color:var(--ink);}
.lead-copy--intro p:empty{display:none;}
/* article: procedures it mentions, then a way on to other news */
.art-svc{padding:24px 0 56px;}
/* procedures sit in the text column, continuing the article */
.art-svc .wrap{display:grid; grid-template-columns:1.05fr .95fr; column-gap:70px;}
.art-svc .wrap > *{grid-column:1;}
.art-more{padding:40px 0 96px;}
.art-more .news-grid{margin-top:24px;}
/* secondary to the article title, so smaller than home page section heads */
.art-svc .shead h2,.art-more .shead h2{font-size:clamp(24px,2.5vw,32px); line-height:1.2;}
.lead-img img{width:100%; height:auto; aspect-ratio:5/4; object-fit:cover; filter:saturate(.85);}
.lead-img--portrait img{aspect-ratio:3/4;}
.lead-copy .role{font-size:14px; color:var(--marine); margin-bottom:18px;}
/* long-text pages: the image lines up with the top of the text and stays
   in view while a long text scrolls past it */
.lead-grid--sticky{align-items:start;}
.lead-grid--sticky .lead-img{position:sticky; top:110px;}
.cat-sec{padding:0 0 104px;}
.panel-top{display:flex; align-items:baseline; justify-content:space-between; gap:18px; margin-bottom:9px;}
.panel-price{font-size:16px; font-weight:400; font-variant-numeric:tabular-nums; color:rgba(255,255,255,.9); white-space:nowrap;}
.know{
  display:grid; grid-template-columns:repeat(3,1fr); gap:34px;
  margin-top:56px; padding:34px 38px; background:var(--linen); border-radius:var(--radius);
}
.know-item{display:grid; grid-template-columns:19px 1fr; gap:15px; align-items:start;}
.know-item svg{width:19px; height:19px; margin-top:3px; color:var(--mist);}
.know-item h4{font-family:'Archivo', sans-serif; font-weight:500; letter-spacing:-.015em; font-size:16px; margin-bottom:5px;}
.know-item p{font-size:14px; color:var(--ink-soft); line-height:1.55;}
/* ---------- reservation ---------- */
.rz-hero,.pd-hero{height:42vh; min-height:320px;}
.rz{padding:64px 0 104px;}
.rz-grid{display:grid; grid-template-columns:1.4fr .6fr; gap:56px; align-items:start;}
/* stepper — progress rail, hierarchy carried by weight */
.prog{margin-bottom:48px;}
.prog-labels{display:flex; margin-bottom:13px;}
.pl{
  flex:1; font-size:14px; font-weight:300; color:var(--ink-soft);
  transition:color .45s var(--ease), font-weight .45s var(--ease);
}
.pl.is-active{color:var(--state-600); font-weight:500;}
.pl.is-done{color:var(--mist); font-weight:300;}
.rail{position:relative; height:2px; background:var(--shell); border-radius:2px; overflow:hidden;}
.rail .fill{
  position:absolute; inset:0 auto 0 0; height:100%; width:33.333%;
  background:var(--state-500); border-radius:2px; transition:width .6s var(--ease);
}
/* panes */
.pane{display:none;}
.pane.is-active{display:block; animation:paneIn .45s var(--ease-out);}
@keyframes paneIn{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;}}
.pane h2{font-size:clamp(25px,2.6vw,33px); line-height:1.2; margin-bottom:12px;}
.pane-lead{font-size:16px; color:var(--ink-soft); max-width:560px; margin-bottom:32px;}
/* custom date picker */
.dpick{position:relative;}
.dpick .dfield{
  width:100%; text-align:left; cursor:pointer; border:1px solid var(--shell);
  background-color:#fff; border-radius:var(--radius); padding:12px 42px 12px 14px;
  font-family:'Archivo'; font-weight:300; font-size:16px; color:var(--ink);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23877F75' stroke-width='1.5'%3E%3Crect x='3' y='5' width='18' height='16' rx='1.5'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3Cline x1='8' y1='3' x2='8' y2='7'/%3E%3Cline x1='16' y1='3' x2='16' y2='7'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 13px center; background-size:17px;
  transition:border-color .3s var(--ease);
}
.dpick .dfield:hover{border-color:var(--mist);}
.dpick .dfield.is-empty{color:var(--mist);}
.dpick.open .dfield{border-color:var(--state-500);}
.cal{
  position:absolute; z-index:60; top:calc(100% + 8px); left:0; width:296px;
  background:var(--paper); border:1px solid var(--shell); border-radius:var(--radius);
  box-shadow:0 18px 44px -18px rgba(26,23,20,.28); padding:16px;
  opacity:0; transform:translateY(-6px); pointer-events:none;
  transition:opacity .28s var(--ease), transform .28s var(--ease);
}
.dpick.open .cal{opacity:1; transform:none; pointer-events:auto;}
.cal-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px;}
.cal-head .mo{font-family:'Spectral', Georgia, serif; font-weight:300; font-size:18px;}
.cal-nav{background:none; border:none; cursor:pointer; color:var(--ink-soft); padding:5px; display:flex; border-radius:var(--radius); transition:background .25s var(--ease), color .25s var(--ease);}
.cal-nav:hover:not(:disabled){background:var(--state-50); color:var(--state-600);}
.cal-nav:disabled{opacity:.28; cursor:default;}
.cal-dows,.cal-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:2px;}
.cal-dows span{text-align:center; font-size:12px; color:var(--mist); padding-bottom:6px;}
.cal-grid button{
  aspect-ratio:1/1; border:none; background:none; cursor:pointer; border-radius:var(--radius);
  font-family:'Archivo'; font-weight:300; font-size:14px; color:var(--ink);
  transition:background .2s var(--ease), color .2s var(--ease);
}
.cal-grid button:hover:not(:disabled){background:var(--state-50); color:var(--state-600);}
.cal-grid button:disabled{color:var(--shell); cursor:default;}
.cal-grid button.today{box-shadow:inset 0 0 0 1px var(--state-200);}
.cal-grid button.sel{background:var(--state-500); color:#fff;}
.cal-grid .pad{visibility:hidden;}
/* form controls */
.fgroup select,.fgroup input[type="date"],.fgroup input[type="number"]{
  -webkit-appearance:none; appearance:none;
}
.fgroup select{
  padding-right:42px; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23877F75' stroke-width='1.5'%3E%3Cpolyline points='6 9.5 12 15.5 18 9.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:16px;
}
.fgroup input[type="date"]{
  cursor:pointer; position:relative;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23877F75' stroke-width='1.5'%3E%3Crect x='3' y='5' width='18' height='16' rx='1.5'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3Cline x1='8' y1='3' x2='8' y2='7'/%3E%3Cline x1='16' y1='3' x2='16' y2='7'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 13px center; background-size:17px;
  padding-right:42px;
}
.fgroup input[type="date"]::-webkit-calendar-picker-indicator{
  position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; margin:0;
}
.fgroup input[type="date"]::-webkit-datetime-edit{color:var(--ink);}
.fgroup input[type="number"]::-webkit-outer-spin-button,
.fgroup input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
.fgroup input,.fgroup select,.fgroup textarea{
  border:1px solid var(--shell); background-color:#fff;
}
.fgroup input:hover,.fgroup select:hover{border-color:var(--mist);}
/* category accordion */
.cat{border-bottom:1px solid var(--line);}
.cat-head{
  width:100%; background:none; border:none; cursor:pointer; text-align:left;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:19px 4px; color:var(--ink); font-family:'Spectral', Georgia, serif;
  font-weight:300; font-size:20px; transition:color .3s var(--ease);letter-spacing:-1.5px;
}
.cat-head:hover{color:var(--state-600);}
.cat-head .cmeta{display:flex; align-items:center; gap:16px;letter-spacing:0;}
.cat-head .cnt{font-family:'Archivo'; font-weight:300; font-size:14px; color:var(--mist);}
.cat .chev{width:18px; height:18px; position:relative; flex-shrink:0; transition:transform .4s var(--ease);}
.cat .chev::before,.cat .chev::after{content:''; position:absolute; top:7px; width:9px; height:1px; background:currentColor;}
.cat .chev::before{left:1px; transform:rotate(45deg);}
.cat .chev::after{right:1px; transform:rotate(-45deg);}
.cat.open .chev{transform:rotate(180deg);}
.cat-body{max-height:0; overflow:hidden; visibility:hidden; transition:max-height .5s var(--ease-soft), visibility 0s .5s;}
.cat.open .cat-body{visibility:visible; transition:max-height .5s var(--ease-soft);}
.cat-inner{padding:0 4px 10px;}
.srv{
  display:flex; align-items:flex-start; justify-content:space-between; gap:18px;
  padding:13px 0; border-top:1px solid var(--line);
}
.srv .si{min-width:0;}
.srv .sname{font-size:16px; font-weight:500; letter-spacing:-.015em; line-height:1.3;}
.srv .sdur{
  display:inline-block; margin-top:7px; font-size:12px; color:var(--ink-soft);
  background:var(--linen); padding:4px 10px; border-radius:var(--radius); line-height:1.2;
}
.srv .sr{display:flex; align-items:center; gap:16px; flex-shrink:0; padding-top:1px;}
.srv .sprice{font-size:16px; font-weight:500; font-variant-numeric:tabular-nums; white-space:nowrap;}
.vopts{display:flex; flex-wrap:wrap; gap:4px; margin-top:8px;}
.vopt{
  display:inline-flex; align-items:center; gap:9px;
  padding:7px 11px 7px 8px; border:none; background:none; border-radius:var(--radius);
  cursor:pointer; font-family:'Archivo'; font-weight:300; font-size:14px;
  color:var(--ink-soft); font-variant-numeric:tabular-nums; white-space:nowrap;
  transition:background .25s var(--ease), color .25s var(--ease);
}
.vopt:hover{background:var(--state-50); color:var(--state-600);}
.vopt .rad{
  width:16px; height:16px; flex-shrink:0; border-radius:50%;
  border:1px solid var(--mist); background:#fff;
  display:flex; align-items:center; justify-content:center;
  transition:border-color .25s var(--ease);
}
.vopt .rad::after{
  content:''; display:block; width:8px; height:8px; border-radius:50%;
  background:var(--state-500); transform:scale(0);
  transition:transform .25s var(--ease-out);
}
.vopt:hover .rad{border-color:var(--state-400);}
/* is-on for button groups; :has for native radios, so the checked state styles itself */
.vopt:is(.is-on,:has(input:checked)){color:var(--state-700);}
.vopt:is(.is-on,:has(input:checked)) .rad{border-color:var(--state-500);}
.vopt:is(.is-on,:has(input:checked)) .rad::after{transform:scale(1);}
.vopt:has(input:focus-visible){outline:2px solid var(--state-500); outline-offset:2px;}
/* radios in a form row: level with the inputs beside them, full tap targets */
.fgroup .vopts{margin:0 0 0 -8px; min-height:44px; align-items:center;}
.fgroup .vopt{min-height:44px;}
.vopt{position:relative;}
.vopt input[type="radio"]{
  position:absolute; width:1px; height:1px; margin:0; padding:0; opacity:0; pointer-events:none;
}
.fgroup.error input,.fgroup.error textarea,.fgroup.error select,.fgroup.error .dfield{border-color:var(--err);}
.fgroup .error-msg,.consent .error-msg{display:block; margin-top:6px; font-size:12px; line-height:1.4; color:var(--err);}
.consent .error-msg{grid-column:2;}
.consent.error input{border-color:var(--err);}
ul.messages{list-style:none; margin:0 0 24px; padding:0;}
ul.messages li{font-size:14px; line-height:1.45; color:var(--ink); padding:10px 14px; background:var(--linen); border-radius:var(--radius);}
.pick{
  width:30px; height:30px; flex-shrink:0; cursor:pointer; border-radius:var(--radius);
  border:1px solid var(--mist); background:#fff; color:transparent;
  display:flex; align-items:center; justify-content:center;
  transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.pick:hover{border-color:var(--state-400); color:var(--state-200);}
.pick.is-on{background:var(--state-500); border-color:var(--state-500); color:#fff;}
.srv.is-on .sname{color:var(--state-700);}
/* mode control — a setting on paper, not a boxed wizard */
.sec-lbl{
  display:block; font-family:'Archivo', sans-serif; font-weight:500;
  font-size:12px; text-transform:uppercase; letter-spacing:.12em;
  color:var(--ink-soft); margin-bottom:16px;
}
.modes{margin-bottom:40px;}
.mopts{display:grid; grid-template-columns:repeat(3,1fr); gap:10px;}
.mopt{
  position:relative; display:block; text-align:left; padding:18px 46px 20px 18px;
  border:1px solid var(--shell); background:#fff; border-radius:var(--radius);
  cursor:pointer; font-family:'Archivo'; font-weight:300;
  transition:border-color .25s var(--ease), background .25s var(--ease);
}
.mopt:focus-visible{outline:2px solid var(--state-500); outline-offset:2px;}
.mopt:hover{border-color:var(--state-400); background:#fff;}
.mopt.is-on{border-color:var(--state-700); background:#fff; box-shadow:inset 0 0 0 1px var(--state-700);}
.mopt .rad{
  position:absolute; top:18px; right:18px;
  width:18px; height:18px; border-radius:50%;
  border:1px solid var(--mist); background:#fff;
  display:flex; align-items:center; justify-content:center;
  transition:border-color .25s var(--ease), background .25s var(--ease);
}
.mopt .rad::after{
  content:''; display:block; width:8px; height:8px; border-radius:50%;
  background:var(--state-500); transform:scale(0); transition:transform .25s var(--ease-out);
}
.mopt:hover .rad{border-color:var(--state-400);}
.mopt.is-on .rad{border-color:var(--state-500);}
.mopt.is-on .rad::after{transform:scale(1);}
.mopt .mo-t{display:block; font-size:16px; font-weight:500; letter-spacing:-.015em; color:var(--ink); line-height:1.3; transition:color .25s var(--ease);}
.mopt .mo-d{display:block; margin-top:7px; font-size:14px; color:var(--ink-soft); line-height:1.5;}
.mopt.is-on .mo-t{color:var(--state-700);}
.mopt.is-on .mo-d{color:var(--state-700); opacity:.82;}
.sec{margin-top:40px;}
/* shared contact block */
.sblock{background:var(--linen); border-radius:var(--radius); padding:20px 22px 22px;}
.sblock .sb-lead{font-size:14px; color:var(--ink-soft); margin-bottom:18px;}
.sblock .fgroup input,.sblock .fgroup select,.sblock .fgroup textarea{background-color:#fff;}
/* per-procedure entry cards */
.entry{background:var(--linen); border-radius:var(--radius); margin-bottom:12px; position:relative;}
.entry.open{z-index:5;}
/* the card with an open calendar sits above the cards after it */
.entry:has(.dpick.open){z-index:6;}
.entry-head{
  width:100%; background:none; border:none; cursor:pointer; text-align:left;
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:18px 20px; color:var(--ink);
}
.entry-head .eh-l{display:flex; flex-direction:column; gap:4px; min-width:0;}
.entry-head .en{font-family:'Spectral', Georgia, serif; font-weight:300; font-size:18px; line-height:1.25;}
.entry-head .es{display:flex; align-items:center; gap:6px; font-size:14px; color:var(--ink);}
.entry-head .es svg{flex-shrink:0;}
.entry-head .es.todo{color:var(--err);}
.entry-head .es.done svg{color:var(--ok);}
.entry-head .chev{width:18px; height:18px; position:relative; flex-shrink:0; transition:transform .4s var(--ease);}
.entry-head .chev::before,.entry-head .chev::after{content:''; position:absolute; top:8px; width:9px; height:1px; background:currentColor;}
.entry-head .chev::before{left:1px; transform:rotate(45deg);}
.entry-head .chev::after{right:1px; transform:rotate(-45deg);}
.entry.open .chev{transform:rotate(180deg);}
.entry-body{max-height:0; overflow:hidden; border-radius:0 0 var(--radius) var(--radius); transition:max-height .5s var(--ease-soft);}
.entry-inner{padding:2px 20px 22px; background:var(--paper);}
.entry-sec{font-family:'Archivo', sans-serif; font-weight:500; letter-spacing:-.015em; font-size:14px; margin:22px 0 12px;}
.entry-sec:first-child{margin-top:18px;}
.copy-row{
  display:flex; align-items:center; gap:11px; padding:12px 14px; margin:18px 0 4px;
  background:var(--linen); border-radius:var(--radius); font-size:14px; color:var(--ink-soft);
}
.copy-row input{
  -webkit-appearance:none; appearance:none; margin:0; width:18px; height:18px; flex-shrink:0;
  border:1px solid var(--state-200); border-radius:var(--radius); background:#fff; cursor:pointer;
  display:grid; place-content:center; transition:background .25s var(--ease), border-color .25s var(--ease);
}
.copy-row input::before{
  content:''; width:10px; height:10px; transform:scale(0); transition:transform .22s var(--ease-out);
  background:no-repeat center/10px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpolyline points='5 12.5 10 17.5 19 7'/%3E%3C/svg%3E");
}
.copy-row input:checked{background:var(--state-500); border-color:var(--state-500);}
.copy-row input:checked::before{transform:scale(1);}
.copy-row label{cursor:pointer;}
.consent{display:grid; grid-template-columns:18px 1fr; gap:13px; align-items:start; margin-top:40px; font-size:14px; color:var(--ink-soft); line-height:1.55;}
.consent input{
  -webkit-appearance:none; appearance:none; margin:2px 0 0; width:18px; height:18px;
  border:1px solid var(--mist); border-radius:var(--radius); background:#fff; cursor:pointer;
  display:grid; place-content:center; transition:background .25s var(--ease), border-color .25s var(--ease);
}
.consent input::before{
  content:''; width:10px; height:10px; transform:scale(0);
  transition:transform .22s var(--ease-out);
  background:no-repeat center/10px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpolyline points='5 12.5 10 17.5 19 7'/%3E%3C/svg%3E");
}
.consent input:hover{border-color:var(--state-400);}
.consent input:checked{background:var(--state-500); border-color:var(--state-500);}
.consent input:checked::before{transform:scale(1);}
.consent small{display:block; margin-top:12px;}
.consent a{border-bottom:1px solid var(--line);}
.consent a:hover{color:var(--state-600);}
/* nav */
.rz-nav{display:flex; flex-direction:column; align-items:center; gap:18px; margin-top:20px;}
.rz-back{
  background:none; border:none; cursor:pointer; font-family:'Archivo'; font-weight:300;
  font-size:14px; color:var(--mist); padding:2px 0; transition:color .3s var(--ease);
}
.rz-back:hover{color:var(--state-600);}
.rz-back[hidden]{display:none;}
.rz-next{width:100%;}
.rz-next:disabled{opacity:.45; cursor:not-allowed;}
/* summary — header / body / footer, mirroring the cart drawer */
.rz-side{position:sticky; top:110px;}
.rz-sum{background:var(--paper); border-radius:var(--radius); overflow:hidden;}
.sum-head{
  background:var(--linen); padding:20px 22px 17px;
}
.sum-head h3{font-family:'Spectral', Georgia, serif; font-weight:300; font-size:22px; line-height:1.15;}
.sum-head .cnt{display:block; font-size:14px; color:var(--ink-soft); margin-top:5px;}
.sum-body{padding:4px 22px;}
.sum-empty{display:flex; gap:12px; align-items:flex-start; color:var(--ink-soft); font-size:14px; line-height:1.55; padding:20px 0;}
.sum-empty svg{flex-shrink:0; margin-top:2px; opacity:.6;}
.sum-item{
  display:grid; grid-template-columns:1fr auto; gap:3px 14px; align-items:baseline;
  margin:0 -22px; padding:15px 22px; border-bottom:1px solid var(--line);
}
.sum-item:last-child{border-bottom:none;}
.sum-item .sn2{grid-column:1; grid-row:1; font-size:14px; font-weight:500; letter-spacing:-.015em; line-height:1.32; color:var(--ink);}
.sum-item .sp2{grid-column:2; grid-row:1; justify-self:end; font-size:14px; color:var(--ink); font-variant-numeric:tabular-nums; white-space:nowrap;}
.sum-item .sw2 svg{flex-shrink:0; color:var(--mist); margin-top:-1px; align-self:center;}
.sum-item .sw2{grid-row:3;
  grid-column:1 / -1; display:flex; align-items:center; gap:9px; margin-top:8px;
  font-size:14px; color:var(--ink-soft); line-height:1.35;
}
.sum-item .sd2{
  grid-column:1; grid-row:2; font-size:14px; color:var(--ink-soft);
}
.sum-item .rmv{
  grid-column:2; grid-row:2; justify-self:end; align-self:center;
  background:none; border:none; cursor:pointer; color:var(--mist); padding:2px;
  margin:0 -2px 0 0; display:inline-flex; opacity:.7;
  transition:opacity .25s var(--ease), color .25s var(--ease);
}
.sum-item .rmv:hover{opacity:1; color:var(--state-700);}
.sum-foot{
  background:var(--linen); padding:18px 22px 20px;
}
.sum-row:not([hidden]){display:flex; justify-content:space-between; align-items:baseline; gap:14px; font-size:14px; color:var(--ink-soft); margin-bottom:10px;}
.sum-row span:last-child{color:var(--ink); font-variant-numeric:tabular-nums;}
.sum-row.total{margin:0; font-size:16px; color:var(--ink);}
.sum-row.total span:last-child{font-size:20px; font-weight:400; color:var(--ink);}
.sum-note{font-size:12px; color:var(--mist); line-height:1.55; margin-top:16px;}
/* sent */
.rz-done{text-align:center; padding:40px 0 10px;}
.rz-done .tick{width:52px; height:52px; margin:0 auto 22px; border-radius:50%; background:var(--state-50); color:var(--state-600); display:flex; align-items:center; justify-content:center;}
.rz-done h2{margin-bottom:12px;}
.rz-done p{font-size:16px; color:var(--ink-soft); max-width:420px; margin:0 auto;}
  #pvnav{position:fixed; top:50%; right:0; transform:translateY(-50%); z-index:200;
         font-family:'Archivo',system-ui,sans-serif; display:flex; align-items:center;}
  #pvnav .pv-tab{
    background:#22201D; color:#F2EEE7; padding:16px 9px; cursor:pointer;
    border-radius:4px 0 0 4px; display:flex; flex-direction:column; align-items:center; gap:9px;
    font-size:11px; letter-spacing:.12em; text-transform:uppercase; writing-mode:vertical-rl;
    box-shadow:-2px 0 14px rgba(26,23,20,.18);
  }
  #pvnav .pv-panel{
    background:#22201D; color:#F2EEE7; width:0; overflow:hidden;
    border-radius:4px 0 0 4px; box-shadow:-6px 0 26px rgba(26,23,20,.24);
    transition:width .32s cubic-bezier(.65,0,.25,1);
  }
  #pvnav:hover .pv-panel,#pvnav.open .pv-panel{width:236px;}
  #pvnav .pv-in{padding:18px 18px 16px; width:236px;}
  #pvnav .pv-h{font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:#8C857A; margin-bottom:12px;}
  #pvnav a{
    display:flex; align-items:baseline; gap:9px; padding:9px 10px; margin:0 -10px;
    color:#E5DFD4; text-decoration:none; font-size:14px; border-radius:3px;
    transition:background .2s ease, color .2s ease;
  }
  #pvnav a:hover{background:rgba(255,255,255,.08); color:#fff;}
  #pvnav a.is-here{color:#FFAE0C;}
  #pvnav a .pv-n{font-size:11px; color:#8C857A; min-width:14px;}
  #pvnav a.is-here .pv-n{color:#FFAE0C;}
  #pvnav .pv-foot{margin-top:12px; padding-top:11px; border-top:1px solid rgba(255,255,255,.12);
                  font-size:11px; color:#8C857A; line-height:1.5;}

/* ---------- responsive ---------- */
@media(max-width:1000px){
  /* subscription table scrolls sideways; the benefit column stays put */
  .subscriptions{table-layout:auto;}
  .subscriptions th,.subscriptions td{min-width:136px; padding:14px 12px;}
  .subscriptions :where(th,td):first-child{position:sticky; left:0; z-index:1; min-width:128px; width:auto; padding-right:14px; background:var(--paper); box-shadow:1px 0 0 var(--line);}
  .wrap{padding:0 22px;}
  .hrow{padding:8px 22px;}
  .ov-top{padding-left:22px; padding-right:22px;}
  .logos .logo{height:58px;}
  .logos .logo .logo-svg{height:58px;}
  .logos .logo .logo-mark-only{height:29.5px;}
  .site-top.compact .logos .logo{height:38px;}
  .lang{display:none;}
  /* the header hides it on small screens, so the menu carries it */
  .ov-top .lang{display:flex;}
  .ov-top .lang button.ulink{min-height:44px; min-width:32px;}
  /* room for close + languages beside a centred logo */
  .ov-top .h-left{gap:12px;}
  .ov-top .lang{gap:4px;}
  .ov-top .lang svg{display:none;}
  .act span.lbl{display:none;}
  .ov-body{grid-template-columns:1fr; gap:40px; padding:24px 22px 60px;}
  .ov-side{border-left:none; border-top:1px solid var(--line); padding-left:0; padding-top:34px;}
  .panels{grid-template-columns:1fr;}
  .panel-cap{left:24px; right:24px; bottom:24px;}
  .panel-cap h3{font-size:26px;}
  .proc{grid-template-columns:1fr; grid-auto-rows:230px;}
  .pcard.feature{grid-column:span 1; grid-row:span 2;}
  .news-grid{grid-template-columns:repeat(2,1fr); gap:28px;}
  .about-in{grid-template-columns:1fr; gap:36px;}
  /* minmax(0,…) so long hours text wraps instead of widening the column */
  .fgrid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px;}
  .fbot{flex-direction:column; align-items:flex-start;}
  .lead-grid{grid-template-columns:1fr; gap:34px;}
  .lead-grid--sticky .lead-img{position:static;}
  .art-svc .wrap{grid-template-columns:1fr;}
  /* stacked, the heading leads every section — alternating sides is a
     desktop device and reads as inconsistency once the columns collapse */
  .lead-grid.is-flipped .lead-img{order:0;}
  .about-in.is-flipped > img{order:0;}
  .know{grid-template-columns:1fr; gap:24px; padding:26px 24px;}
  .stat{padding-top:48px;}
  .strip{grid-template-columns:repeat(2,1fr); gap:10px;}
  .stat-cta{margin-top:56px; padding:28px 24px; gap:22px;}
  .svc-layout{grid-template-columns:1fr; gap:38px;}
  .svc-aside,.svc-intro ul:not([class]){max-width:none;}
  .s-buy{grid-template-columns:1fr;}
  .svc-other ul{columns:1;}
  .pd-layout,.faq-layout{grid-template-columns:1fr; gap:40px;}
  .pd-side{position:static;}
  .prose h1,.prose h2,.prose h3{margin-top:44px; padding-top:20px;}
  .pd-lead,.pd-main p,.pd-incl{max-width:none;}
  .addon-grid{grid-template-columns:1fr;}
  /* too narrow for four columns: title spans the row, controls sit beneath it */
  .bline{grid-template-columns:1fr auto 32px; gap:0 14px;}
  .binfo{grid-column:1 / -1;}
  .bline .qty{grid-column:1; justify-self:start; margin-top:14px;}
  .bline .bp{grid-column:2; font-size:16px; align-self:center; margin-top:14px;}
  .bline .brm{grid-column:3; align-self:center; margin-top:14px;}
  .bline .bn{font-size:16px;}
  .pay-opts{grid-template-columns:1fr;}
  /* .frow is one column here, so the recipient field matches it again */
  .recv .fgroup{max-width:none;}
  .gal-grid{grid-template-columns:repeat(2,1fr); grid-auto-rows:170px; gap:10px;}
  .gal-item:nth-child(9n+1){grid-row:span 2;}
  /* captions can't hover on touch, so they rest visible on the large tiles */
  .gal-item:nth-child(9n+1)::after,.gal-item:nth-child(9n+1) .gal-cap{opacity:1; transform:none;}
  .lb-fig{padding:58px 14px 66px;}
  .lb-prev{left:2px;}
  .lb-next{right:2px;}
  .rz-grid{grid-template-columns:1fr; gap:36px;}
  .rz-side{position:static; order:-1;}
  /* the summary now sits above the list, so the step button rides along at the bottom */
  .rz-nav{
    position:fixed; left:0; right:0; bottom:0; z-index:50; margin:0;
    flex-direction:row-reverse; gap:16px;
    padding:12px 22px calc(12px + env(safe-area-inset-bottom));
    background:var(--paper); border-top:1px solid var(--line);
  }
  .rz-nav .rz-back{flex-shrink:0; min-height:44px; padding:0 4px;}
  body:has(.rz-nav){padding-bottom:calc(78px + env(safe-area-inset-bottom));}
  /* a basket reads items first, total after — unlike the reservation summary */
  .rz--cart .rz-side{order:0;}
  .frow{grid-template-columns:1fr;}
  .mopts{grid-template-columns:1fr;}
  .rz-next{min-width:0; flex:1;}
}
@media(max-width:700px){
  .subs-sec{padding:48px 0 64px;}
  .subscriptions{font-size:14px;}
  .subscriptions :where(th,td):first-child{min-width:176px;}
  /* footer: one column, then badges and social links on their own rows */
  footer{padding-top:56px;}
  .fgrid{grid-template-columns:minmax(0,1fr); gap:40px; margin-bottom:40px;}
  .fbot{gap:24px;}
  .fbot-r{flex-direction:column; align-items:flex-start; gap:24px;}
  .fbadges{flex-wrap:wrap; gap:20px;}
  /* 44px tap areas; the negative margin keeps the first icon on the text edge */
  .fsocial{padding-left:0; border-left:none; gap:0; margin-left:-13px;}
  .fsocial a{width:44px; height:44px; align-items:center; justify-content:center;}
  .nl-modal iframe{height:740px;}
  /* three icons fit their half of the header; the cart sits flush to the
     edge like the burger on the left */
  .hrow{gap:12px;}
  .h-right{gap:0;}
  .act{padding:10px;}
  .h-right .act:last-child{padding-right:0;}
  /* menu: one column of sections; the chevron opens a section's sub-pages,
     the heading itself still goes to the section page */
  .ov-body{gap:32px;}
  .ov-cols{grid-template-columns:1fr; gap:0;}
  .ov-item{border-bottom:1px solid var(--line);}
  .ov-item + .ov-item{margin-top:0;}
  .ov-head{display:flex; align-items:center; justify-content:space-between; gap:16px;}
  .ov-group a.top{font-size:22px; margin:0; padding:14px 0; flex:1;}
  .ov-tog{display:flex; align-items:center; justify-content:center; width:44px; height:44px; margin-right:-12px;
    background:none; border:none; cursor:pointer; color:var(--ink); flex-shrink:0;}
  .ov-tog svg{transition:transform .35s var(--ease);}
  .ov-item.open .ov-tog svg{transform:rotate(180deg);}
  .ov-sub{display:grid; grid-template-rows:0fr; visibility:hidden; transition:grid-template-rows .35s var(--ease), visibility 0s .35s;}
  .ov-sub > ul{overflow:hidden;}
  .ov-item.open .ov-sub{grid-template-rows:1fr; visibility:visible; transition:grid-template-rows .35s var(--ease);}
  .ov-group li{margin:0;}
  .ov-group li a{display:block; padding:10px 0;}
  .ov-group li:last-child a{margin-bottom:12px;}
  /* the last section's rule already closes the list */
  .ov-side{border-top:none; padding-top:0;}
  .orow{padding:10px 0;}
  .news-grid{grid-template-columns:1fr;}
  /* only the direct parent, so the trail reads as a way back */
  .crumbs > :not(:last-child){display:none;}
  #pvnav .pv-tab{padding:12px 7px;}
  #pvnav:hover .pv-panel{width:0;}
  #pvnav.open .pv-panel{width:210px;}
  #pvnav .pv-in{width:210px;}
}
@media(max-width:520px){
  .cart,.resv{width:100%;}
}
@media(prefers-reduced-motion:reduce){
  .pcard:hover img,.panel:hover img,.ncard:hover img{transform:none;}
  .hslide{animation:none; opacity:1;}
  .hslide:not(:first-child){display:none;}
  *{transition:none !important; animation:none !important;}
}