/* ==========================================================================
   Sunshine Coast Oral, Facial & Implant Specialists
   Google Ads landing pages — shared stylesheet
   Built by Generate Your Audience
   --------------------------------------------------------------------------
   TYPOGRAPHY NOTE FOR THE TEAM
   The fonts are set in the two variables below (--display and --sans).
   If the main site uses a different pairing, change those two lines and the
   Google Fonts <link> in each page head. Nothing else needs touching.
   ========================================================================== */

:root{
  /* brand */
  --ink:#0B1733;
  --navy:#16255C;
  --navy-soft:#25397A;
  --cyan:#16B8DC;
  --cyan-deep:#0D8CAD;
  --gold:#D9A94B;
  --gold-bg:#FFF8E9;
  --gold-line:#EAD9AE;
  --mist:#EEF4F8;
  --mist-2:#F7FAFC;
  --paper:#FFFFFF;
  --muted:#5D6E8A;
  --muted-2:#46587A;
  --line:rgba(22,37,92,.12);
  --line-strong:rgba(22,37,92,.22);

  /* type */
  --display:"Crimson Pro",Georgia,"Times New Roman",serif;
  --sans:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

  /* shape */
  --shadow-lg:0 32px 80px -28px rgba(11,23,51,.38);
  --shadow-md:0 18px 44px -20px rgba(11,23,51,.32);
  --shadow-sm:0 10px 30px -14px rgba(11,23,51,.26);
  --pad:clamp(18px,5vw,64px);
  --r-lg:22px;
  --r-md:16px;
  --r-sm:11px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.62;font-weight:400;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit}
button{font-family:inherit}

.wrap{width:min(1200px,100%);margin-inline:auto;padding-inline:var(--pad)}
.wrap-narrow{width:min(900px,100%);margin-inline:auto;padding-inline:var(--pad)}

h1,h2,h3,h4{font-family:var(--display);font-weight:600;letter-spacing:-.015em;margin:0;line-height:1.1}
h1{font-size:clamp(34px,5vw,60px);line-height:1.04}
h2{font-size:clamp(28px,3.6vw,46px);line-height:1.1}
h3{font-size:clamp(20px,1.9vw,25px);line-height:1.24}
p{margin:0 0 1em}
.lede{font-size:clamp(16.5px,1.3vw,19.5px);color:var(--muted-2);line-height:1.62}
.lede.on-dark{color:rgba(255,255,255,.78)}
.eyebrow{
  font-size:12px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  color:var(--cyan-deep);margin:0 0 16px;
}
.eyebrow.on-dark{color:#6FD9F2}
.center{text-align:center}

/* ---------------- brand arc motif ---------------- */
.arcmark{display:block;width:96px;height:32px;overflow:visible;margin-bottom:16px}
.arcmark path{fill:none;stroke:var(--cyan);stroke-width:2;stroke-linecap:round}
.arcmark circle{fill:var(--navy)}
.arcmark.on-dark circle{fill:#fff}
.center .arcmark{margin-inline:auto}

/* ---------------- buttons ---------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-size:16px;font-weight:600;text-decoration:none;border:0;cursor:pointer;
  padding:15px 26px;border-radius:12px;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
  line-height:1.2;text-align:center;
}
.btn svg{width:18px;height:18px;flex:none}
.btn-call{
  background:linear-gradient(135deg,var(--cyan) 0%,#38C9E8 100%);color:var(--ink);
  box-shadow:0 14px 28px -14px rgba(22,184,220,.85);
}
.btn-call:hover{transform:translateY(-2px);filter:brightness(1.05)}
.btn-enquire{
  background:linear-gradient(135deg,var(--navy) 0%,#2C4494 100%);color:#fff;
  box-shadow:0 14px 28px -14px rgba(22,37,92,.75);
}
.btn-enquire:hover{transform:translateY(-2px);filter:brightness(1.08)}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.45)}
.btn-ghost:hover{background:rgba(255,255,255,.1)}
.btn-lg{padding:18px 32px;font-size:17px}
.btn:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}

/* ---------------- header ---------------- */
.site-header{
  position:sticky;top:0;z-index:60;background:rgba(255,255,255,.93);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.header-in{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding-block:12px;
}
.header-logo img{width:clamp(150px,16vw,186px);height:auto}
.header-right{display:flex;align-items:center;gap:14px}
.header-meta{text-align:right;line-height:1.3}
.header-meta .hdr-loc{
  display:block;font-size:11px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--cyan-deep);
}
.header-meta .tel{
  display:block;font-family:var(--display);font-size:22px;font-weight:700;
  color:var(--navy);text-decoration:none;
}
.header-meta .tel:hover{color:var(--cyan-deep)}
@media(max-width:820px){.header-meta{display:none}}
@media(max-width:520px){
  .header-in{padding-block:10px}
  .header-right .btn{padding:11px 16px;font-size:14.5px}
}

/* ---------------- hero with video ---------------- */
.hero{position:relative;overflow:hidden;background:var(--ink);isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:0;background:var(--ink) center/cover no-repeat}
.hero-media iframe{
  position:absolute;top:50%;left:50%;
  width:100vw;height:56.25vw;min-height:100%;min-width:177.77vh;
  transform:translate(-50%,-50%);border:0;pointer-events:none;
}
.hero-scrim{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(100deg,rgba(11,23,51,.93) 0%,rgba(11,23,51,.82) 42%,rgba(11,23,51,.55) 72%,rgba(11,23,51,.42) 100%),
    linear-gradient(180deg,rgba(11,23,51,.5) 0%,rgba(11,23,51,0) 28%,rgba(11,23,51,.6) 100%);
}
.hero-in{position:relative;z-index:2;padding-block:clamp(54px,8vw,104px);color:#fff}
.hero-copy{max-width:760px}
.hero h1{color:#fff}
.hero h1 .accent{color:#6FD9F2}
.hero .lede{margin-top:20px;max-width:34em}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero-cta .btn{min-width:210px}
@media(max-width:480px){.hero-cta .btn{width:100%;min-width:0}}

.hero-points{
  list-style:none;margin:30px 0 0;padding:0;display:grid;gap:11px;max-width:36em;
}
.hero-points li{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:rgba(255,255,255,.86)}
.hero-points b{color:#fff;font-weight:600}
.tick{
  flex:none;width:22px;height:22px;border-radius:7px;margin-top:1px;
  background:rgba(22,184,220,.2);display:grid;place-items:center;
}
.tick svg{width:12px;height:12px;stroke:#6FD9F2;stroke-width:2.6;fill:none}

.hero-proof{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:32px;
  padding-top:24px;border-top:1px solid rgba(255,255,255,.2);
}
.stars{display:flex;gap:3px}
.stars svg{width:18px;height:18px;fill:#F2A93B}
.proof-score{display:flex;align-items:center;gap:11px;font-size:15px;color:rgba(255,255,255,.9)}
.proof-score b{font-family:var(--display);font-size:24px;font-weight:700;color:#fff;line-height:1}
.proof-item{font-size:14.5px;color:rgba(255,255,255,.72)}

/* offer pills */
.pills{display:flex;flex-wrap:wrap;gap:9px;margin-top:26px}
.pill{
  display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.22);border-radius:100px;padding:9px 17px 9px 13px;
  font-size:14px;font-weight:600;color:#fff;backdrop-filter:blur(6px);
}
.pill .dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);flex:none}
.pill.gold{background:rgba(217,169,75,.16);border-color:rgba(217,169,75,.5)}
.pill.gold .dot{background:var(--gold)}

/* ---------------- credential bar ---------------- */
.credbar{background:var(--ink);color:#fff;border-top:1px solid rgba(255,255,255,.08)}
.credbar-in{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.12);
}
.cred{background:var(--ink);padding:22px clamp(14px,2vw,26px);text-align:center}
.cred b{
  display:block;font-family:var(--display);font-size:clamp(19px,2vw,25px);
  font-weight:700;color:#fff;line-height:1.15;
}
.cred span{display:block;font-size:12.5px;color:rgba(255,255,255,.62);margin-top:6px;line-height:1.45}
@media(max-width:760px){.credbar-in{grid-template-columns:repeat(2,1fr)}}

/* ---------------- sections ---------------- */
.section{padding-block:clamp(52px,7vw,104px)}
.section-mist{background:var(--mist-2)}
.section-dark{background:linear-gradient(165deg,var(--ink) 0%,var(--navy) 60%,#1C2E6B 100%);color:#fff}
.section-dark h2,.section-dark h3{color:#fff}
.section-head{max-width:64ch;margin-bottom:clamp(30px,4vw,52px)}
.section-head.center{margin-inline:auto;text-align:center}

/* split rows */
.split{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(28px,4.5vw,66px);align-items:center}
.split.flip .split-media{order:2}
@media(max-width:900px){
  .split{grid-template-columns:1fr;gap:28px}
  .split.flip .split-media{order:0}
}
.split-media img{border-radius:var(--r-lg);box-shadow:var(--shadow-sm);width:100%;height:auto}
/* "plain" is for the clinical renders and diagrams. Always contain, never crop,
   so the whole illustration is visible, and cap the height so a tall render
   does not tower over the copy beside it. */
.split-media.plain img{
  box-shadow:none;background:#fff;border:1px solid var(--line);
  max-height:460px;object-fit:contain;padding:clamp(14px,2vw,26px);
}
.section-mist .split-media.plain img{background:#fff}
.cap{font-size:12.5px;color:var(--muted);text-align:center;margin:12px 0 0;line-height:1.5}

.points{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:15px}
.points li{display:flex;gap:13px;align-items:flex-start;font-size:16.2px;color:var(--muted-2)}
.points b{color:var(--ink);font-weight:600}
.points .tick{background:rgba(22,184,220,.14)}
.points .tick svg{stroke:var(--cyan-deep)}
.section-dark .points li{color:rgba(255,255,255,.78)}
.section-dark .points b{color:#fff}
.section-dark .tick{background:rgba(22,184,220,.2)}
.section-dark .tick svg{stroke:#6FD9F2}

/* ---------------- card grids ---------------- */
.grid{display:grid;gap:clamp(14px,2vw,24px)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-2{grid-template-columns:repeat(2,1fr)}
@media(max-width:980px){.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:860px){.grid-3{grid-template-columns:1fr}}
@media(max-width:700px){.grid-2{grid-template-columns:1fr}.grid-4{grid-template-columns:1fr}}

.card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(22px,2.4vw,30px);
  display:flex;flex-direction:column;
}
.card h3{margin-bottom:10px}
.card p{font-size:15.6px;color:var(--muted);margin:0}
.card .ico{
  width:54px;height:54px;border-radius:15px;background:rgba(22,184,220,.13);
  display:grid;place-items:center;margin-bottom:18px;flex:none;
}
.card .ico svg{width:26px;height:26px;stroke:var(--cyan-deep);fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.card.dark{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.16)}
.card.dark p{color:rgba(255,255,255,.74)}
.card.dark .ico{background:rgba(22,184,220,.18)}
.card.dark .ico svg{stroke:#6FD9F2}

.tagrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.tag{
  font-size:12.8px;font-weight:600;color:var(--navy);background:var(--mist);
  border:1px solid var(--line);border-radius:8px;padding:6px 12px;
}

/* ---------------- steps ---------------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
@media(max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}
.step{background:var(--paper);padding:clamp(22px,2.4vw,32px)}
.step-top{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.step .sico{
  width:52px;height:52px;border-radius:15px;flex:none;
  background:linear-gradient(160deg,rgba(22,184,220,.18),rgba(22,184,220,.08));
  display:grid;place-items:center;
}
.step .sico svg{width:25px;height:25px;stroke:var(--cyan-deep);fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.step .num{
  font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan-deep);
}
.step h3{font-size:20px;margin-bottom:9px}
.step p{font-size:15px;color:var(--muted);margin:0;line-height:1.6}

/* ---------------- surgeons ---------------- */
.surgeon{
  display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(24px,3.6vw,52px);align-items:center;
  padding-block:clamp(28px,3.6vw,48px);border-top:1px solid var(--line);
}
.surgeon:first-of-type{border-top:0;padding-top:0}
/* grid items must never be sized by their content, or a slow or failed image
   can push the whole row wider than the viewport */
.surgeon > *,.split > *,.card,.money-card,.step{min-width:0}
@media(max-width:820px){.surgeon{grid-template-columns:1fr;gap:22px}}
.surgeon-portrait img{
  border-radius:var(--r-lg);width:100%;height:auto;object-fit:cover;object-position:center 18%;
  aspect-ratio:5/6;box-shadow:var(--shadow-sm);background:var(--mist);
}
.surgeon .role{
  font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--cyan-deep);
  font-weight:700;margin:9px 0 16px;
}
.surgeon p{color:var(--muted-2);font-size:16px}
.creds{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:8px}
.creds li{font-size:14.6px;color:var(--navy);display:flex;gap:11px;align-items:flex-start;font-weight:500}
.creds li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--cyan);margin-top:8px}

/* ---------------- money / gold panel ---------------- */
.money-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2.4vw,26px)}
@media(max-width:760px){.money-grid{grid-template-columns:1fr}}
.money-card{
  border:1px solid rgba(255,255,255,.18);border-radius:var(--r-lg);padding:clamp(24px,3vw,34px);
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));
}
.money-card .ico{width:46px;height:46px;border-radius:13px;background:rgba(217,169,75,.2);
  display:grid;place-items:center;margin-bottom:18px}
.money-card .ico svg{width:22px;height:22px;stroke:#F0CE86;fill:none;stroke-width:1.8}
.money-card h3{font-size:23px;margin-bottom:11px}
.money-card p{font-size:15.4px;color:rgba(255,255,255,.76);margin:0}
.fineprint{font-size:13px;color:rgba(255,255,255,.52);margin-top:22px;line-height:1.6;max-width:72ch}

/* ---------------- locations ---------------- */
.loc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,20px)}
@media(max-width:860px){.loc-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.loc-grid{grid-template-columns:1fr}}
.loc{border:1px solid var(--line);border-radius:var(--r-md);padding:20px 22px;background:var(--paper)}
.loc .kind{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  color:var(--cyan-deep);display:block;margin-bottom:9px}
.loc h3{font-size:18px;line-height:1.3;margin-bottom:6px}
.loc p{font-size:14.2px;color:var(--muted);margin:0}
.loc.primary{background:linear-gradient(160deg,#fff,var(--mist));border-color:var(--line-strong)}

.practice-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:clamp(24px,3vw,38px)}
@media(max-width:700px){.practice-gallery{grid-template-columns:repeat(2,1fr)}}
.practice-gallery img{border-radius:var(--r-sm);aspect-ratio:4/3;object-fit:cover;width:100%;height:auto}

/* ---------------- FAQ ---------------- */
.faq{max-width:880px;margin-inline:auto}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  list-style:none;cursor:pointer;padding:22px 46px 22px 0;position:relative;
  font-family:var(--display);font-size:clamp(18px,1.6vw,21px);font-weight:600;line-height:1.35;color:var(--ink);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:8px;top:50%;width:10px;height:10px;
  border-right:2px solid var(--cyan-deep);border-bottom:2px solid var(--cyan-deep);
  transform:translateY(-65%) rotate(45deg);transition:transform .22s ease;
}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq summary:focus-visible{outline:2px solid var(--cyan);outline-offset:4px;border-radius:6px}
.faq .answer{padding:0 54px 24px 0;color:var(--muted-2);font-size:16px}
.faq .answer p:last-child{margin-bottom:0}

/* ---------------- enquiry form ---------------- */
.form-split{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(30px,4.5vw,64px);align-items:start}
@media(max-width:940px){.form-split{grid-template-columns:1fr;gap:30px}}
.formcard{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);overflow:hidden;
}
.formcard-head{
  padding:22px clamp(20px,2.2vw,30px) 19px;
  background:linear-gradient(150deg,var(--navy) 0%,var(--ink) 100%);color:#fff;position:relative;overflow:hidden;
}
.formcard-head::after{
  content:"";position:absolute;right:-60px;top:-90px;width:230px;height:230px;border-radius:50%;
  background:radial-gradient(circle,rgba(22,184,220,.34),transparent 66%);
}
.formcard-head h3{color:#fff;font-size:23px;position:relative;line-height:1.2}
.formcard-head p{margin:8px 0 0;font-size:14px;color:rgba(255,255,255,.74);position:relative;line-height:1.5}
.formcard-body{padding:clamp(20px,2.2vw,28px)}
.field{margin-bottom:15px}
/* Direct children only, so the radio option labels inside .choice-group
   are not caught by this and turned into uppercase micro-type. */
.field > label,.field > .lbl{
  display:block;font-size:12px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--navy);margin-bottom:7px;
}
.field .req{color:#C9553F}
.field input,.field textarea,.field select{
  width:100%;font-family:var(--sans);font-size:16px;color:var(--ink);
  padding:12px 14px;border:1px solid var(--line-strong);border-radius:var(--r-sm);
  background:#FCFDFE;transition:border-color .18s ease,box-shadow .18s ease;
}
.field textarea{min-height:92px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{
  outline:none;border-color:var(--cyan);box-shadow:0 0 0 4px rgba(22,184,220,.16);background:#fff;
}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}
@media(max-width:480px){.field-row{grid-template-columns:1fr}}

.choice-group{display:grid;gap:8px}
.choice-group.cols{grid-template-columns:1fr 1fr}
.choice-group.cols .choice:last-child:nth-child(odd){grid-column:1/-1}
@media(max-width:420px){.choice-group.cols{grid-template-columns:1fr}}
.choice{position:relative;display:block}
.choice input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.choice span{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:10px 13px;border:1px solid var(--line-strong);border-radius:var(--r-sm);
  background:#FCFDFE;font-size:14.2px;font-weight:500;color:var(--ink);line-height:1.35;
  text-transform:none;letter-spacing:normal;
  cursor:pointer;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease;user-select:none;
}
.choice span::before{
  content:"";flex:none;width:17px;height:17px;border-radius:50%;
  border:2px solid var(--line-strong);background:#fff;transition:border-color .16s ease,border-width .16s ease;
}
.choice span:hover{border-color:var(--cyan);background:#fff}
.choice input:focus-visible + span{box-shadow:0 0 0 4px rgba(22,184,220,.16);border-color:var(--cyan)}
.choice input:checked + span{
  border-color:var(--cyan);background:linear-gradient(180deg,#F2FBFE,#E7F7FC);
  color:var(--navy);font-weight:600;box-shadow:0 2px 10px -6px rgba(22,184,220,.55);
}
.choice input:checked + span::before{border-color:var(--cyan);border-width:5px}
.choice-group.invalid .choice span{border-color:#C9553F}

.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

.submit{
  width:100%;border:0;cursor:pointer;font-family:var(--sans);
  font-size:16.5px;font-weight:600;color:#fff;padding:16px 22px;border-radius:12px;
  background:linear-gradient(135deg,var(--navy) 0%,#2C4494 100%);
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
  box-shadow:0 14px 28px -14px rgba(22,37,92,.75);
}
.submit:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.07)}
.submit:disabled{opacity:.62;cursor:wait;transform:none}
.submit:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
.form-foot{margin-top:12px;font-size:12.4px;color:var(--muted);line-height:1.55;text-align:center}
.form-error{
  display:none;margin-top:12px;padding:11px 14px;border-radius:var(--r-sm);
  background:#FDF3F1;border:1px solid #F0C9C0;color:#9A3B29;font-size:14px;line-height:1.5;
}
.form-error.show{display:block}
.form-success{display:none;padding:38px 14px;text-align:center}
.form-success .ok{
  width:52px;height:52px;border-radius:50%;background:rgba(22,184,220,.14);
  display:grid;place-items:center;margin:0 auto 18px;
}
.form-success .ok svg{width:25px;height:25px;stroke:var(--cyan-deep);stroke-width:2.6;fill:none}
.form-success h4{font-family:var(--display);font-size:24px;font-weight:600;margin:0 0 10px}
.form-success p{font-size:15.4px;color:var(--muted);margin:0}
.is-sent .form-fields{display:none}
.is-sent .form-success{display:block}

.form-aside .lede{margin-bottom:0}
.close-list{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:13px}
.close-list li{display:flex;gap:13px;font-size:16px;color:rgba(255,255,255,.8)}
.alt-cta{
  margin-top:28px;padding-top:24px;border-top:1px solid rgba(255,255,255,.2);
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;
}
.alt-cta .label{font-size:14.5px;color:rgba(255,255,255,.7)}

/* ---------------- footer ---------------- */
.foot{background:var(--ink);color:rgba(255,255,255,.6);padding-block:42px;font-size:13.6px}

/* footer map */
.foot-map-row{
  display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(22px,3.4vw,46px);
  align-items:center;padding-bottom:34px;margin-bottom:30px;
  border-bottom:1px solid rgba(255,255,255,.14);
}
@media(max-width:860px){.foot-map-row{grid-template-columns:1fr;gap:24px}}
.foot-map-row h3{font-size:clamp(21px,2.1vw,27px);color:#fff;margin-bottom:14px}
.foot-addr{font-size:15px;line-height:1.7;color:rgba(255,255,255,.76)}
.foot-addr strong{display:block;color:#fff;font-weight:600;margin-bottom:4px}
.foot-addr .row{display:flex;gap:11px;align-items:flex-start;margin-bottom:13px}
.foot-addr .row svg{width:17px;height:17px;flex:none;margin-top:4px;stroke:#6FD9F2;fill:none;stroke-width:1.8}
.foot-addr a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(111,217,242,.5)}
.foot-map{
  border-radius:var(--r-lg);overflow:hidden;border:1px solid rgba(255,255,255,.18);
  line-height:0;background:rgba(255,255,255,.05);
}
.foot-map iframe{width:100%;height:clamp(300px,32vw,420px);border:0;display:block;filter:grayscale(.15)}

.foot-in{display:flex;flex-wrap:wrap;gap:22px;justify-content:space-between;align-items:flex-start}
.foot a{color:rgba(255,255,255,.8)}
.foot strong{color:#fff;font-weight:600}
.foot-links{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:22px;font-size:13px}
.foot .ahpra{margin-top:20px;font-size:12.8px;color:rgba(255,255,255,.58);line-height:1.6}
.foot .disc{margin-top:16px;line-height:1.6;font-size:12.2px;color:rgba(255,255,255,.4);max-width:88ch}

/* ---------------- sticky mobile CTA ---------------- */
.sticky-bar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;
  background:rgba(255,255,255,.96);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  gap:10px;box-shadow:0 -10px 30px -18px rgba(11,23,51,.4);
}
.sticky-bar .btn{flex:1;padding:14px 10px;font-size:15.5px;min-width:0}
@media(max-width:820px){
  .sticky-bar{display:flex}
  body{padding-bottom:78px}
}

/* ---------------- reveal ---------------- */
.reveal{opacity:0;transform:translateY(20px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}
.reveal.in{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
  .btn,.submit{transition:none}
}

/* ---------------- small-screen polish ---------------- */
@media(max-width:640px){
  body{font-size:16px}
  .section{padding-block:46px}
  .hero-in{padding-block:46px 50px}

  /* Put the call and enquiry buttons directly under the opening paragraph on
     phones, so the primary action is reachable without scrolling past the
     supporting detail. DOM order stays logical for screen readers. */
  .hero-copy{display:flex;flex-direction:column}
  .hero-copy .eyebrow{order:1}
  .hero-copy h1{order:2}
  .hero-copy .lede{order:3}
  .hero-copy .pills{order:4;margin-top:22px}
  .hero-copy .hero-cta{order:5;margin-top:20px}
  .hero-copy .hero-points{order:6;margin-top:28px}
  .hero-copy .hero-proof{order:7}
  .hero-proof{gap:12px 18px;margin-top:26px;padding-top:20px}
  .faq summary{padding:19px 40px 19px 0}
  .faq .answer{padding-right:26px;font-size:15.4px}
  .foot-in{flex-direction:column}
  .cred{padding:18px 12px}
  .surgeon-portrait img{aspect-ratio:4/3}
}