/* Fairholme Lowe Solicitors: concept site by WillowTree Web Dev */
:root{
  --paper:#f7f4ee; --card:#fffdf9; --ink:#1c2230; --ink-2:#4b5262; --ink-3:#7a7f8a;
  --line:#e3ddd2; --ox:#7b2d26; --ox-d:#5c1f1a; --ox-t:rgba(123,45,38,.08);
  --sage:#e2e9df; --sage-d:#47654f; --brass:#b98e4e;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:14px; --wrap:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font:400 1.02rem/1.65 var(--sans);overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--ox);color:#fff}
:focus-visible{outline:2.5px solid var(--ox);outline-offset:3px;border-radius:4px}
.wrap{width:min(var(--wrap),100% - 2.5rem);margin-inline:auto}
@media (max-width:600px){.wrap{width:calc(100% - 2rem)}}

h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:-.015em;line-height:1.1}
h1{font-size:clamp(2.6rem,6vw,4.6rem)}
h2{font-size:clamp(2rem,4vw,3rem)}
h3{font-size:1.45rem}
h1 em,h2 em{font-style:italic;color:var(--ox)}
.eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ox)}
.eyebrow::before{content:"";width:22px;height:1.5px;background:currentColor}
.lead{font-size:clamp(1.08rem,1.6vw,1.22rem);color:var(--ink-2);max-width:56ch}
.muted{color:var(--ink-3)}
.small{font-size:.88rem}

/* concept bar */
.concept{background:var(--ink);color:#c5c9d3;font-size:.8rem;text-align:center;padding:.5rem 1rem;line-height:1.45}
.concept a{color:#fff;font-weight:600}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 1.4rem;border-radius:999px;border:1.5px solid var(--ink);
  background:var(--ink);color:#fff;font-weight:600;font-size:.95rem;text-decoration:none;cursor:pointer;line-height:1.2;
  transition:background .2s,border-color .2s,color .2s,transform .15s}
.btn:hover{background:var(--ox);border-color:var(--ox)}
.btn:active{transform:scale(.97)}
.btn.ox{background:var(--ox);border-color:var(--ox)}
.btn.ox:hover{background:var(--ox-d);border-color:var(--ox-d)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:#fff}
.btn svg{width:18px;height:18px;flex:0 0 auto}
.link{color:var(--ox);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}

/* header */
.head{position:sticky;top:0;z-index:50;background:rgba(247,244,238,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid transparent;transition:border-color .3s}
.head.scrolled{border-color:var(--line)}
.head .wrap{display:flex;align-items:center;gap:1.6rem;min-height:76px}
.logo{display:flex;align-items:center;gap:.75rem;text-decoration:none;margin-right:auto}
.logo svg{width:40px;height:40px;flex:0 0 auto}
.logo b{display:block;font-family:var(--serif);font-weight:500;font-size:1.32rem;letter-spacing:-.01em;line-height:1.05}
.logo small{display:block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.nav{display:flex;gap:1.5rem}
.nav a{text-decoration:none;font-size:.94rem;font-weight:500;color:var(--ink-2);padding:.3rem 0;border-bottom:1.5px solid transparent}
.nav a:hover{color:var(--ink)}
.nav a[aria-current="page"]{color:var(--ink);border-color:var(--ox)}
.head .call{font-weight:700;font-size:.92rem;text-decoration:none;white-space:nowrap}
.head .call small{display:block;font-weight:500;font-size:.72rem;color:var(--ink-3)}
.menu-btn{display:none;background:none;border:0;cursor:pointer;padding:.4rem;color:var(--ink)}
.mob-only{display:none}
@media (max-width:1020px){
  .head .call{display:none}
}
@media (max-width:900px){
  .menu-btn{display:block}
  .head .btn{display:none}
  .nav{position:fixed;inset:calc(76px + var(--cb,34px)) 0 0;flex-direction:column;gap:0;background:var(--paper);padding:1rem 1.25rem;
    clip-path:inset(0 0 0 100%);visibility:hidden;transition:clip-path .4s cubic-bezier(.2,.8,.2,1),visibility 0s .4s;overflow:auto}
  .nav.open{clip-path:inset(0);visibility:visible;transition:clip-path .4s cubic-bezier(.2,.8,.2,1)}
  .nav a{font-family:var(--serif);font-size:1.6rem;padding:.8rem 0;border-bottom:1px solid var(--line)}
  .nav a[aria-current="page"]{border-color:var(--line);color:var(--ox)}
  .mob-only{display:block}
}

/* sections */
.sec{padding:clamp(4rem,9vw,7rem) 0}
.sec.tight{padding-top:0}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:2rem;flex-wrap:wrap;margin-bottom:2.6rem}
.sec-head .lead{margin-top:.8rem}
.band{background:var(--card);border-block:1px solid var(--line)}
.dark{background:var(--ink);color:#e7e9ee}
.dark .lead,.dark .muted{color:#aab0bd}
.dark .eyebrow{color:#e0b9a9}
.dark h2 em{color:#e0b9a9}

/* reveal */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.1s}.rv.d2{transition-delay:.2s}.rv.d3{transition-delay:.3s}

/* hero */
.hero{padding:clamp(2.5rem,6vw,4.5rem) 0 clamp(3rem,7vw,5rem)}
.hero .wrap{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero h1{margin:1rem 0 1.4rem}
.hero .cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}
.hero-facts{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;margin-top:2.2rem;font-size:.9rem;color:var(--ink-2)}
.hero-facts span{display:flex;align-items:center;gap:.45rem}
.hero-facts svg{width:18px;height:18px;color:var(--sage-d);flex:0 0 auto}
.hero-photo{position:relative}
.hero-photo img{border-radius:220px 220px var(--r) var(--r);aspect-ratio:4/5;object-fit:cover;width:100%}
.float-card{position:absolute;left:-2.2rem;bottom:2.2rem;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;
  box-shadow:0 20px 50px rgba(28,34,48,.16);width:min(270px,80%);text-decoration:none;transition:transform .3s}
.float-card:hover{transform:translateY(-4px)}
.float-card .fc-top{display:flex;justify-content:space-between;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.float-card b{display:block;font-family:var(--serif);font-weight:500;font-size:1.15rem;margin:.35rem 0 .7rem}
.fc-bar{height:6px;border-radius:9px;background:var(--sage);overflow:hidden}
.fc-bar i{display:block;height:100%;width:0;background:var(--sage-d);border-radius:9px;transition:width 1.6s cubic-bezier(.2,.8,.2,1) .6s}
.in .fc-bar i,.fc-bar.go i{width:var(--w)}
.fc-next{font-size:.82rem;color:var(--ink-2);margin-top:.6rem}
@media (max-width:900px){
  .hero .wrap{grid-template-columns:1fr}
  .hero-photo{max-width:460px}
  .float-card{left:auto;right:-.5rem}
}

/* triage */
.triage{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(1.5rem,4vw,3rem);align-items:start}
.tri-opts{display:grid;gap:.6rem}
.tri-opt{display:flex;align-items:center;gap:1rem;width:100%;text-align:left;background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);
  padding:1rem 1.2rem;cursor:pointer;font-size:1.05rem;font-weight:600;transition:border-color .2s,background .2s,transform .15s}
.tri-opt:hover{border-color:var(--ink-3)}
.tri-opt:active{transform:scale(.99)}
.tri-opt[aria-pressed="true"]{border-color:var(--ox);background:#fff;box-shadow:0 0 0 3px var(--ox-t)}
.tri-opt .ic{width:42px;height:42px;border-radius:12px;background:var(--sage);display:grid;place-items:center;flex:0 0 auto;transition:background .2s}
.tri-opt[aria-pressed="true"] .ic{background:var(--ox);color:#fff}
.tri-opt .ic svg{width:22px;height:22px}
.tri-opt .arr{margin-left:auto;color:var(--ink-3);transition:transform .2s}
.tri-opt[aria-pressed="true"] .arr{transform:translateX(4px);color:var(--ox)}
.tri-panel{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;position:sticky;top:100px;box-shadow:0 24px 60px rgba(28,34,48,.08)}
.tri-panel img{aspect-ratio:16/8;object-fit:cover;width:100%}
.tri-body{padding:1.6rem clamp(1.2rem,3vw,2rem) 1.9rem}
.tri-body h3{font-size:1.7rem;margin-bottom:.6rem}
.tri-steps{list-style:none;counter-reset:s;margin:1.2rem 0;display:grid;gap:.55rem}
.tri-steps li{counter-increment:s;display:flex;gap:.8rem;align-items:baseline;color:var(--ink-2)}
.tri-steps li::before{content:counter(s);flex:0 0 auto;width:24px;height:24px;border-radius:50%;background:var(--sage);color:var(--sage-d);font-size:.78rem;font-weight:700;display:grid;place-items:center;transform:translateY(-1px)}
.tri-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin:1.4rem 0}
.tri-meta div{background:var(--paper);border-radius:12px;padding:.7rem .8rem}
.tri-meta small{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3);font-weight:700}
.tri-meta b{font-family:var(--serif);font-weight:500;font-size:1.15rem}
.tri-body .btns{display:flex;flex-wrap:wrap;gap:.6rem}
.swap{animation:swap .45s cubic-bezier(.2,.8,.2,1)}
@keyframes swap{from{opacity:0;transform:translateY(10px)}}
@media (max-width:900px){.triage{grid-template-columns:1fr}.tri-panel{position:static}}
@media (max-width:480px){.tri-meta{grid-template-columns:1fr 1fr}.tri-meta div:last-child{grid-column:1/-1}}

/* fee table */
.fees-top{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.toggle{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:4px}
.toggle button{border:0;background:none;padding:.45rem .95rem;border-radius:999px;font-size:.85rem;font-weight:600;cursor:pointer;color:var(--ink-2)}
.toggle button[aria-pressed="true"]{background:var(--ink);color:#fff}
.fees{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.fees th,.fees td{text-align:left;padding:1rem 1.2rem;border-bottom:1px solid var(--line);vertical-align:top}
.fees th{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);background:var(--paper)}
.fees tr:last-child td{border-bottom:0}
.fees td:last-child,.fees th:last-child{text-align:right;white-space:nowrap}
.fees td b{font-weight:600}
.fees .price{font-family:var(--serif);font-size:1.3rem;font-variant-numeric:tabular-nums}
.fees .vat{display:block;font-size:.75rem;color:var(--ink-3)}
.fees td small{display:block;color:var(--ink-3);font-size:.85rem;margin-top:.15rem}
@media (max-width:600px){.fees th:nth-child(2),.fees td:nth-child(2){display:none}.fees th,.fees td{padding:.85rem .9rem}}

/* promises */
.promises{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
.promise{border-top:1.5px solid rgba(231,233,238,.25);padding-top:1.3rem}
.promise .n{font-family:var(--serif);font-size:2.6rem;color:#e0b9a9;line-height:1;margin-bottom:.8rem;font-style:italic}
.promise h3{font-size:1.3rem;margin-bottom:.45rem;color:#fff}
.promise p{color:#aab0bd;font-size:.95rem}
@media (max-width:900px){.promises{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.promises{grid-template-columns:1fr}}

/* jargon buster */
.jargon{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.jargon-txt{font-family:var(--serif);font-size:clamp(1.3rem,2.2vw,1.65rem);line-height:1.55;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:clamp(1.4rem,3vw,2.2rem)}
.term{background:none;border:0;padding:0;font:inherit;cursor:help;color:var(--ox);text-decoration:underline dotted 2px;text-underline-offset:5px;position:relative}
.term[aria-expanded="true"]{text-decoration-style:solid}
.tip{position:absolute;z-index:30;max-width:300px;background:var(--ink);color:#fff;font:400 .9rem/1.5 var(--sans);padding:.85rem 1rem;border-radius:12px;
  box-shadow:0 18px 40px rgba(28,34,48,.3);pointer-events:none;opacity:0;transform:translateY(6px);transition:opacity .2s,transform .2s}
.tip.on{opacity:1;transform:none}
.tip b{display:block;font-family:var(--serif);font-weight:500;font-size:1.05rem;color:#e0b9a9;margin-bottom:.15rem}
@media (max-width:900px){.jargon{grid-template-columns:1fr}}

/* people */
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.4rem}
.people[data-short]{grid-template-columns:repeat(3,1fr)}
@media (max-width:820px){.people[data-short]{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}
.person{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s}
.person:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(28,34,48,.1)}
.person img{aspect-ratio:4/4.3;object-fit:cover;object-position:top;width:100%}
.person .pb{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.4rem;flex:1}
.person h3{font-size:1.4rem}
.person .role{font-size:.85rem;font-weight:600;color:var(--ox)}
.person p{font-size:.93rem;color:var(--ink-2)}
.tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.3rem}
.tag{font-size:.74rem;font-weight:600;padding:.22rem .6rem;border-radius:999px;background:var(--sage);color:var(--sage-d)}
.person .contact{margin-top:auto;padding-top:.8rem;border-top:1px solid var(--line);font-size:.86rem;display:flex;flex-direction:column;gap:.1rem}
.person .contact a{text-decoration:none;font-weight:600}
.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}
.chip{border:1.5px solid var(--line);background:var(--card);border-radius:999px;padding:.5rem 1rem;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .2s}
.chip:hover{border-color:var(--ink-3)}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.person.hide{display:none}

/* quotes */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.quote{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:1.6rem}
.quote .stars{color:var(--brass);letter-spacing:.15em;font-size:.95rem}
.quote blockquote{font-family:var(--serif);font-size:1.2rem;line-height:1.45;margin:.8rem 0 1.1rem}
.quote cite{font-style:normal;font-size:.86rem;color:var(--ink-3)}
.quote cite b{color:var(--ink);font-weight:600}
@media (max-width:900px){.quotes{grid-template-columns:1fr}}

/* visit */
.visit{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.visit img{border-radius:22px;aspect-ratio:16/10;object-fit:cover;width:100%}
.visit dl{display:grid;gap:1rem;margin:1.6rem 0 2rem}
.visit dt{font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.visit dd{font-size:1.02rem}
@media (max-width:900px){.visit{grid-template-columns:1fr}}

/* page head */
.page-head{padding:clamp(2.5rem,6vw,4.5rem) 0 2.4rem;max-width:760px}
.page-head h1{margin:.9rem 0 1.1rem;font-size:clamp(2.4rem,5vw,3.8rem)}

/* services */
.svc-nav{display:flex;gap:.5rem;flex-wrap:wrap;position:sticky;top:76px;z-index:20;background:var(--paper);padding:.8rem 0;border-bottom:1px solid var(--line)}
.svc{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,5vw,4rem);padding:clamp(3rem,7vw,5rem) 0;border-bottom:1px solid var(--line);scroll-margin-top:140px}
.svc:last-of-type{border-bottom:0}
.svc-side img{border-radius:18px;aspect-ratio:4/3;object-fit:cover;width:100%;margin-bottom:1.4rem}
.svc-side .who{display:flex;gap:.8rem;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:.8rem}
.svc-side .who img{width:52px;height:52px;border-radius:50%;margin:0;aspect-ratio:1;object-position:top}
.svc-side .who b{display:block;font-size:.95rem}
.svc-side .who small{color:var(--ink-3);font-size:.82rem}
.svc h2{font-size:clamp(1.9rem,3.4vw,2.6rem);margin:.6rem 0 1rem}
.svc h4{font-size:.76rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin:1.8rem 0 .8rem}
.incl{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.incl ul{list-style:none;display:grid;gap:.45rem;font-size:.94rem;color:var(--ink-2)}
.incl li{display:flex;gap:.55rem;align-items:flex-start}
.incl li svg{width:18px;height:18px;flex:0 0 auto;margin-top:.2rem}
.incl .yes svg{color:var(--sage-d)}
.incl .no svg{color:var(--ox)}
.timeline-mini{display:flex;gap:0;margin:.4rem 0 0;counter-reset:t}
.timeline-mini li{list-style:none;flex:1;position:relative;padding-top:1.6rem;font-size:.82rem;color:var(--ink-2);text-align:center}
.timeline-mini li::before{content:"";position:absolute;top:.45rem;left:0;right:0;height:2px;background:var(--line)}
.timeline-mini li::after{content:"";position:absolute;top:.15rem;left:50%;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--paper);border:2px solid var(--sage-d)}
.timeline-mini li:first-child::before{left:50%}.timeline-mini li:last-child::before{right:50%}
@media (max-width:900px){.svc{grid-template-columns:1fr}.svc-side{max-width:520px}}
@media (max-width:560px){.incl{grid-template-columns:1fr}.timeline-mini{flex-direction:column;gap:.5rem}.timeline-mini li{text-align:left;padding:0 0 0 1.6rem}
  .timeline-mini li::before{display:none}.timeline-mini li::after{top:.3rem;left:0;margin:0}}
.notice{background:var(--sage);border-radius:14px;padding:1rem 1.2rem;font-size:.9rem;color:#2f4636;margin-top:1.4rem}

/* forms / calculators */
.panel{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:clamp(1.3rem,3vw,2.2rem)}
.calc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:clamp(1.5rem,4vw,3rem);align-items:start}
.field{display:grid;gap:.4rem;margin-bottom:1.3rem}
.field>label,.field>span,.legend{font-size:.82rem;font-weight:700;letter-spacing:.06em;color:var(--ink-2)}
.input{width:100%;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:.8rem 1rem;font-size:1rem;transition:border-color .2s,box-shadow .2s}
.input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(28,34,48,.08)}
.money{position:relative}
.money .input{padding-left:2rem;font-size:1.3rem;font-family:var(--serif)}
.money::before{content:"£";position:absolute;left:1rem;top:50%;transform:translateY(-50%);font-family:var(--serif);font-size:1.3rem;color:var(--ink-3)}
input[type=range]{width:100%;accent-color:var(--ox)}
.seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:.45rem}
.seg label{position:relative;cursor:pointer}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg span{display:block;text-align:center;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:.65rem .5rem;font-weight:600;font-size:.9rem;transition:all .2s}
.seg input:checked+span{border-color:var(--ink);background:var(--ink);color:#fff}
.seg input:focus-visible+span{outline:2.5px solid var(--ox);outline-offset:2px}
.checks{display:grid;gap:.55rem}
.check{display:flex;gap:.7rem;align-items:flex-start;cursor:pointer;font-size:.95rem}
.check input{width:20px;height:20px;accent-color:var(--ox);margin-top:.15rem;flex:0 0 auto}
.check small{display:block;color:var(--ink-3);font-size:.82rem}
.result{position:sticky;top:96px;background:var(--ink);color:#e7e9ee;border-radius:22px;padding:clamp(1.3rem,3vw,2rem);box-shadow:0 24px 60px rgba(28,34,48,.2)}
.result .eyebrow{color:#e0b9a9}
.total{font-family:var(--serif);font-size:clamp(2.6rem,5vw,3.4rem);line-height:1.05;margin:.4rem 0 .2rem;font-variant-numeric:tabular-nums}
.result .sub{color:#aab0bd;font-size:.88rem}
.lines{list-style:none;margin:1.3rem 0;border-top:1px solid rgba(255,255,255,.12)}
.lines li{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:.92rem}
.lines li span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.lines li.h{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#aab0bd;font-weight:700;padding-top:1rem;border-bottom:0}
.lines li.t{font-weight:700;color:#fff}
.lines small{color:#8d93a1;display:block;font-size:.78rem}
.result .btn{width:100%;margin-top:.5rem}
.result .btn.ghost{color:#fff;border-color:rgba(255,255,255,.35)}
.result .btn.ghost:hover{background:#fff;color:var(--ink)}
.sdlt-note{font-size:.8rem;color:#8d93a1;margin-top:1rem}
@media (max-width:900px){.calc{grid-template-columns:1fr}.result{position:static}}

.ok-msg{display:none;background:var(--sage);color:#2f4636;border-radius:14px;padding:1rem 1.2rem;margin-top:1rem;font-weight:500}
.ok-msg.on{display:block;animation:swap .4s}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
@media (max-width:560px){.form-grid{grid-template-columns:1fr}}

/* booking slots */
.days{display:flex;gap:.45rem;overflow-x:auto;padding-bottom:.4rem;scrollbar-width:thin}
.day{flex:0 0 auto;width:74px;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:.55rem .3rem;text-align:center;cursor:pointer;transition:all .2s}
.day small{display:block;font-size:.72rem;color:var(--ink-3);font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.day b{font-family:var(--serif);font-size:1.4rem;font-weight:500}
.day[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.day[aria-pressed="true"] small{color:#c5c9d3}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:.45rem;margin-top:.8rem}
.slot{border:1.5px solid var(--line);background:#fff;border-radius:10px;padding:.55rem;font-weight:600;font-size:.92rem;cursor:pointer;transition:all .2s}
.slot:disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
.slot[aria-pressed="true"]{background:var(--ox);border-color:var(--ox);color:#fff}

/* case tracker */
.track-login{max-width:520px}
.case{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(1.5rem,4vw,2.6rem);align-items:start}
.case-top{display:flex;gap:1.4rem;align-items:center;flex-wrap:wrap;margin-bottom:1.8rem}
.ring{width:110px;height:110px;position:relative;flex:0 0 auto}
.ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:9}
.ring .bg{stroke:var(--sage)}
.ring .fg{stroke:var(--sage-d);stroke-linecap:round;stroke-dasharray:283;stroke-dashoffset:283;transition:stroke-dashoffset 1.6s cubic-bezier(.2,.8,.2,1)}
.ring b{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--serif);font-size:1.7rem;font-weight:500}
.steps{list-style:none;position:relative}
.steps li{position:relative;padding:0 0 1.5rem 2.6rem}
.steps li::before{content:"";position:absolute;left:11px;top:26px;bottom:0;width:2px;background:var(--line)}
.steps li:last-child::before{display:none}
.steps li.done::before{background:var(--sage-d)}
.steps .dot{position:absolute;left:0;top:2px;width:24px;height:24px;border-radius:50%;border:2px solid var(--line);background:var(--card);display:grid;place-items:center}
.steps .dot svg{width:14px;height:14px;color:#fff}
.steps li.done .dot{background:var(--sage-d);border-color:var(--sage-d)}
.steps li.now .dot{border-color:var(--ox);box-shadow:0 0 0 5px var(--ox-t)}
.steps li.now .dot::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--ox);animation:pl 1.6s infinite}
@keyframes pl{50%{transform:scale(.6);opacity:.5}}
.steps b{display:block;font-weight:600}
.steps li:not(.done):not(.now) b{color:var(--ink-3)}
.steps .when{font-size:.82rem;color:var(--ink-3)}
.steps .note{margin-top:.5rem;background:#fff;border:1px solid var(--line);border-left:3px solid var(--ox);border-radius:10px;padding:.7rem .9rem;font-size:.9rem;color:var(--ink-2)}
.side-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:1.3rem;margin-bottom:1.2rem}
.side-card h3{font-size:1.2rem;margin-bottom:.8rem}
.handler{display:flex;gap:.8rem;align-items:center}
.handler img{width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:top}
.todo{list-style:none;display:grid;gap:.5rem}
.todo label{display:flex;gap:.6rem;align-items:flex-start;cursor:pointer;font-size:.93rem}
.todo input{accent-color:var(--sage-d);width:18px;height:18px;margin-top:.15rem;flex:0 0 auto}
.todo input:checked+span{text-decoration:line-through;color:var(--ink-3)}
.msgs{display:grid;gap:.6rem;max-height:340px;overflow:auto;margin-bottom:.8rem}
.msg{background:var(--paper);border-radius:12px 12px 12px 4px;padding:.6rem .8rem;font-size:.9rem}
.msg.me{background:var(--ink);color:#fff;border-radius:12px 12px 4px 12px;margin-left:1.5rem}
.msg small{display:block;font-size:.72rem;opacity:.65;margin-top:.2rem}
.msg-form{display:flex;gap:.4rem}
.msg-form .input{padding:.6rem .8rem;font-size:.92rem}
.docs{list-style:none;display:grid;gap:.4rem;font-size:.9rem}
.docs li{display:flex;justify-content:space-between;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--line)}
.docs li:last-child{border:0}
.docs span:last-child{color:var(--ink-3);font-size:.8rem;white-space:nowrap}
@media (max-width:900px){.case{grid-template-columns:1fr}}

/* footer */
.foot{background:var(--ink);color:#aab0bd;padding:4rem 0 2rem;font-size:.92rem}
.foot .wrap{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:2.4rem}
.foot .logo b{color:#fff}
.foot .logo small{color:#8d93a1}
.foot h4{color:#fff;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.9rem}
.foot ul{list-style:none;display:grid;gap:.45rem}
.foot a{text-decoration:none}
.foot a:hover{color:#fff}
.reg{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.1);padding-top:1.6rem;display:grid;grid-template-columns:auto 1fr;gap:1.4rem;align-items:center;font-size:.82rem;line-height:1.6}
.badge-ph{width:170px;border:1.5px dashed rgba(255,255,255,.3);border-radius:10px;padding:.7rem;text-align:center;font-size:.72rem;color:#c5c9d3}
.legal{grid-column:1/-1;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem;font-size:.8rem;color:#8d93a1}
@media (max-width:900px){.foot .wrap{grid-template-columns:1fr 1fr}.reg{grid-template-columns:1fr}}
@media (max-width:520px){.foot .wrap{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
}