/* ===========================================================
   Intactphysio — shared stylesheet
   =========================================================== */

:root{
  --bg:#EFEDE4;
  --surface:#FFFFFF;
  --surface-2:#E7E3D6;
  --ink:#16221F;
  --ink-soft:#48534E;
  --ink-faint:#7C857F;
  --ember:#E1502B;
  --ember-dark:#C43F1F;
  --ember-tint:#FBE3DA;
  --teal:#2B6F60;
  --teal-dark:#1F5347;
  --teal-tint:#DDEAE4;
  --line:#DEDACD;
  --amber:#B9791A;
  --amber-tint:#F5E7CC;

  --font-display:'Bricolage Grotesque', ui-sans-serif, system-ui, sans-serif;
  --font-body:'Figtree', ui-sans-serif, system-ui, sans-serif;
  --font-mono:'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;

  --radius-s:8px;
  --radius-m:16px;
  --radius-l:28px;
  --shadow:0 1px 2px rgba(22,34,31,.04), 0 8px 24px -12px rgba(22,34,31,.16);
  --maxw:1320px;

  /* one vertical rhythm for the whole site */
  --sp-section:60px;   /* top & bottom padding of every band, incl. hero + footer */
  --sp-block:36px;     /* heading/intro -> content, and between blocks inside a band */
  --sp-gap:28px;       /* every grid gutter */
}
@media (max-width:1000px){ :root{--sp-section:52px; --sp-block:32px; --sp-gap:24px;} }
@media (max-width:720px){  :root{--sp-section:44px; --sp-block:28px; --sp-gap:20px;} }

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:18px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

img,svg{display:block; max-width:100%;}
a{color:inherit;}
ul{list-style:none; margin:0; padding:0;}
p{margin:0;}

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:700; line-height:1.1; margin:0;
  letter-spacing:-.015em; text-wrap:balance;
}
h1{font-size:clamp(2.4rem,1.7rem+2.6vw,3.6rem);}
h2{font-size:clamp(1.75rem,1.35rem+1.6vw,2.5rem);}
h3{font-size:1.28rem; font-weight:600;}
.h1-quiet{font-size:clamp(1.75rem,1.35rem+1.6vw,2.5rem);}
h4{font-size:1.06rem; font-weight:600;}

.container{max-width:var(--maxw); margin:0 auto; padding-inline:32px; width:100%;}
.section,
.section-tight{padding-block:var(--sp-section);}
.section-alt{background:var(--surface-2);}
/* utilities on the same scale — used instead of one-off inline margins */
.mt-block{margin-top:var(--sp-block);}
.mb-block{margin-bottom:var(--sp-block);}
.section-footnote{
  margin-top:var(--sp-block); color:var(--ink-soft);
  font-size:.95rem; max-width:64ch;
}

.eyebrow{
  font-family:var(--font-mono); font-size:.72rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--teal);
  display:inline-flex; align-items:center; gap:.5em; margin-bottom:12px;
}
.eyebrow::before{content:""; width:18px; height:1.5px; background:currentColor;}

.lede{font-size:1.12rem; line-height:1.6; color:var(--ink-soft); max-width:62ch;}
.section > .container > h2,
.hero > .container > h2{margin-bottom:12px;}
.section-note{color:var(--ink-soft); max-width:66ch; margin-bottom:var(--sp-block); font-size:1.06rem;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.5em;
  font-weight:600; font-size:1rem; padding:16px 32px;
  border-radius:8px; border:1.5px solid transparent;
  text-decoration:none; cursor:pointer; white-space:nowrap;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.btn-primary{background:var(--ember); color:#fff;}
.btn-primary:hover{background:var(--ember-dark);}
.btn-ghost{background:#16221F; color:#FFFFFF; border-color:#16221F;}
.btn-ghost:hover{background:#0B1210; border-color:#0B1210;}
.btn:focus-visible,a:focus-visible,summary:focus-visible,button:focus-visible{
  outline:2.5px solid var(--teal); outline-offset:2px;
}
.cta-pair{display:flex; gap:14px; flex-wrap:wrap; margin-top:var(--sp-block);}

.pill{
  display:inline-flex; align-items:center; gap:.4em; align-self:flex-start;
  font-size:.72rem; font-weight:600; padding:.35em .8em; border-radius:999px;
}
.pill-teal{background:var(--teal-tint); color:var(--teal-dark);}
.pill-ember{background:var(--ember-tint); color:var(--ember-dark);}
.pill-pending{background:var(--amber-tint); color:var(--amber);}

/* ---------- header ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-row{
  max-width:var(--maxw); margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; padding:22px 24px;
}
.logo{display:flex; align-items:center; gap:.5em; text-decoration:none; color:var(--ink);}
.logo svg{width:54px; height:54px;}
.logo-word{font-family:var(--font-display); font-weight:700; font-size:1.95rem; letter-spacing:-.02em;}
.logo-word em{font-style:normal; color:var(--ember);}

nav.primary{display:flex; align-items:center; gap:32px;}
.nav-actions{display:flex; align-items:center; gap:12px; margin-left:22px;}
nav.primary a{
  font-size:1rem; font-weight:500; text-decoration:none; color:var(--ink-soft);
  padding:7px 0; border-bottom:2px solid transparent;
}
nav.primary a:hover{color:var(--ink); border-color:var(--teal);}
nav.primary a[aria-current="page"]{color:var(--ink); border-color:var(--ember);}

/* Book an Appointment, as a button in the menu */
nav.primary a.nav-cta{
  background:var(--ember); color:#fff; border-radius:8px;
  padding:.68em 1.4em; border-bottom:none; font-weight:600;
  transition:background .15s ease;
}
nav.primary a.nav-cta:hover{background:var(--ember-dark); color:#fff; border-color:transparent;}
nav.primary a.nav-cta[aria-current="page"]{color:#fff; border-color:transparent;}

/* Blog, as its own white box beside the booking button */
nav.primary a.nav-blog{
  background:#FFFFFF; color:#16221F; border-radius:8px;
  padding:.68em 1.4em; border-bottom:none; font-weight:600;
  transition:background .15s ease;
}
nav.primary a.nav-blog:hover{background:var(--bg); color:#16221F; border-color:transparent;}
nav.primary a.nav-blog[aria-current="page"]{color:#16221F; border-color:transparent;}

.nav-toggle-label{
  display:none; cursor:pointer; width:44px; height:44px;
  border:1px solid var(--line); border-radius:var(--radius-s);
  align-items:center; justify-content:center;
}
#nav-toggle{display:none;}
.header-actions{display:flex; align-items:center; gap:10px;}

@media (max-width:900px){
  nav.primary{
    position:fixed; inset:99px 0 auto 0; background:var(--bg);
    flex-direction:column; align-items:stretch; gap:0;
    padding:16px 24px 24px; border-bottom:1px solid var(--line);
    opacity:0; pointer-events:none; transform:translateY(-8px);
    transition:opacity .18s ease, transform .18s ease;
  }
  nav.primary a{padding:14px 2px; border-bottom:1px solid var(--line); font-size:1rem;}
  .nav-actions{flex-direction:column; align-items:stretch; gap:10px; margin-left:0; margin-top:16px;}
  nav.primary a.nav-blog,
  nav.primary a.nav-cta{text-align:center; padding:14px 18px; border-bottom:none;}
  #nav-toggle:checked ~ .nav-row nav.primary{opacity:1; pointer-events:auto; transform:none;}
  .nav-toggle-label{display:flex;}
}
@media (max-width:520px){
  .header-actions .btn .long{display:none;}
  .logo svg{width:44px; height:44px;}
  .logo-word{font-size:1.6rem;}
  nav.primary{inset-block-start:89px;}
}

/* ---------- hero ---------- */
.hero{padding-block:var(--sp-section);}
.hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center;}
@media (max-width:860px){ .hero-grid{grid-template-columns:1fr; gap:32px;} }
.hero h1{margin:.3em 0 .35em;}
.hero .subline{
  font-family:var(--font-display); font-weight:500;
  font-size:1.35rem; color:var(--teal-dark); margin-bottom:20px;
}
.badge-row{
  display:flex; gap:10px; flex-wrap:wrap; align-items:center;
  margin-top:24px; font-size:.84rem; color:var(--ink-faint);
}
.badge-row .dot{width:4px; height:4px; border-radius:50%; background:var(--ink-faint);}
.badge-row strong{color:var(--ink);}

/* Two neighbouring bands on the SAME background share one unit of space instead
   of stacking two, so the rhythm reads evenly whether or not the colour changes. */
.hero:not(.section-alt):has(+ .section:not(.section-alt)),
.section:not(.section-alt):has(+ .section:not(.section-alt)),
.hero.section-alt:has(+ .section.section-alt),
.section.section-alt:has(+ .section.section-alt){padding-bottom:calc(var(--sp-section) / 2);}

.hero:not(.section-alt) + .section:not(.section-alt),
.section:not(.section-alt) + .section:not(.section-alt),
.hero.section-alt + .section.section-alt,
.section.section-alt + .section.section-alt{padding-top:calc(var(--sp-section) / 2);}

/* ---------- cards & grids ---------- */
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-gap);}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-gap);}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-gap);}
@media (max-width:900px){ .grid-3,.grid-4{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;} }

.card{
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-m); padding:32px;
  box-shadow:var(--shadow);
  display:flex; flex-direction:column; gap:12px;
}
.card p{color:var(--ink-soft); font-size:1rem;}
.card .icon-badge{
  width:46px; height:46px; border-radius:var(--radius-s);
  background:var(--teal-tint); color:var(--teal-dark);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}

.list-card{
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-m); padding:16px 18px;
  display:flex; align-items:center; gap:12px;
}
.list-card .icon{width:20px; height:20px; color:var(--teal); flex-shrink:0;}
.list-card h4{font-size:.95rem;}
.list-card p{font-size:.8rem; color:var(--ink-faint);}

.icon{width:24px; height:24px; stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;}

.ticklist{display:flex; flex-direction:column; gap:10px;}
/* find-us right column: pin + maps button, then the notes list */
.find-visual{display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%;}
.map-block{display:flex; flex-direction:column; align-items:center; width:260px; max-width:100%;}
.map-block .illus{width:100%;}
.find-visual .ticklist{margin-top:var(--sp-block); width:100%; max-width:480px;}
.find-grid > div > .info-row:last-of-type{margin-bottom:0;}
@media (max-width:860px){
  .find-visual{align-items:flex-start;}
  .find-visual .ticklist{margin-top:22px;}
}

.ticklist li{display:flex; gap:10px; font-size:.93rem; color:var(--ink-soft);}
.ticklist li::before{
  content:""; flex:0 0 auto; width:7px; height:7px; border-radius:50%;
  background:var(--teal); margin-top:.55em;
}

.note{
  background:var(--teal-tint); border-radius:var(--radius-m);
  padding:18px 22px; display:flex; gap:14px;
  font-size:.9rem; color:var(--teal-dark);
}
.note .icon{color:var(--teal-dark); flex-shrink:0;}
.note strong{display:block; font-family:var(--font-display);}
.note.amber{background:var(--amber-tint); color:var(--amber);}
.note.amber .icon{color:var(--amber);}

/* ---------- animated illustrations ---------- */
.illus{
  background:var(--teal-tint); border-radius:var(--radius-l);
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:4/3; padding:20px; overflow:hidden;
}
.illus.ember{background:var(--ember-tint);}
.illus.plain{background:transparent; padding:0;}
.illus.compact{aspect-ratio:16/9; padding:16px;}
.illus svg{width:78%; height:78%;}

.ill-ink{fill:var(--ink);} .ill-ink-s{stroke:var(--ink); fill:none;}
.ill-teal{fill:var(--teal);} .ill-teal-s{stroke:var(--teal); fill:none;}
.ill-ember{fill:var(--ember);} .ill-ember-s{stroke:var(--ember); fill:none;}
.ill-ground{fill:var(--ink); opacity:.1;}

@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(-5px);}}
@keyframes sway{0%,100%{transform:rotate(-4deg);}50%{transform:rotate(4deg);}}
@keyframes pulse-ring{0%{transform:scale(.85);opacity:.9;}70%{transform:scale(1.35);opacity:0;}100%{opacity:0;}}
@keyframes dash{to{stroke-dashoffset:0;}}
@keyframes twinkle{0%,100%{opacity:.25;}50%{opacity:1;}}
@keyframes stride{0%,100%{transform:translateX(-3px);}50%{transform:translateX(3px);}}

.a-bob{animation:bob 3.6s ease-in-out infinite; transform-origin:center;}
.a-sway{animation:sway 4s ease-in-out infinite; transform-origin:50% 90%;}
.a-ring{animation:pulse-ring 2.8s ease-out infinite; transform-origin:center; transform-box:fill-box;}
.a-ring.d1{animation-delay:.9s;}
.a-ring.d2{animation-delay:1.8s;}
.a-draw{stroke-dasharray:600; stroke-dashoffset:600; animation:dash 2.4s ease-out forwards .2s;}
.a-twinkle{animation:twinkle 2.2s ease-in-out infinite;}
.a-twinkle.d1{animation-delay:.5s;}
.a-twinkle.d2{animation-delay:1s;}
.a-stride{animation:stride 2s ease-in-out infinite;}

@media (prefers-reduced-motion: reduce){
  .a-bob,.a-sway,.a-ring,.a-twinkle,.a-stride{animation:none;}
  .a-draw{animation:none; stroke-dashoffset:0;}
  html{scroll-behavior:auto;}
}

/* ---------- feature cards with artwork ---------- */
.feature-card{padding-top:0; overflow:hidden;}
.card-art{
  margin:-1px -25px 4px; background:var(--teal-tint);
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:16/9; padding:14px;
}
.card-art svg{width:84%; height:84%;}
.feature-card:nth-child(2) .card-art{background:var(--ember-tint);}

/* ---------- logo strip ---------- */
.logo-strip{
  display:grid; grid-template-columns:repeat(5,1fr); gap:14px;
}
@media (max-width:860px){ .logo-strip{grid-template-columns:repeat(2,1fr);} }
@media (max-width:460px){ .logo-strip{grid-template-columns:1fr;} }
.logo-badge{
  background:var(--teal-tint); border:1px solid transparent;
  border-radius:var(--radius-m); padding:22px 16px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; text-align:center; min-height:132px;
  text-decoration:none; color:inherit;
  transition:border-color .15s ease, transform .15s ease;
}
a.logo-badge:hover{border-color:var(--teal); transform:translateY(-2px);}
.logo-badge .full{color:var(--teal-dark); opacity:.78;}
a.logo-badge:focus-visible{outline:2.5px solid var(--teal); outline-offset:2px;}
.logo-badge img{max-height:44px; width:auto; object-fit:contain;}
.logo-badge:has(img) .mark{display:none;}
.logo-badge .mark{
  font-family:var(--font-display); font-weight:700; font-size:1.35rem;
  letter-spacing:-.01em; color:var(--teal-dark); line-height:1.1;
}
.logo-badge .full{font-size:.76rem; color:var(--ink-faint); line-height:1.35;}

/* ---------- pricing ---------- */
.price-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-gap);}
@media (max-width:860px){ .price-grid{grid-template-columns:1fr;} }
.price-card{
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-l); padding:28px;
  display:flex; flex-direction:column; gap:10px;
}
.price-card.featured{border-color:var(--ember); box-shadow:0 0 0 1px var(--ember), var(--shadow);}
.price-value{font-family:var(--font-mono); font-size:2rem; font-weight:600;}
.price-value span{font-size:.95rem; font-weight:500; color:var(--ink-faint);}
.price-card ul{display:flex; flex-direction:column; gap:8px; margin-top:6px;}
.price-card li{font-size:.88rem; color:var(--ink-soft); display:flex; gap:8px;}
.price-card li::before{content:"✓"; color:var(--teal); font-weight:700;}

/* ---------- pay by QR ---------- */
.pay-panel{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-m);
  padding:24px; height:100%;
  display:flex; gap:20px; align-items:center; flex-wrap:wrap;
}
.pay-panel .copy{flex:1 1 210px; min-width:0;}
.pay-panel h3{margin-bottom:8px;}
.pay-panel p{color:var(--ink-soft); font-size:.93rem; margin-bottom:8px;}
.pay-panel p:last-child{margin-bottom:0;}
.qr-slot{flex:0 0 auto; text-align:center;}
.qr-box{
  width:118px; height:118px; margin:0 auto;
  border:2px dashed var(--teal-dark); border-radius:10px; background:var(--bg);
  position:relative; display:flex; align-items:center; justify-content:center;
}
.qr-box::before,.qr-box::after,.qr-box i{
  content:""; position:absolute; width:26px; height:26px;
  border:7px solid var(--ink); border-radius:4px;
}
.qr-box::before{top:12px; left:12px;}
.qr-box::after{top:12px; right:12px;}
.qr-box i{bottom:12px; left:12px;}
.qr-box span{
  position:relative; z-index:1; font-family:var(--font-mono); font-size:.66rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase; color:var(--amber);
  background:var(--amber-tint); padding:3px 7px; border-radius:4px;
}
.qr-slot .lbl{
  display:block; margin-top:10px; font-family:var(--font-mono); font-size:.7rem; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase; color:var(--teal-dark);
}

/* ---------- steps ---------- */
.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
@media (max-width:860px){ .steps{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .steps{grid-template-columns:1fr;} }
.step-num{
  font-family:var(--font-mono); font-weight:600; font-size:.8rem; color:var(--ember);
  width:36px; height:36px; border-radius:50%; border:1.5px solid var(--ember);
  display:flex; align-items:center; justify-content:center; margin-bottom:14px;
}
.step h4{margin-bottom:6px;}
.step p{font-size:.88rem; color:var(--ink-soft);}

/* ---------- faq ---------- */
.faq-item{border-bottom:1px solid var(--line);}
.faq-item summary{
  list-style:none; cursor:pointer; padding:16px 2px; font-weight:600; font-size:.96rem;
  display:flex; justify-content:space-between; align-items:center; gap:14px;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item .chev{width:18px; height:18px; color:var(--ink-faint); flex-shrink:0; transition:transform .2s;}
.faq-item[open] .chev{transform:rotate(180deg);}
.faq-item .a{padding:0 2px 18px; color:var(--ink-soft); font-size:.93rem; max-width:72ch;}

/* ---------- blog ---------- */
.feature{
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-l); padding:36px 38px; margin-bottom:40px;
}
@media (max-width:600px){ .feature{padding:26px 22px;} }
.feature h2{margin-bottom:14px;}
.feature p{margin-bottom:14px; color:var(--ink-soft); max-width:72ch;}
.feature h3{margin:24px 0 8px; color:var(--teal-dark); font-size:1.05rem;}
.group-head{display:flex; align-items:center; gap:18px; margin:var(--sp-block) 0 16px;}
.group-art{
  flex:0 0 auto; width:104px; height:72px; border-radius:var(--radius-m);
  background:var(--teal-tint); display:flex; align-items:center; justify-content:center; padding:9px;
}
.group-art svg{width:100%; height:100%;}
.group-art.ember{background:var(--ember-tint);}
.group-art.amber{background:var(--amber-tint);}
@media (max-width:520px){ .group-art{width:84px; height:58px;} }
.group-head h3{font-size:1.15rem;}
.article{
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-m); padding:22px;
  display:flex; flex-direction:column; gap:10px;
}
.article h4{font-size:1rem;}
.article p{font-size:.9rem; color:var(--ink-soft);}

/* ---------- find us ---------- */
.find-grid{display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-gap); margin-top:var(--sp-block);}
@media (max-width:760px){ .find-grid{grid-template-columns:1fr;} }
.info-row{display:flex; gap:13px; align-items:flex-start; margin-bottom:18px;}
.info-row .icon{color:var(--teal); flex-shrink:0; margin-top:2px;}
.info-row strong{display:block; font-size:.92rem;}
.info-row span{font-size:.9rem; color:var(--ink-soft);}
.hours-row{display:flex; justify-content:space-between; gap:16px; max-width:320px; font-size:.9rem; color:var(--ink-soft); padding:3px 0;}
.hours-row span:last-child{font-variant-numeric:tabular-nums; white-space:nowrap;}

/* ---------- availability calendar (Pay As You Go) ---------- */
.book-cta{display:flex; justify-content:center; margin-top:var(--sp-block);}
.cal-wrap{
  margin-top:var(--sp-block); background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-m); padding:20px 22px 22px;
}
.cal-head{display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px;}
.cal-range{
  font-family:var(--font-mono); font-size:.78rem; letter-spacing:.08em;
  text-transform:uppercase; color:var(--ink-faint);
}
.cal-nav{
  font:inherit; font-size:.86rem; font-weight:600; cursor:pointer;
  background:var(--ink); color:#fff; border:none; border-radius:999px; padding:.5em 1.1em;
}
.cal-nav:hover{background:#0B1210;}
.cal-nav[disabled]{opacity:.35; cursor:not-allowed;}
.cal-nav-next{background:var(--ember);}
.cal-nav-next:hover{background:var(--ember-dark);}
.cal-grid{display:grid; gap:8px; align-items:stretch;}
.cal-day{
  font-family:var(--font-display); font-weight:600; font-size:.92rem;
  color:var(--ink); text-align:center; padding:0 4px 4px; align-self:end;
}
.cal-rowlabel{
  display:flex; flex-direction:column; justify-content:center; gap:2px;
  font-size:.86rem; font-weight:500; color:var(--ink); text-align:right; padding-right:6px;
}
.cal-rowlabel span{font-size:.75rem; color:var(--ink-faint); font-weight:400;}
.cal-cell{
  font:inherit; text-align:center; border:none; border-radius:var(--radius-s);
  padding:14px 8px; display:flex; flex-direction:column; align-items:center; gap:6px;
  font-size:.82rem; line-height:1.3; min-height:76px; justify-content:center;
}
.cal-cell .cal-mark{font-size:1.05rem; line-height:1;}
/* Status colours, pitched to sit with the brand ember (#E1502B): same
   saturation and depth, so the grid reads as part of the site. */
.cal-cell{position:relative;}
.cal-icon{width:20px; height:20px; display:block;}

.cal-cell.is-available{background:#17875A; color:#FFFFFF; font-weight:600; cursor:pointer;}
.cal-cell.is-available:hover{background:#136F4A;}

.cal-cell.is-almost{background:#F5A524; color:#472900; font-weight:600; cursor:pointer;}
.cal-cell.is-almost:hover{background:#E59912;}

.cal-cell.is-none{background:#B3302A; color:#FFFFFF; font-weight:600;}

.cal-cell.is-closed{background:#FFFFFF; color:#B3302A; font-weight:600;
  box-shadow:inset 0 0 0 1.5px #E6D9D2;}
.cal-cell.is-closed .cal-icon{opacity:.8;}

/* key under the grid */
.cal-key{
  display:flex; flex-wrap:wrap; gap:9px 22px; align-items:center;
  margin-top:16px; padding-top:14px; border-top:1px solid var(--line);
  font-size:.84rem; color:var(--ink-soft);
}
.cal-key span{display:inline-flex; align-items:center; gap:8px;}
.cal-key i{width:13px; height:13px; border-radius:4px; display:block; flex:0 0 auto;}
.cal-key .k-available{background:#17875A;}
.cal-key .k-almost{background:#F5A524;}
.cal-key .k-none{background:#B3302A;}
.cal-key .k-closed{background:#FFFFFF; box-shadow:inset 0 0 0 1.5px #E6D9D2;}
.cal-status{margin:14px 0 0; font-size:.88rem; color:var(--teal-dark); min-height:0;}
.cal-status.is-on{padding:10px 14px; background:var(--teal-tint); border-radius:var(--radius-s);}
@media (max-width:720px){
  .cal-wrap{padding:16px 14px 18px;}
  .cal-head{flex-wrap:wrap; justify-content:space-between;}
  .cal-range{order:3; width:100%; text-align:center; margin-top:4px;}
  .cal-nav{padding:.45em .95em; font-size:.8rem;}
  .cal-grid{gap:6px;}
  .cal-day{font-size:.72rem;}
  .cal-rowlabel{font-size:.74rem; text-align:left; padding-right:0;}
  .cal-rowlabel span{font-size:.66rem;}
  .cal-cell{font-size:.68rem; padding:10px 4px; min-height:64px;}
}

/* ---------- footer ---------- */
footer{
  background:var(--ink); color:rgba(239,237,228,.72);
  padding-block:var(--sp-section) 40px; margin-top:auto;
}
footer a{text-decoration:none;}
footer a:hover{color:var(--bg);}

/* brand lock-up: logo left, social right, on one rule-separated row */
.footer-brand{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; flex-wrap:wrap;
  padding-bottom:var(--sp-block);
  border-bottom:1px solid rgba(239,237,228,.14);
  margin-bottom:var(--sp-block);
}
.footer-logo{display:flex; align-items:center; gap:.45em; color:#F3F0E8;}
.footer-logo em{font-style:normal; color:var(--ember);}
.footer-logo svg{width:54px; height:54px;}
.footer-logo span{
  font-family:var(--font-display); font-weight:700;
  font-size:1.95rem; letter-spacing:-.02em;
}
.social{display:flex; gap:10px; list-style:none; margin:0; padding:0;}
.social li{margin:0;}
.social a{
  width:40px; height:40px; border-radius:50%;
  border:1px solid rgba(239,237,228,.28); color:rgba(239,237,228,.82);
  display:flex; align-items:center; justify-content:center;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.social a:hover{background:var(--ember); border-color:var(--ember); color:#fff;}
.social svg{width:18px; height:18px; fill:currentColor; stroke:none;}

/* four columns, headings on one baseline; the link columns are narrow and set
   well apart, and Blog gets the width its paragraph needs to flow naturally */
.footer-grid{
  display:grid;
  grid-template-columns:.85fr .95fr 1.1fr 1.7fr;
  column-gap:clamp(30px, 4vw, 56px);
  row-gap:var(--sp-block);
  align-items:start;
}
.footer-col{display:flex; flex-direction:column; min-width:0;}
.footer-col h5{
  font-family:var(--font-mono); font-size:.78rem; font-weight:600; letter-spacing:.12em;
  text-transform:uppercase; color:#EDA188; margin:0 0 18px; line-height:1.4;
}
.footer-col h5 a{color:inherit;}
.footer-col h5 a:hover{color:#F5C0AD;}
.footer-col ul{display:flex; flex-direction:column; gap:11px; margin:0; padding:0; list-style:none;}
.footer-col li{margin:0; font-size:.97rem; line-height:1.45;}
.footer-find{display:flex; flex-direction:column; gap:18px; font-size:.97rem;}
.find-block{display:flex; flex-direction:column; gap:5px; line-height:1.45;}
.find-block b{font-weight:700; color:#F3F0E8;}
.footer-note-text{
  margin:0; font-size:.88rem; line-height:1.6; color:rgba(239,237,228,.6);
}
.footer-note-text + .footer-note-text{margin-top:1em;}

.footer-bottom{
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  margin-top:var(--sp-block); padding-top:26px;
  font-size:.83rem; color:rgba(239,237,228,.45);
  border-top:1px solid rgba(239,237,228,.14);
}

@media (max-width:1080px){
  .footer-grid{grid-template-columns:1fr 1fr; column-gap:clamp(30px, 5vw, 56px);}
}
@media (max-width:560px){
  .footer-grid{grid-template-columns:1fr; row-gap:var(--sp-block);}
  .footer-brand{flex-direction:column; align-items:flex-start; gap:22px;}
  .social{gap:9px;}
}
.visually-hidden{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);}

/* ---------- dark header band (matches the printed brochure) ---------- */
header{
  background:rgba(22,34,31,.94);
  border-bottom:1px solid rgba(243,240,232,.10);
}
.logo{color:#F3F0E8;}
nav.primary a{color:rgba(243,240,232,.76);}
nav.primary a:hover{color:#FFFFFF; border-color:var(--ember);}
nav.primary a[aria-current="page"]{color:#FFFFFF; border-color:var(--ember);}
.nav-toggle-label{border-color:rgba(243,240,232,.30); color:#F3F0E8;}
@media (max-width:900px){
  nav.primary{background:#16221F; border-bottom-color:rgba(243,240,232,.12);}
  nav.primary a{border-bottom-color:rgba(243,240,232,.12);}
}

