/* ==========================================================================
   sections.css  ·  per-section styles (build incrementally)
   Order: header → hero → (more sections appended as approved)
   ========================================================================== */

/* ============================== HEADER (02) ============================== */
/* logo left · centered nav glass box · book button right (3-zone grid) */
/* NOT sticky — sits at the top and scrolls away with the page */
.hdr{position:absolute;inset:0 0 auto 0;z-index:100;padding:1.4rem var(--pad-x);
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.5rem;}
.hdr-logo{justify-self:start;}
.hdr-logo img{height:50px;width:auto;}

/* centered nav — its own rounded glass box */
.hdr-nav{justify-self:center;display:flex;align-items:center;gap:1.9rem;
  background:rgba(252,250,246,.72);backdrop-filter:blur(14px) saturate(1.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);
  border:1px solid rgba(255,255,255,.7);border-radius:var(--r-pill);
  padding:.7rem 1.9rem;box-shadow:0 10px 34px rgba(33,28,78,.12);}
.hdr-link{font-family:var(--serif);font-weight:500;font-size:1.02rem;letter-spacing:.01em;
  text-transform:none;color:var(--ink-soft);transition:color var(--dur) var(--ease);}
.hdr-link:hover{color:var(--indigo);}
.hdr-link[aria-current="page"]{color:var(--indigo);}

/* separate book button, right */
.hdr-book{justify-self:end;padding:.85em 1.7em;}
/* drawer-only book link (mobile) — hidden on desktop */
.hdr-nav-book{display:none;}

/* burger (mobile) */
.hdr-burger{display:none;justify-self:end;width:46px;height:46px;flex-direction:column;
  align-items:center;justify-content:center;gap:5px;background:rgba(252,250,246,.8);
  border-radius:50%;border:1px solid rgba(255,255,255,.7);box-shadow:0 6px 20px rgba(33,28,78,.12);}
.hdr-burger span{width:22px;height:2px;background:var(--ink);border-radius:2px;
  transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease);}
.hdr-burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hdr-burger.is-open span:nth-child(2){opacity:0;}
.hdr-burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav-scrim{position:fixed;inset:0;background:rgba(26,23,38,.45);backdrop-filter:blur(4px);
  opacity:0;visibility:hidden;transition:opacity var(--dur) var(--ease),visibility var(--dur) var(--ease);z-index:90;}
.nav-scrim.is-visible{opacity:1;visibility:visible;}

/* =============================== HERO (03) =============================== */
/* layered shape + portrait cutout rising above; body overlaps into next section */
.hero{position:relative;display:flex;align-items:center;
  padding:9rem 0 0;                        /* vertical only — .container sets horizontal */
  background:linear-gradient(135deg,var(--ivory) 0%,var(--ivory) 55%,var(--ivory-deep) 100%);
  overflow:hidden;z-index:1;}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;
  gap:clamp(2rem,5vw,5rem);width:100%;}

/* soft gradient orbs */
.hero::before{content:"";position:absolute;top:-10%;right:-6%;width:60vw;height:60vw;
  max-width:680px;max-height:680px;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(57,49,130,.08),transparent 65%);}
.hero::after{content:"";position:absolute;bottom:-14%;left:-10%;width:50vw;height:50vw;
  max-width:560px;max-height:560px;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(194,155,99,.12),transparent 66%);}

.hero-copy{position:relative;z-index:2;}
.hero-name{font-family:var(--serif);font-weight:200;font-size:var(--t-mega);line-height:.92;
  letter-spacing:-.03em;color:var(--ink);margin-bottom:1.6rem;}
.hero-name .ln-2{display:block;color:var(--indigo);font-weight:500;}
.hero-desc{font-size:clamp(.84rem,1.12vw,1rem);line-height:1.65;font-weight:300;color:var(--ink-soft);
  max-width:34em;margin-bottom:2.2rem;}
.hero-desc strong{color:var(--ink);font-weight:600;}
.hero-actions{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;padding-bottom:3rem;}

/* visual: soft shape behind + portrait cutout rising above it (no frame, no crop) */
/* bigger portrait; margin-bottom lets her body extend down into the next section */
.hero-visual{position:relative;z-index:2;width:100%;max-width:600px;margin-left:auto;
  aspect-ratio:1/1.12;align-self:end;}
/* the soft colored arch sits LOWER and shorter than the photo, so the head rises above it */
.hero-shape{position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:80%;height:80%;z-index:1;border-radius:50% 50% 28% 28%/58% 58% 10% 10%;
  background:linear-gradient(165deg,var(--indigo-100) 0%,#E3DDF2 45%,var(--gold-50) 100%);}
/* portrait cutout — fills the visual area so she is large; true ratio, bottom-aligned */
.hero-figure{position:absolute;inset:0;z-index:3;display:flex;align-items:flex-end;justify-content:center;}
.hero-figure img{width:100%;height:100%;object-fit:contain;object-position:bottom center;
  filter:drop-shadow(0 24px 40px rgba(35,32,79,.16));}
/* decorative dashed ring + dots */
.hero-ring{position:absolute;bottom:2%;left:-4%;width:150px;height:150px;z-index:1;
  animation:spin 60s linear infinite;pointer-events:none;}
.hero-dots{position:absolute;top:4%;right:-2%;z-index:1;opacity:.85;pointer-events:none;}
@keyframes spin{to{transform:rotate(360deg);}}

/* floating cards — two-line label (script word + bold word) */
.hero-card{position:absolute;z-index:5;display:flex;align-items:center;gap:.8rem;
  background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.8);border-radius:var(--r-md);padding:.8rem 1.1rem;
  box-shadow:var(--shadow);}
.hero-card-ico{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;
  justify-content:center;flex:none;font-size:1.25rem;}
.hero-card-ico--indigo{background:var(--indigo-100);color:var(--indigo);}
.hero-card-ico--red{background:var(--red-50);color:var(--red);}
.hero-card-ico--gold{background:var(--gold-50);color:var(--gold-deep);}
.hero-card-ico--green{background:#E6F0E8;color:#4B7B57;}
.hero-card-top{display:block;font-family:var(--serif);font-weight:200;font-size:.92rem;
  font-style:italic;color:var(--muted);line-height:1;}
.hero-card-main{display:block;font-family:var(--serif);font-weight:500;font-size:1.12rem;
  color:var(--ink);line-height:1.1;}
/* positions: 4 cards around the portrait */
.hero-card--tl{top:18%;left:-7%;}
.hero-card--tr{top:9%;right:-6%;}
.hero-card--bl{bottom:24%;left:-9%;}
.hero-card--br{bottom:13%;right:-7%;}


/* ============================== INTRO (02) =============================== */
/* editorial portrait left + manifesto right + "not a hospital" card */
.intro{background:var(--paper);}
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,6rem);align-items:center;}

/* figure: 3:4 rounded frame holds the solid photo at its true ratio (no crop) */
.intro-figure{position:relative;}
.intro-frame{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:3/4;
  box-shadow:var(--shadow-lg);background:var(--indigo-100);}
.intro-frame img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;}
/* "not a hospital" note — fully visible, inset over the frame's bottom-left corner */
.intro-note{position:absolute;left:1.25rem;bottom:1.25rem;background:var(--white);
  border-radius:var(--r-md);padding:1.2rem 1.4rem;max-width:248px;box-shadow:var(--shadow-lg);}
.intro-note-t{font-family:var(--serif);font-weight:500;font-size:1.45rem;color:var(--indigo);
  line-height:1;margin-bottom:.5rem;}
.intro-note-d{font-size:.82rem;color:var(--muted);line-height:1.5;}

/* manifesto body */
.intro-body .eyebrow{margin-bottom:1.4rem;}
.intro-body .title{margin-bottom:1.6rem;}
.intro-body p{color:var(--ink-soft);font-weight:300;font-size:1.08rem;margin-bottom:1.1rem;}
.intro-body p strong{color:var(--ink);font-weight:600;}
.intro-sign{display:flex;align-items:center;gap:1.1rem;margin-top:2rem;}
.intro-sign-name{font-family:var(--serif);font-weight:500;font-size:1.7rem;color:var(--indigo);}
.intro-sign-role{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);padding-left:1.1rem;border-left:1px solid var(--line);}


/* ============================== DENTAL (01) ============================== */
/* numbered editorial index, portrait right, indigo accent */
.dental{background:var(--ivory);}
.dental-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2.5rem,6vw,5.5rem);align-items:center;}
.dental-body .eyebrow{margin-bottom:1.4rem;}
.dental-body .title{margin-bottom:.6rem;}
.dental-body .lead{margin-bottom:2.2rem;max-width:40ch;}

/* the numbered index — shared list component */
.index-list{border-top:1px solid var(--line);}
.index-row{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:1.1rem;
  padding:1.05rem 0;border-bottom:1px solid var(--line);
  transition:padding-left var(--dur) var(--ease);}
.index-row:hover{padding-left:.5rem;}
.index-row .num{font-family:var(--serif);font-weight:200;font-size:1.1rem;color:var(--gold);}
.index-row .name{font-family:var(--sans);font-weight:600;font-size:clamp(1.02rem,1.4vw,1.2rem);color:var(--ink);letter-spacing:-.01em;}
.index-row .meta{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
.dental-cta{margin-top:2.2rem;}

/* photo side: frame holds the 3:2 image at true ratio (no crop) */
.dental-figure{position:relative;}
.dental-frame{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:3/4;box-shadow:var(--shadow);
  background:var(--indigo-100);}
.dental-frame img{width:100%;height:100%;object-fit:cover;object-position:center;}
/* small accent badge */
.dental-badge{position:absolute;left:-1.3rem;bottom:-1.3rem;background:var(--indigo);color:var(--ivory);
  border-radius:var(--r-md);padding:1.2rem 1.4rem;max-width:210px;box-shadow:var(--shadow-lg);}
.dental-badge .b-t{font-family:var(--serif);font-weight:200;font-size:1.35rem;line-height:1.1;margin-bottom:.3rem;}
.dental-badge .b-d{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--gold);}


/* ============================ AESTHETICS (01) =========================== */
/* mirror of Dental: photo LEFT, red accent, two-column index */
.aes{background:var(--paper);}
.aes-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2.5rem,6vw,5.5rem);align-items:center;}
.aes-body .eyebrow{margin-bottom:1.4rem;}
.aes-body .title{margin-bottom:.6rem;}
.aes-body .lead{margin-bottom:2rem;max-width:42ch;}

/* two-column index (reuses .index-list / .index-row; red numerals here) */
.index-list--two{display:grid;grid-template-columns:1fr 1fr;gap:0 2.4rem;border-top:none;}
.index-list--two .index-col{border-top:1px solid var(--line);}
.aes .index-row .num{color:var(--red);}
.aes .index-row .name{font-size:clamp(1.05rem,1.5vw,1.3rem);}
.aes-cta{margin-top:2.2rem;}

/* photo side: frame holds the 3:4 portrait at true ratio (no crop) */
.aes-figure{position:relative;max-width:480px;}
.aes-frame{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:9/16;box-shadow:var(--shadow);
  background:var(--red-50);}
.aes-frame img,
.aes-frame video{width:100%;height:100%;object-fit:cover;object-position:center;display:block;}
/* offset accent rail behind the portrait */
.aes-figure::before{content:"";position:absolute;top:-1.4rem;right:-1.4rem;width:60%;height:70%;
  border:1px solid var(--red);border-radius:var(--r-lg);z-index:-1;opacity:.4;}
/* red accent badge */
.aes-badge{position:absolute;right:-1.3rem;bottom:-1.3rem;background:var(--red);color:var(--white);
  border-radius:var(--r-md);padding:1.2rem 1.4rem;max-width:220px;box-shadow:var(--shadow-lg);}
.aes-badge .b-t{font-family:var(--serif);font-weight:500;font-size:1.35rem;line-height:1.1;margin-bottom:.3rem;}
.aes-badge .b-d{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.1em;text-transform:uppercase;color:#FFD9D6;}


/* =============================== ABOUT (02) ============================== */
/* layered frames: portrait + offset gold border + indigo signature-quote */
.about{background:var(--ivory);position:relative;overflow:hidden;}
.about-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(2.5rem,6vw,6rem);align-items:center;}

/* visual: main frame matches photo's real 4:5 ratio (no crop) */
.about-visual{position:relative;}
.about-main{position:relative;z-index:2;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;
  box-shadow:var(--shadow-lg);background:var(--indigo-100);}
.about-main img{width:100%;height:100%;object-fit:cover;object-position:center;}
/* offset gold border behind */
.about-frame{position:absolute;inset:1.6rem -1.6rem -1.6rem 1.6rem;border:1px solid var(--gold);
  border-radius:var(--r-lg);z-index:1;}
/* indigo signature-quote card overlapping corner */
.about-quote{position:absolute;z-index:3;left:-1.4rem;bottom:-1.4rem;background:var(--indigo);
  color:var(--ivory);border-radius:var(--r-md);padding:1.5rem 1.7rem;max-width:270px;box-shadow:var(--shadow-lg);}
.about-quote .q-mark{font-family:var(--serif);font-size:2.6rem;color:var(--gold);line-height:.5;display:block;height:1rem;}
.about-quote p{font-family:var(--serif);font-weight:200;font-size:1.1rem;line-height:1.35;}

/* body */
.about-body .eyebrow{margin-bottom:1.4rem;}
.about-body .title{margin-bottom:1.5rem;}
.about-body > p{color:var(--ink-soft);font-weight:300;font-size:1.08rem;margin-bottom:1.8rem;}
/* approach pillars (shared mini-feature component) */
.feats{display:grid;grid-template-columns:1fr 1fr;gap:1.8rem 1.5rem;margin-bottom:.5rem;}
.feat{display:flex;gap:1.1rem;align-items:center;}
.feat-ico{flex:none;width:46px;height:46px;border-radius:14px;
  background:var(--indigo-100);box-shadow:var(--shadow-sm);
  display:flex;align-items:center;justify-content:center;color:var(--indigo);font-size:1.25rem;}
.feat b{display:block;font-family:var(--sans);font-weight:600;font-size:1.02rem;color:var(--ink);margin-bottom:.2rem;}
.feat span{font-size:.86rem;color:var(--muted);line-height:1.45;}


/* =============================== PROOF (03) ============================== */
/* featured quote + instagram grid */
.proof{background:var(--paper);}
.proof-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2.5rem,6vw,5rem);align-items:center;}

/* left: featured voice */
.proof-quote .eyebrow{margin-bottom:1.4rem;}
.proof-quote .title{margin-bottom:2rem;}
.proof-stars{display:flex;gap:4px;color:var(--gold);font-size:1.05rem;margin-bottom:1.2rem;}
.proof-text{font-family:var(--serif);font-weight:200;font-size:clamp(1.3rem,2vw,1.7rem);line-height:1.4;
  color:var(--ink);margin-bottom:1.6rem;}
.proof-by{display:flex;align-items:center;gap:.9rem;}
.proof-av{width:48px;height:48px;border-radius:50%;background:var(--indigo-100);color:var(--indigo);
  display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:1.2rem;flex:none;}
.proof-by b{display:block;font-family:var(--sans);font-weight:600;font-size:.95rem;color:var(--ink);}
.proof-by span{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}

/* right: two 9:16 vertical reels (autoplay muted loop) */
.proof-ig{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;}
.proof-reel{aspect-ratio:9/16;border-radius:var(--r-md);background:var(--indigo-100);overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease);}
.proof-reel:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.proof-reel video{width:100%;height:100%;object-fit:cover;display:block;}
/* follow strip under grid */
.proof-follow{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  flex-wrap:wrap;margin-top:.4rem;padding-top:1.2rem;border-top:1px solid var(--line);}
.proof-handle{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--mono);font-size:var(--t-sm);
  letter-spacing:.06em;color:var(--ink-soft);}
.proof-handle i{font-size:1.2rem;color:var(--red);}

/* left: slider — design of each review unchanged; only nav added below */
.proof-slider{position:relative;}
/* all slides share one grid cell — container takes the tallest slide's height,
   so the layout doesn't jump when slides change */
.proof-slides{display:grid;grid-template-areas:"stack";}
.proof-slide{grid-area:stack;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .4s ease,visibility .4s ease;}
.proof-slide.is-active{opacity:1;visibility:visible;pointer-events:auto;}
/* spacing of slide internals = same as old single-quote layout (no design change) */
.proof-slide .proof-stars{margin-bottom:1.2rem;}
.proof-slide .proof-text{margin-bottom:2rem;}

.proof-controls{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  margin-top:2rem;padding-top:1.4rem;border-top:1px solid var(--line);flex-wrap:wrap;}
.proof-dots{display:flex;gap:.5rem;align-items:center;}
.proof-dot{width:8px;height:8px;border:0;padding:0;border-radius:50%;background:var(--line);cursor:pointer;
  transition:background var(--dur) var(--ease),width var(--dur) var(--ease),border-radius var(--dur) var(--ease);}
.proof-dot:hover{background:var(--indigo-deep);}
.proof-dot.is-active{background:var(--indigo);width:24px;border-radius:4px;}
.proof-nav{display:flex;gap:.6rem;}
.proof-arrow{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--white);
  color:var(--indigo);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;
  transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur) var(--ease);}
.proof-arrow:hover{background:var(--indigo);border-color:var(--indigo);color:var(--white);transform:translateY(-2px);}
.proof-arrow:active{transform:translateY(0);}


/* =============================== CTA (03) =============================== */
/* full-bleed photo with overlaid invitation (the send-off) */
.cta{position:relative;overflow:hidden;background:var(--indigo-deep);color:var(--ivory);
  text-align:center;isolation:isolate;}
.cta-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
  z-index:-2;}
.cta::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(0deg,rgba(33,28,78,.94),rgba(33,28,78,.62) 55%,rgba(33,28,78,.78));}
.cta-inner{max-width:720px;margin-inline:auto;padding-block:clamp(5rem,9vw,8rem);}
.cta .eyebrow{justify-content:center;margin-bottom:1.6rem;}
.cta-title{font-family:var(--serif);font-weight:200;font-size:var(--t-h1);line-height:1.06;
  color:var(--white);margin-bottom:1.4rem;}
.cta-title .italic{font-style:italic;color:var(--gold);}
.cta p{font-size:var(--t-lead);font-weight:300;color:rgba(247,244,238,.85);
  margin-bottom:2.4rem;max-width:36em;margin-inline:auto;}
.cta-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;}


/* =============================== FOOTER (03) ============================ */
/* links + address left, embedded map right */
.ftr{background:var(--indigo-deep);color:rgba(247,244,238,.7);}
.ftr-top{display:grid;grid-template-columns:1.35fr .95fr;gap:0;}

/* left: brand + links + address */
.ftr-info{padding:clamp(3rem,6vw,5rem) clamp(2rem,4vw,4rem);}
.ftr-logo{height:100px;width:auto;margin-bottom:1.4rem;}
.ftr-tag{font-family:var(--serif);font-weight:200;font-size:1.15rem;line-height:1.5;
  color:rgba(247,244,238,.82);max-width:34ch;margin-bottom:2rem;}
.ftr-cols{display:grid;grid-template-columns:1fr 1.2fr;gap:2rem;}
.ftr-h{font-family:var(--mono);font-weight:500;font-size:var(--t-xs);letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold);margin-bottom:1.1rem;}
.ftr-links li{margin-bottom:.65rem;}
.ftr-links a{font-size:.92rem;color:rgba(247,244,238,.66);
  transition:color var(--dur) var(--ease),padding-left var(--dur) var(--ease);}
.ftr-links a:hover{color:var(--ivory);padding-left:5px;}
.ftr-addr{font-style:normal;font-size:.92rem;line-height:1.7;color:rgba(247,244,238,.66);margin-bottom:1rem;}
.ftr-social{display:inline-flex;align-items:center;gap:.65rem;font-family:var(--mono);font-size:.85rem;
  letter-spacing:.04em;color:rgba(247,244,238,.85);transition:color var(--dur) var(--ease);}
.ftr-social i{width:38px;height:38px;border-radius:50%;border:1px solid rgba(247,244,238,.25);
  display:flex;align-items:center;justify-content:center;font-size:1.1rem;
  transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease);}
.ftr-social:hover{color:var(--gold);}
.ftr-social:hover i{background:var(--red);border-color:var(--red);color:#fff;}

/* right: map (styled container; Google iframe sits inside) */
.ftr-map{position:relative;min-height:340px;}
.ftr-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;
  filter:grayscale(.35) contrast(1.05);}
/* indigo tint overlay to blend the map into the brand (click-through) */
.ftr-map::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(135deg,rgba(33,28,78,.32),rgba(57,49,130,.12));mix-blend-mode:multiply;}
/* floating directions card */
.ftr-pin{position:absolute;z-index:2;left:1.5rem;bottom:1.5rem;background:rgba(252,250,246,.95);
  backdrop-filter:blur(8px);border-radius:var(--r-md);padding:1rem 1.2rem;max-width:230px;
  box-shadow:var(--shadow-lg);}
.ftr-pin-t{display:flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:var(--t-xs);
  font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--indigo);margin-bottom:.4rem;}
.ftr-pin-t i{color:var(--red);font-size:1.05rem;}
.ftr-pin-d{font-size:.82rem;color:var(--ink-soft);line-height:1.45;margin-bottom:.7rem;}
.ftr-pin a{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.06em;color:var(--gold-deep);
  display:inline-flex;align-items:center;gap:.4rem;}
.ftr-pin a:hover{color:var(--indigo);}

/* bottom bar */
.ftr-bottom{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  padding:1.6rem clamp(2rem,4vw,4rem);border-top:1px solid rgba(247,244,238,.1);}
.ftr-copy{font-size:.8rem;color:rgba(247,244,238,.5);margin:0;}
/* credit line — sits to the right of the copyright */
.ftr-credit{font-size:.8rem;color:rgba(247,244,238,.5);margin:0;
  font-family:var(--mono);letter-spacing:.06em;}
.ftr-credit a{color:rgba(247,244,238,.75);text-decoration:none;
  border-bottom:1px solid rgba(247,244,238,.22);padding-bottom:1px;
  transition:color .25s ease,border-color .25s ease;}
.ftr-credit a:hover{color:var(--gold);border-bottom-color:var(--gold);}
/* two-tone brand bar */
.ftr-bar{display:flex;height:5px;}
.ftr-bar span{flex:1;}
.ftr-bar span:first-child{background:var(--indigo);}
.ftr-bar span:last-child{background:var(--red);}


/* ==========================================================================
   INNER PAGES (about · contact) — append starts here
   ========================================================================== */


/* ============================== PAGE HERO ============================== */
/* Compact intro band used by inner pages (about · contact). Lives below
   the absolute header. Modifier .ph-about / .ph-contact for per-page tweaks. */
.page-hero{position:relative;overflow:hidden;
  padding:clamp(7.5rem,12vw,10rem) 0 clamp(3rem,6vw,5rem);
  background:linear-gradient(180deg,var(--ivory) 0%,var(--ivory) 60%,var(--paper) 100%);
  isolation:isolate;}
/* soft brand orbs */
.page-hero::before{content:"";position:absolute;top:-12%;right:-8%;width:46vw;height:46vw;
  max-width:540px;max-height:540px;border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(circle,rgba(57,49,130,.10),transparent 65%);}
.page-hero::after{content:"";position:absolute;bottom:-20%;left:-10%;width:40vw;height:40vw;
  max-width:460px;max-height:460px;border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(circle,rgba(194,155,99,.14),transparent 66%);}

.ph-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2.5rem,6vw,5.5rem);align-items:center;}
.ph-grid--centered{grid-template-columns:1fr;max-width:760px;margin-inline:auto;text-align:center;}

.ph-copy .eyebrow{margin-bottom:1.4rem;}
.ph-copy .title{margin-bottom:1.5rem;}
.ph-copy .lead{margin-bottom:1.8rem;max-width:36em;}
.ph-copy--center .eyebrow{justify-content:center;}
.ph-copy--center .lead{margin-inline:auto;}

/* about hero: meta row (two small chips with icon) */
.ph-meta{display:flex;flex-wrap:wrap;gap:1.6rem;align-items:center;margin-top:.5rem;}
.ph-meta-item{display:flex;align-items:center;gap:.85rem;}
.ph-meta-ico{flex:none;width:42px;height:42px;border-radius:12px;background:var(--indigo-100);
  color:var(--indigo);display:flex;align-items:center;justify-content:center;font-size:1.2rem;
  box-shadow:var(--shadow-sm);}
.ph-meta-ico--red{background:var(--red-50);color:var(--red);}
.ph-meta-item b{display:block;font-family:var(--sans);font-weight:600;font-size:1rem;
  color:var(--ink);margin-bottom:.15rem;}
.ph-meta-item span{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);}

/* about hero: portrait frame with offset gold border + corner tag */
.ph-visual{position:relative;width:100%;max-width:460px;margin-left:auto;}
.ph-frame{position:relative;z-index:2;border-radius:var(--r-lg);overflow:hidden;
  aspect-ratio:3/4;box-shadow:var(--shadow-lg);background:var(--indigo-100);}
.ph-frame--wide{aspect-ratio:3/2;}
.ph-frame img{width:100%;height:100%;object-fit:cover;object-position:center top;}
.ph-frame--wide img{object-position:center;}
.ph-deco{position:absolute;z-index:1;inset:1.4rem -1.4rem -1.4rem 1.4rem;
  border:1px solid var(--gold);border-radius:var(--r-lg);}
.ph-tag{position:absolute;z-index:3;left:-1.2rem;bottom:-1.2rem;background:var(--white);
  border-radius:var(--r-md);padding:1rem 1.2rem;max-width:260px;box-shadow:var(--shadow-lg);}
.ph-tag-t{display:block;font-family:var(--serif);font-weight:500;font-size:1.15rem;
  color:var(--indigo);line-height:1.1;margin-bottom:.25rem;}
.ph-tag-d{display:block;font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);}

/* contact hero: quick-link chip row */
.ph-chips{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;margin-top:.5rem;}
.ph-chip{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--mono);
  font-size:var(--t-sm);font-weight:500;letter-spacing:.06em;color:var(--ink);
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-pill);
  padding:.7em 1.2em;box-shadow:var(--shadow-sm);
  transition:transform var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease);}
.ph-chip i{color:var(--indigo);font-size:1.05rem;}
.ph-chip:hover{transform:translateY(-2px);border-color:var(--indigo);color:var(--indigo);}


/* =============================== STORY ================================= */
/* About — clinic-led "Our Story" (text-led, 2-column head+body, no photo) */
.about-story{background:var(--paper);}
.about-story-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2.5rem,5vw,5rem);
  align-items:start;}
.about-story-head{position:sticky;top:6rem;}
.about-story-head .eyebrow{margin-bottom:1.4rem;}
.about-story-head .title{margin-bottom:0;}
.about-story-body p{color:var(--ink-soft);font-weight:300;font-size:1.08rem;line-height:1.7;
  margin-bottom:1.3rem;}
.about-story-body p:last-child{margin-bottom:0;}
.about-story-body p strong{color:var(--ink);font-weight:600;}


/* ============================== SERVICES =============================== */
/* About — two-column services overview (reuses .index-list + .index-row) */
.about-services{background:var(--ivory);}
.services-head{text-align:center;max-width:680px;margin-inline:auto;
  margin-bottom:clamp(2.8rem,5vw,4rem);}
.services-head .eyebrow{justify-content:center;margin-bottom:1.3rem;}
.services-head .title{margin-bottom:1.2rem;}
.services-lead{font-size:var(--t-lead);font-weight:300;color:var(--ink-soft);line-height:1.6;
  max-width:48ch;margin-inline:auto;}
.services-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,5vw,4rem);
  align-items:start;}
.services-col-title{display:flex;align-items:center;gap:.6rem;
  font-family:var(--serif);font-weight:500;font-size:1.45rem;color:var(--indigo);
  letter-spacing:-.01em;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid var(--indigo);}
.services-col-title i{font-size:1.3rem;color:var(--indigo);}
.services-col--skin .services-col-title{color:var(--red);border-bottom-color:var(--red);}
.services-col--skin .services-col-title i{color:var(--red);}
.services-col--skin .index-row .num{color:var(--red);}
.services-col .link{display:inline-flex;margin-top:1.6rem;}
.services-col--skin .link{color:var(--red);}
.services-col--skin .link:hover{color:var(--red-deep);}


/* ============================== FOUNDER ================================ */
/* About — compact founder section (the 30% personal block) */
.founder{background:var(--paper);}
.founder-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2.5rem,6vw,5rem);
  align-items:center;}
.founder-figure{position:relative;max-width:420px;}
.founder-frame{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:3/4;
  box-shadow:var(--shadow-lg);background:var(--indigo-100);}
.founder-frame img{width:100%;height:100%;object-fit:cover;object-position:center top;}
/* offset gold border behind for visual depth */
.founder-figure::before{content:"";position:absolute;inset:-1.2rem 1.2rem 1.2rem -1.2rem;
  border:1px solid var(--gold);border-radius:var(--r-lg);z-index:-1;}

.founder-body .eyebrow{margin-bottom:1.3rem;}
.founder-body .title{margin-bottom:1.6rem;font-size:clamp(1.8rem,3.2vw,2.6rem);}
.founder-body > p{color:var(--ink-soft);font-weight:300;font-size:1.05rem;line-height:1.7;
  margin-bottom:1.1rem;}
.founder-body > p strong{color:var(--ink);font-weight:600;}
.founder-sign{display:flex;align-items:center;gap:1.1rem;margin-top:1.8rem;}
.founder-sign-name{font-family:var(--serif);font-weight:500;font-size:1.5rem;color:var(--indigo);}
.founder-sign-role{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);padding-left:1.1rem;border-left:1px solid var(--line);}


/* ============================== PHILOSOPHY ============================== */
/* About — dark indigo band, six numbered ideas */
.philosophy{position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,var(--indigo-deep) 0%,#1A1640 100%);
  color:var(--ivory);padding-block:var(--sec-y);}
/* faint gold radial in one corner */
.philosophy::before{content:"";position:absolute;top:-25%;right:-15%;width:60vw;height:60vw;
  max-width:720px;max-height:720px;border-radius:50%;z-index:-1;pointer-events:none;
  background:radial-gradient(circle,rgba(194,155,99,.10),transparent 65%);}
.philosophy-head{text-align:center;max-width:680px;margin-inline:auto;margin-bottom:clamp(3rem,5vw,4.5rem);}
.philosophy-head .eyebrow{justify-content:center;margin-bottom:1.4rem;}
.philosophy-title{color:var(--white);margin-bottom:1.3rem;}
.philosophy-title .italic{color:var(--gold);font-style:italic;}
.philosophy-lead{font-size:var(--t-lead);font-weight:300;line-height:1.6;color:rgba(247,244,238,.78);}

.philosophy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;}
.philosophy-card{position:relative;padding:1.9rem 1.8rem;background:rgba(255,255,255,.04);
  border:1px solid rgba(247,244,238,.10);border-radius:var(--r-md);
  transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),transform var(--dur) var(--ease);}
.philosophy-card:hover{background:rgba(255,255,255,.06);border-color:rgba(194,155,99,.35);transform:translateY(-3px);}
.philosophy-num{font-size:1.05rem;letter-spacing:.04em;display:block;margin-bottom:1.2rem;opacity:.85;}
.philosophy-h{font-family:var(--serif);font-weight:500;font-size:1.25rem;color:var(--white);
  margin-bottom:.7rem;line-height:1.2;}
.philosophy-card p{font-size:.95rem;line-height:1.6;color:rgba(247,244,238,.72);font-weight:300;}


/* ============================== QUOTE BAND ============================= */
/* About — large editorial pull-quote with signature */
.quote-band{background:var(--ivory);text-align:center;position:relative;}
.quote-mark{display:block;font-family:var(--serif);font-weight:700;font-size:6rem;
  color:var(--gold);line-height:.4;margin-bottom:1.2rem;height:3rem;}
.quote-text{font-family:var(--serif);font-weight:200;font-style:italic;
  font-size:clamp(1.6rem,3vw,2.6rem);line-height:1.32;color:var(--indigo-deep);
  letter-spacing:-.01em;margin-bottom:2.2rem;}
.quote-sign{display:inline-flex;flex-direction:column;align-items:center;gap:.3rem;
  padding-top:1.4rem;border-top:1px solid var(--line);}
.quote-sign-name{font-family:var(--serif);font-weight:500;font-size:1.3rem;color:var(--indigo);}
.quote-sign-role{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);}


/* ============================== CONTACT MAIN =========================== */
/* Two-column: form left, info card right */
.contact-main{background:var(--paper);}
.contact-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(2.5rem,5vw,4.5rem);
  align-items:start;}

/* form wrap header */
.contact-form-wrap .eyebrow{margin-bottom:1.2rem;}
.contact-form-wrap .title{margin-bottom:.8rem;}
.contact-form-note{color:var(--ink-soft);font-size:.98rem;font-weight:300;margin-bottom:2rem;}
.req{color:var(--red);font-weight:600;}
.opt{font-family:var(--mono);font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);font-weight:500;padding-left:.4rem;}

/* the form */
.contact-form{display:grid;gap:1.4rem;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;}
.field{display:flex;flex-direction:column;gap:.55rem;position:relative;}
.field label{font-family:var(--mono);font-size:var(--t-xs);font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-soft);}
.field input,.field select,.field textarea{
  font-family:var(--sans);font-size:1rem;line-height:1.4;color:var(--ink);
  background:var(--white);border:1.5px solid var(--line);border-radius:14px;
  padding:1em 1.15em;width:100%;
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),background var(--dur) var(--ease);}
.field input::placeholder,.field textarea::placeholder{color:var(--muted);opacity:.7;}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--indigo);background:var(--white);
  box-shadow:0 0 0 4px rgba(57,49,130,.12);}
.field textarea{resize:vertical;min-height:120px;}

/* +91 prefix block */
.field-phone{display:flex;align-items:stretch;}
.field-phone .field-prefix{display:inline-flex;align-items:center;padding:0 .95rem;
  background:var(--indigo-100);color:var(--indigo);border:1.5px solid var(--line);border-right:0;
  border-radius:14px 0 0 14px;font-family:var(--mono);font-weight:600;font-size:.95rem;letter-spacing:.04em;}
.field-phone input{border-radius:0 14px 14px 0;flex:1;}
.field-phone input:focus{box-shadow:0 0 0 4px rgba(57,49,130,.12);}
.field-phone:focus-within .field-prefix{border-color:var(--indigo);background:var(--indigo);color:var(--ivory);}

/* select with custom chevron */
.field-select{position:relative;}
.field-select select{appearance:none;-webkit-appearance:none;padding-right:2.6rem;cursor:pointer;}
.field-select i{position:absolute;right:1rem;top:50%;transform:translateY(-50%);
  pointer-events:none;color:var(--indigo);font-size:1.05rem;}

/* error state */
.field-msg{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.04em;color:var(--red);
  min-height:.95rem;line-height:1.3;}
.field.has-error label{color:var(--red);}
.field.has-error input,
.field.has-error select,
.field.has-error textarea,
.field.has-error .field-prefix{border-color:var(--red);background:#FEF6F5;}
.field.has-error .field-phone input{background:#FEF6F5;}
.field.has-error .field-prefix{color:var(--red);}

/* honeypot — visually hidden but in DOM */
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}

/* foot row */
.form-foot{display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap;margin-top:.6rem;}
.form-fine{font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:var(--muted);
  text-transform:uppercase;}
.form-submit{min-width:200px;}
.form-submit.is-busy{opacity:.7;cursor:wait;transform:none;}
.form-submit.is-busy .ico{opacity:.5;}

/* status banner */
.form-status{font-family:var(--sans);font-size:.95rem;line-height:1.55;border-radius:14px;
  padding:0 1.2rem;max-height:0;opacity:0;overflow:hidden;
  border-left:3px solid transparent;
  transition:max-height var(--dur) var(--ease),opacity var(--dur) var(--ease),
    padding var(--dur) var(--ease),margin var(--dur) var(--ease);}
.form-status.is-visible{padding:1.1rem 1.2rem;max-height:220px;opacity:1;margin-top:.4rem;}
.form-status.is-ok{background:#E8F1EA;color:#2A5C36;border-left-color:#4B7B57;}
.form-status.is-err{background:var(--red-50);color:var(--red-deep);border-left-color:var(--red);}
.form-status.is-busy{background:var(--indigo-100);color:var(--indigo-deep);border-left-color:var(--indigo);}


/* ============================== CONTACT INFO =========================== */
.contact-info{position:sticky;top:6.5rem;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(1.8rem,3vw,2.4rem) clamp(1.6rem,3vw,2.2rem);box-shadow:var(--shadow-sm);}
.contact-info .eyebrow{margin-bottom:1rem;}
.contact-info .title{margin-bottom:1.8rem;font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.05;}

.info-list{display:flex;flex-direction:column;gap:1.5rem;}
.info-row{display:flex;gap:1rem;align-items:flex-start;}
.info-ico{flex:none;width:42px;height:42px;border-radius:12px;
  background:var(--indigo-100);color:var(--indigo);display:flex;align-items:center;
  justify-content:center;font-size:1.2rem;}
.info-row > div{flex:1;min-width:0;}
.info-h{display:block;font-family:var(--mono);font-size:.65rem;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem;}
.info-v{display:block;color:var(--ink);font-size:.94rem;line-height:1.55;
  transition:color var(--dur) var(--ease);}
a.info-v:hover{color:var(--indigo);}
.info-v--big{font-family:var(--serif);font-weight:500;font-size:1.45rem;color:var(--indigo);
  letter-spacing:-.01em;line-height:1.1;}
.info-cta{margin-top:1.8rem;padding-top:1.5rem;border-top:1px solid var(--line);}


/* ============================== NEXT BAND ============================== */
/* Contact — three-step "what happens next" */
.next-band{background:var(--ivory);}
.next-head{text-align:center;max-width:660px;margin-inline:auto;margin-bottom:clamp(2.5rem,5vw,3.5rem);}
.next-head .eyebrow{justify-content:center;margin-bottom:1.4rem;}
.next-head .title{margin-bottom:0;}
.next-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;}
.next-card{position:relative;padding:2.2rem 1.9rem;background:var(--white);
  border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease);}
.next-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.next-num{font-size:2.6rem;line-height:1;display:block;margin-bottom:1.1rem;}
.next-h{font-family:var(--serif);font-weight:500;font-size:1.3rem;color:var(--ink);
  margin-bottom:.7rem;line-height:1.2;}
.next-card p{font-size:.95rem;line-height:1.6;color:var(--ink-soft);font-weight:300;}


/* ======================================================================== */
/* ======================== SERVICE PAGES (dental + aesthetic) ============ */
/* ======================================================================== */

/* Color scope: .svc defaults to indigo accent (dental); .svc--aes flips to red. */
.svc{--acc:var(--indigo);--acc-deep:var(--indigo-deep);--acc-100:var(--indigo-100);background:var(--paper);}
.svc.svc--aes{--acc:var(--red);--acc-deep:#B41610;--acc-100:#FFEFEE;}

/* ---------- PAGE HERO (eyebrow + SEO h1 + lead) ---------- */
.svc-hero{background:var(--ivory);padding:clamp(7rem,12vw,9rem) 0 clamp(3.5rem,7vw,5.5rem);
  border-bottom:1px solid var(--line);}
.svc-hero-inner{max-width:920px;}
.svc-hero .eyebrow{margin-bottom:1.4rem;}
.svc-hero .title{margin-bottom:1.6rem;font-size:clamp(2.2rem,4.4vw,3.8rem);line-height:1.08;}
.svc-hero .lead{max-width:62ch;margin-bottom:1.8rem;}
.svc-hero-meta{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;
  font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);}
.svc-hero-meta .dot{width:3px;height:3px;border-radius:50%;background:var(--gold);}

/* ---------- 2-COL SERVICES BLOCK ---------- */
.svc-section{padding:clamp(4rem,7vw,6rem) 0;}
.svc-grid{display:grid;grid-template-columns:260px 1fr;gap:clamp(3rem,5.5vw,5rem);align-items:start;}

/* LEFT — sticky TOC with vertical rail + sliding gold dot */
.svc-toc{position:sticky;top:7rem;align-self:start;}
.svc-toc-eye{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);margin-bottom:1.6rem;
  display:flex;align-items:center;gap:.5rem;}
.svc-toc-eye::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);}
.svc-toc-list{list-style:none;padding:0;margin:0;position:relative;
  border-left:1px solid rgba(194,155,99,.25);padding-left:1.2rem;}
.svc-toc-indicator{position:absolute;left:-5px;width:9px;height:9px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 0 4px rgba(194,155,99,.18);
  top:14px;transition:top 380ms cubic-bezier(.4,0,.2,1);}
.svc-toc-item{display:flex;align-items:baseline;gap:.85rem;padding:.55rem 0;cursor:pointer;
  background:none;border:0;width:100%;text-align:left;
  color:var(--ink-soft);
  transition:color var(--dur) var(--ease),transform var(--dur) var(--ease);}
.svc-toc-num{font-family:var(--serif);font-weight:200;color:var(--gold);font-size:.95rem;
  flex-shrink:0;}
.svc-toc-name{font-family:var(--serif);font-weight:400;font-size:1.02rem;line-height:1.3;}
.svc-toc-item:hover{color:var(--ink);}
.svc-toc-item.is-active{color:var(--acc);transform:translateX(6px);}
.svc-toc-item.is-active .svc-toc-name{font-weight:500;}

/* RIGHT — service blocks */
.svc-body{min-width:0;}
.svc-block{scroll-margin-top:6rem;padding-bottom:clamp(3.5rem,6vw,5.5rem);
  margin-bottom:clamp(3.5rem,6vw,5.5rem);border-bottom:1px solid var(--line);}
.svc-block:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0;}

.svc-block-eye{font-family:var(--mono);font-size:var(--t-xs);letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);margin-bottom:1rem;
  display:flex;align-items:center;gap:.7rem;}
.svc-block-eye .num{color:var(--acc);font-family:var(--serif);font-weight:500;
  font-size:.95rem;letter-spacing:.05em;}
.svc-block-eye .sep{width:18px;height:1px;background:var(--gold);}

.svc-block-title{font-family:var(--serif);font-weight:500;font-size:clamp(2rem,3.4vw,3rem);
  color:var(--ink);line-height:1.1;letter-spacing:-.01em;margin-bottom:2rem;}

.svc-block-image{width:100%;aspect-ratio:16/10;border-radius:var(--r-md);overflow:hidden;
  background:var(--acc-100);box-shadow:var(--shadow);margin-bottom:2rem;}
.svc-block-image img{width:100%;height:100%;object-fit:cover;display:block;}

.svc-block-body p{font-size:1.15rem;line-height:1.75;color:var(--ink-soft);
  font-weight:300;margin-bottom:1.15rem;}
.svc-block-body p:last-child{margin-bottom:0;}

/* "Good for" tag strip — sits between body and key-fact tiles */
.svc-block-tags{margin-top:1.8rem;padding-top:1.5rem;border-top:1px solid var(--line);}
.svc-block-tags-label{font-family:var(--mono);font-size:.65rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);margin-bottom:.9rem;
  display:flex;align-items:center;gap:.7rem;}
.svc-block-tags-label::before{content:"";width:18px;height:1px;background:var(--gold);}
.svc-block-tag-list{display:flex;flex-wrap:wrap;gap:.5rem;}
.svc-block-tag{display:inline-flex;align-items:center;padding:.45rem .9rem;
  background:var(--acc-100);color:var(--acc-deep);border-radius:999px;
  font-family:var(--sans);font-size:.85rem;font-weight:500;letter-spacing:.01em;line-height:1.3;}

.svc-block-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:2.2rem;}
.svc-fact{padding:1.1rem 1.2rem;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-md);transition:border-color var(--dur) var(--ease);}
.svc-fact:hover{border-color:var(--acc);}
.svc-fact-label{font-family:var(--mono);font-size:.62rem;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);margin-bottom:.35rem;}
.svc-fact-value{font-family:var(--serif);font-weight:500;font-size:1.05rem;color:var(--acc);
  line-height:1.2;}

/* ======================== FAQ SECTION ================================== */
.faq{background:var(--ivory);padding:clamp(4rem,8vw,7rem) 0;}
.faq-head{text-align:center;max-width:680px;margin:0 auto clamp(3rem,6vw,4rem);}
.faq-head .eyebrow{justify-content:center;display:inline-flex;margin-bottom:1.2rem;}
.faq-head .title{margin-bottom:1.1rem;}
.faq-head p{color:var(--ink-soft);font-size:1.02rem;line-height:1.65;font-weight:300;}

.faq-list{max-width:820px;margin:0 auto;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-item:first-child{border-top:1px solid var(--line);}
.faq-q{width:100%;text-align:left;background:none;border:0;cursor:pointer;
  padding:1.6rem 0;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  font-family:var(--serif);font-weight:500;font-size:1.12rem;color:var(--ink);
  line-height:1.4;transition:color var(--dur) var(--ease);}
.faq-q:hover{color:var(--indigo);}
.faq-item.is-open .faq-q{color:var(--indigo);}

.faq-icon{position:relative;width:22px;height:22px;flex-shrink:0;color:var(--indigo);
  transition:transform 320ms cubic-bezier(.4,0,.2,1);}
.faq-icon::before,.faq-icon::after{content:"";position:absolute;top:50%;left:50%;background:currentColor;}
.faq-icon::before{width:14px;height:1.5px;transform:translate(-50%,-50%);}
.faq-icon::after{width:1.5px;height:14px;transform:translate(-50%,-50%);}
.faq-item.is-open .faq-icon{transform:rotate(45deg);}

.faq-a{max-height:0;overflow:hidden;transition:max-height 380ms cubic-bezier(.4,0,.2,1);}
.faq-item.is-open .faq-a{max-height:480px;}
.faq-a-inner{padding:0 0 1.6rem 0;font-size:1rem;line-height:1.72;color:var(--ink-soft);
  font-weight:300;max-width:62ch;}


/* ======================================================================== */
/* ============================ PREMIUM POLISH PASS ======================= */
/* ======================================================================== */
/* These are the micro-interactions and motion details that separate
   a polished boutique site from a templated one. Every block below is
   intentional — read top to bottom for the visual upgrade narrative. */

/* ─── 01. Refined text selection ──────────────────────────────────────── */
::selection      { background:var(--indigo); color:var(--ivory); text-shadow:none; }
::-moz-selection { background:var(--indigo); color:var(--ivory); text-shadow:none; }

/* ─── 02. Custom focus rings — gold, never browser-blue ───────────────── */
*:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px;}
.btn:focus-visible,.hdr-book:focus-visible{outline-offset:4px;}

/* ─── 03. Custom cursor — desktop only, hidden on touch ───────────────── */
@media (hover:hover) and (pointer:fine){
  /* Disable the system cursor so we can draw our own */
  html,html *{cursor:none !important;}
  /* But re-enable text-cursor on form fields */
  input,textarea,select,[contenteditable]{cursor:text !important;}
  .cursor{
    position:fixed;top:0;left:0;width:8px;height:8px;border-radius:50%;
    background:var(--indigo);pointer-events:none;z-index:9998;
    transform:translate3d(-50%,-50%,0);
    transition:width 280ms cubic-bezier(.4,0,.2,1),
               height 280ms cubic-bezier(.4,0,.2,1),
               background-color 280ms cubic-bezier(.4,0,.2,1),
               opacity 220ms ease,
               border-width 280ms cubic-bezier(.4,0,.2,1);
    mix-blend-mode:normal;will-change:transform;
    opacity:0;
  }
  .cursor.is-ready{opacity:1;}
  /* Larger ring state — over interactive elements */
  .cursor.is-active{
    width:34px;height:34px;background:transparent;
    border:1px solid var(--indigo);
  }
  /* Gold variant for elements on dark backgrounds (CTA, indigo bands) */
  .cursor.is-dark{background:var(--gold);}
  .cursor.is-dark.is-active{background:transparent;border-color:var(--gold);}
}

/* ─── 04. Scroll-reveal — fade up 20px on enter, runs once ────────────── */
.reveal{opacity:0;transform:translateY(22px);
  transition:opacity 800ms cubic-bezier(.22,.61,.36,1),
             transform 800ms cubic-bezier(.22,.61,.36,1);}
.reveal.is-visible{opacity:1;transform:translateY(0);}
/* Slight stagger when multiple reveals sit close together */
.reveal[data-reveal-delay="1"]{transition-delay:80ms;}
.reveal[data-reveal-delay="2"]{transition-delay:160ms;}
.reveal[data-reveal-delay="3"]{transition-delay:240ms;}
.reveal[data-reveal-delay="4"]{transition-delay:320ms;}
.reveal[data-reveal-delay="5"]{transition-delay:400ms;}

/* ─── 05. Top scroll-progress rail ────────────────────────────────────── */
.scroll-progress{
  position:fixed;top:0;left:0;height:2px;width:100%;
  background:transparent;z-index:90;pointer-events:none;}
.scroll-progress-bar{
  height:100%;width:0;background:var(--gold);
  transform-origin:left center;
  transition:width 120ms linear;}

/* ─── 06. Drop caps for editorial paragraphs ──────────────────────────── */
.drop-cap::first-letter{
  font-family:var(--serif);font-weight:200;font-size:4.2em;
  line-height:.82;float:left;margin:.1em .12em 0 0;
  color:var(--indigo);letter-spacing:-.03em;}
@media (max-width:576px){
  .drop-cap::first-letter{font-size:3.2em;}
}

/* ─── 07. Button micro-interactions ───────────────────────────────────── */
/* Smoother easing + 2px lift on hover. Arrow inside nudges right. */
.btn{transition:transform var(--dur) cubic-bezier(.4,0,.2,1),
                background-color var(--dur) var(--ease),
                color var(--dur) var(--ease),
                box-shadow 320ms cubic-bezier(.4,0,.2,1),
                border-color var(--dur) var(--ease);}
.btn:hover{transform:translateY(-2px);}
.btn--primary:hover{box-shadow:0 12px 28px -10px rgba(33,28,78,.45);}
.btn--red:hover    {box-shadow:0 12px 28px -10px rgba(226,35,26,.4);}
.btn--ondark:hover {box-shadow:0 12px 28px -10px rgba(0,0,0,.35);}
.btn--light:hover  {box-shadow:0 12px 28px -10px rgba(33,28,78,.18);}
/* Arrow icon nudges right on hover */
.btn .ico,.btn .ti-arrow-right{transition:transform 280ms cubic-bezier(.4,0,.2,1);
  display:inline-block;}
.btn:hover .ico,.btn:hover .ti-arrow-right{transform:translateX(4px);}

/* ─── 08. Image zoom on hover (service photos + intro figure) ─────────── */
/* Image hover zoom — overflow:hidden only on .dental-frame / .aes-frame so
   the .dental-badge / .aes-badge can sit at negative offsets without clipping. */
.svc-block-image,.intro-figure{overflow:hidden;}
.svc-block-image img,.intro-figure img,.dental-figure img,.aes-figure img,.aes-figure video{
  transition:transform 900ms cubic-bezier(.22,.61,.36,1);}
.svc-block-image:hover img,
.intro-figure:hover img,
.dental-figure:hover img,
.aes-figure:hover img,
.aes-figure:hover video{transform:scale(1.04);}

/* ─── 09. Link underline draw on hover ────────────────────────────────── */
/* Targets .link class + index-list "See all" footers + nav links */
.link,.index-foot a,.about-link,.next-link{
  position:relative;
  background-image:linear-gradient(currentColor,currentColor);
  background-size:0% 1px;
  background-position:0 100%;
  background-repeat:no-repeat;
  transition:background-size 380ms cubic-bezier(.22,.61,.36,1),
             color var(--dur) var(--ease);}
.link:hover,.index-foot a:hover,.about-link:hover,.next-link:hover{
  background-size:100% 1px;}

/* ─── 10. Reduced motion — respect user preference ────────────────────── */
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1 !important;transform:none !important;}
  .cursor{display:none !important;}
  html,html *{cursor:auto !important;}
  .btn:hover{transform:none !important;}
  .svc-block-image:hover img,.intro-figure:hover img,
  .dental-figure:hover img,.aes-figure:hover img,
  .aes-figure:hover video{transform:none !important;}
}
