/* TruFusion Clinics — service pages.
   One stylesheet for every dedicated service page. Bright ivory surfaces with
   the homepage's dark header, serif headings and champagne gold as the bridge.
   Mobile first. No images are required for the layout to hold. */

:root{
  --sp-white:#FFFFFF;
  --sp-ivory:#FFFDF8;
  --sp-champagne:#FBF6EA;
  --sp-sand:#F1ECE1;
  --sp-ink:#1F1D1A;
  --sp-text:#3A3530;
  --sp-muted:#5F584E;
  --sp-gold-text:#7A5C16;          /* gold that passes contrast on light surfaces */
  --sp-gold:#CDA349;
  --sp-rule:rgba(31,29,26,0.12);
  --sp-night:#0E0D0C;
  --sp-cream:#EDE7DC;
  --sp-gold-face:linear-gradient(135deg,#F8E7B5 0%,#E8C97A 34%,#CDA349 66%,#F4DE9A 100%);
  --sp-gold-face-hover:linear-gradient(135deg,#FBF0CC 0%,#F0D78E 34%,#D8B159 66%,#F9EAB4 100%);
  --sp-serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sp-sans:'Instrument Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --sp-gutter:clamp(20px,4vw,56px);
  --sp-header:88px;
}

*,*::before,*::after{box-sizing:border-box}
html{height:auto;min-height:100%;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;min-height:100%;background:var(--sp-ivory);color:var(--sp-text);font-family:var(--sp-sans);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
::selection{background:rgba(201,162,39,0.28)}
:focus-visible{outline:2px solid #7A5C16;outline-offset:3px;border-radius:4px}

/* The shared header is transparent over the dark homepage hero. On a light page it needs its own ground. */
tf-header header{background-color:rgba(14,13,12,0.94) !important;backdrop-filter:blur(18px) !important;-webkit-backdrop-filter:blur(18px) !important;border-bottom-color:rgba(237,231,220,0.1) !important}

/* The shared header and footer expect the page to set their link colours, as the homepage does. */
tf-header a,tf-footer a{color:#EDE7DC;text-decoration:none}
tf-header a:hover,tf-footer a:hover{color:#C9A227}

.sp-skip{position:absolute;left:-9999px;top:0;z-index:1200;background:#C9A227;color:#0E0D0C;padding:12px 18px;font-size:14px;font-weight:600}
.sp-skip:focus{left:12px;top:12px}

.sp-main{display:block;padding-top:var(--sp-header)}
.sp-main a{color:var(--sp-gold-text);text-decoration:underline;text-decoration-color:rgba(122,92,22,0.4);text-underline-offset:3px}
.sp-main a:hover{color:var(--sp-ink);text-decoration-color:var(--sp-ink)}
.sp-wrap{max-width:1160px;margin:0 auto;padding-left:var(--sp-gutter);padding-right:var(--sp-gutter)}
.sp-narrow{max-width:72ch}

/* ---------- type ---------- */
.sp-kicker{display:flex;align-items:center;gap:13px;margin:0;font-size:11px;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:var(--sp-gold-text)}
.sp-kicker::before{content:"";flex:none;width:26px;height:1px;background:linear-gradient(90deg,#CDA349 0%,#7A5C16 100%)}
.sp-main h1,.sp-main h2{font-family:var(--sp-serif);font-weight:400;color:var(--sp-ink);letter-spacing:-0.02em;margin:0;text-wrap:balance}
.sp-main h1{font-size:clamp(42px,7.2vw,84px);line-height:1.02}
.sp-main h2{font-size:clamp(31px,4vw,48px);line-height:1.08}
.sp-main h3{font-family:var(--sp-sans);font-weight:600;font-size:18px;line-height:1.4;color:var(--sp-ink);margin:0}
.sp-main p{margin:0 0 16px}
.sp-main p:last-child{margin-bottom:0}
.sp-lede{font-size:clamp(18px,1.5vw,21px);line-height:1.65;color:var(--sp-text)}
.sp-small{font-size:14.5px;line-height:1.65;color:var(--sp-muted)}
/* the hook: the reader's own situation, in the serif voice, before the service is explained */
.sp-hook{font-family:var(--sp-serif);font-style:italic;font-weight:300;font-size:clamp(21px,2.1vw,28px);line-height:1.4;color:var(--sp-ink);margin:22px 0 0;max-width:30ch}
/* part labels: the page reads Problem, then Solution, then What to expect */
.sp-part{display:inline-flex;align-items:center;gap:10px;margin:0 0 22px;padding:7px 14px 7px 10px;border:1px solid rgba(138,106,31,0.32);border-radius:999px;background:var(--sp-white);font-size:11px;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:var(--sp-gold-text)}
.sp-part b{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#F2D98C 0%,#CDA349 60%,#9B7A24 100%);color:#1F1D1A;font-weight:600;font-size:11.5px;letter-spacing:0}
.sp-tone-white .sp-part{background:var(--sp-champagne)}
/* options a provider may discuss: term and its distinction */
.sp-options{list-style:none;margin:0;padding:0;display:grid;gap:0}
.sp-options li{padding:18px 0;border-top:1px solid var(--sp-rule);display:grid;grid-template-columns:1fr;gap:6px 28px}
.sp-options li:last-child{border-bottom:1px solid var(--sp-rule)}
.sp-options h3{font-size:17px}
.sp-options p{margin:0;color:var(--sp-text)}
@media (min-width:720px){.sp-options li{grid-template-columns:minmax(0,0.42fr) minmax(0,0.58fr)}}

/* ---------- breadcrumb ---------- */
.sp-crumbs{padding:18px 0 0;font-size:13px;color:var(--sp-muted)}
.sp-crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.sp-crumbs li+li::before{content:"/";margin-right:8px;color:rgba(31,29,26,0.35)}
.sp-crumbs a{display:inline-block;padding:6px 0;color:var(--sp-muted)}
.sp-crumbs [aria-current]{color:var(--sp-ink)}

/* ---------- buttons ---------- */
.sp-actions{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:center;margin-top:28px}
.sp-main a.sp-btn,.sp-sticky a.sp-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:15px 28px;border-radius:16px;font-family:var(--sp-sans);font-size:16px;font-weight:600;line-height:1.2;letter-spacing:0.005em;text-align:center;text-decoration:none;color:#2A2118;background:var(--sp-gold-face);box-shadow:0 12px 32px -14px rgba(176,140,54,0.6),inset 0 1px 0 rgba(255,255,255,0.55);transition:transform 220ms cubic-bezier(.22,1,.36,1),box-shadow 220ms cubic-bezier(.22,1,.36,1)}
.sp-main a.sp-btn:hover,.sp-sticky a.sp-btn:hover{color:#2A2118;background:var(--sp-gold-face-hover);transform:translateY(-2px);box-shadow:0 20px 46px -16px rgba(176,140,54,0.72),inset 0 1px 0 rgba(255,255,255,0.72)}
.sp-main a.sp-btn-line{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:15px 24px;border-radius:16px;border:1px solid rgba(31,29,26,0.28);font-size:16px;font-weight:600;line-height:1.2;color:var(--sp-ink);text-decoration:none;background:transparent;transition:border-color 220ms,background-color 220ms}
.sp-main a.sp-btn-line:hover{border-color:var(--sp-ink);background:rgba(31,29,26,0.04)}
@media (max-width:520px){.sp-actions > a{flex:1 1 100%}}
.sp-on-dark a.sp-btn-line{color:var(--sp-cream);border-color:rgba(237,231,220,0.4)}
.sp-on-dark a.sp-btn-line:hover{color:var(--sp-cream);border-color:var(--sp-cream);background:rgba(237,231,220,0.08)}

/* ---------- hero ---------- */
.sp-hero{background:linear-gradient(180deg,var(--sp-white) 0%,var(--sp-ivory) 100%);padding:clamp(20px,3vh,36px) 0 clamp(48px,8vh,96px)}
.sp-hero-grid{display:grid;grid-template-columns:1fr;gap:clamp(28px,5vw,64px);align-items:center;margin-top:clamp(20px,4vh,44px)}
.sp-hero h1{margin-top:18px}
.sp-hero .sp-lede{margin-top:22px;max-width:56ch}
.sp-facts{list-style:none;margin:30px 0 0;padding:20px 0 0;border-top:1px solid var(--sp-rule);display:flex;flex-wrap:wrap;gap:8px 26px;font-size:14px;color:var(--sp-muted)}
.sp-facts li{display:flex;align-items:center;gap:9px}
.sp-facts li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--sp-gold)}
@media (min-width:900px){.sp-hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,0.9fr)}}

/* ---------- image placeholder plates (non-human, clearly labelled, each with a replacement ID) ---------- */
.sp-plate{position:relative;margin:0;overflow:hidden;border-radius:22px;border:1px solid rgba(138,106,31,0.28);background:
  radial-gradient(120% 90% at 18% 12%,rgba(255,255,255,0.9) 0%,rgba(255,255,255,0) 58%),
  linear-gradient(158deg,#FBF6EA 0%,#F1E3C2 44%,#E2CC9B 78%,#D3B981 100%);
  display:flex;flex-direction:column;justify-content:flex-end;padding:22px 24px;min-height:220px}
.sp-plate::before{content:"";position:absolute;inset:14px;border:1px dashed rgba(122,92,22,0.42);border-radius:14px;pointer-events:none}
.sp-plate-tag{position:relative;display:inline-block;align-self:flex-start;padding:6px 11px;border-radius:999px;background:rgba(31,29,26,0.88);color:#FFFDF8;font-size:11px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase}
.sp-plate-note{position:relative;margin:10px 0 0 !important;max-width:34ch;font-size:13.5px;line-height:1.5;color:#3A3020}
.sp-plate[data-ratio="4:5"]{aspect-ratio:4 / 5}
.sp-plate[data-ratio="4:3"]{aspect-ratio:4 / 3}
.sp-plate[data-ratio="3:2"]{aspect-ratio:3 / 2}
@media (max-width:899px){.sp-plate[data-ratio="4:5"]{aspect-ratio:3 / 2}}

/* ---------- sections ---------- */
.sp-section{padding:clamp(56px,9vh,112px) 0;scroll-margin-top:var(--sp-header)}
/* sections below the fold are laid out only as they approach the viewport (anchors, find-in-page and the accessibility tree still work) */
.sp-section{content-visibility:auto;contain-intrinsic-size:auto 720px}
.sp-section + .sp-section{border-top:1px solid var(--sp-rule)}
.sp-tone-white{background:var(--sp-white)}
.sp-tone-champagne{background:var(--sp-champagne)}
.sp-head{max-width:64ch}
.sp-head h2{margin-top:16px}
.sp-head .sp-lede{margin-top:18px}
.sp-body{margin-top:clamp(26px,4vh,44px)}
.sp-split{display:grid;grid-template-columns:1fr;gap:clamp(28px,5vw,72px);align-items:start}
@media (min-width:900px){.sp-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.sp-split-wide{grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr)}}

.sp-list{list-style:none;margin:0;padding:0;display:grid;gap:0}
.sp-list li{position:relative;padding:15px 0 15px 30px;border-top:1px solid var(--sp-rule)}
.sp-list li:last-child{border-bottom:1px solid var(--sp-rule)}
.sp-list li::before{content:"";position:absolute;left:4px;top:26px;width:9px;height:9px;border-radius:50%;border:1.5px solid #7A5C16}

.sp-cards{display:grid;grid-template-columns:1fr;gap:16px}
@media (min-width:700px){.sp-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1040px){.sp-cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sp-card{padding:26px 26px 28px;border-radius:18px;background:var(--sp-white);border:1px solid var(--sp-rule)}
.sp-tone-white .sp-card{background:var(--sp-ivory)}
.sp-card h3{margin-bottom:8px}
.sp-card p{font-size:16px;line-height:1.65}
.sp-card p a{display:inline-block;padding:4px 0}

.sp-callout{margin-top:26px;padding:20px 24px;border-left:2px solid var(--sp-gold);border-radius:0 14px 14px 0;background:var(--sp-white)}
.sp-tone-white .sp-callout{background:var(--sp-champagne)}

/* numbered steps */
.sp-steps{list-style:none;margin:0;padding:0;counter-reset:sp-step;display:grid;gap:0}
.sp-steps li{counter-increment:sp-step;position:relative;padding:22px 0 22px 64px;border-top:1px solid var(--sp-rule)}
.sp-steps li:last-child{border-bottom:1px solid var(--sp-rule)}
.sp-steps li::before{content:counter(sp-step,decimal-leading-zero);position:absolute;left:0;top:20px;font-family:var(--sp-serif);font-size:30px;line-height:1;color:var(--sp-gold-text)}
.sp-steps h3{margin-bottom:6px}

/* FAQ: always visible, no accordion, so people and crawlers read the same text */
.sp-faq{display:grid;gap:0;max-width:78ch}
.sp-faq-item{padding:24px 0;border-top:1px solid var(--sp-rule)}
.sp-faq-item:last-child{border-bottom:1px solid var(--sp-rule)}
.sp-faq-item h3{font-family:var(--sp-serif);font-weight:500;font-size:clamp(22px,2.2vw,27px);line-height:1.25;letter-spacing:-0.01em;margin-bottom:10px}

/* ---------- booking band ---------- */
.sp-book{background:var(--sp-night);color:var(--sp-cream);padding:clamp(60px,10vh,120px) 0;scroll-margin-top:var(--sp-header)}
.sp-book .sp-kicker{color:#E8C97A}
.sp-book .sp-kicker::before{background:linear-gradient(90deg,#F8E7B5 0%,#CDA349 100%)}
.sp-book h2{color:var(--sp-cream);margin-top:16px}
.sp-book p{color:rgba(237,231,220,0.86);max-width:58ch;margin-top:18px}
.sp-book .sp-small{color:rgba(237,231,220,0.72)}

/* ---------- contact ---------- */
.sp-addr{font-style:normal;font-size:18px;line-height:1.75;color:var(--sp-ink)}
.sp-addr strong{font-weight:600}
.sp-addr a{display:inline-block;padding:4px 0}
.sp-disclaimer{padding:28px 0 clamp(96px,12vh,120px);background:var(--sp-sand);font-size:14px;line-height:1.65;color:var(--sp-muted)}
.sp-disclaimer p{max-width:86ch;margin:0}

/* ---------- phone-only sticky action bar ---------- */
.sp-sticky{position:fixed;left:0;right:0;bottom:0;z-index:119;display:none;gap:10px;align-items:center;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(14,13,12,0.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:1px solid rgba(237,231,220,0.12);transform:translateY(110%);transition:transform 420ms cubic-bezier(.22,1,.36,1)}
.sp-sticky[data-show]{transform:translateY(0)}
.sp-sticky a.sp-btn{flex:1 1 auto;min-height:48px;padding:13px 16px;border-radius:14px;font-size:15px}
.sp-sticky a.sp-call{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:14px;border:1px solid rgba(237,231,220,0.34);color:var(--sp-cream)}
@media (max-width:767px){.sp-sticky{display:flex}}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:1ms !important}
}
@media print{tf-header,tf-footer,.sp-sticky,.sp-plate,#tf-preview-notice{display:none !important}.sp-main{padding-top:0}.sp-book{background:#fff;color:#000}}
