/* =============================================================================
   WSDC home page sections  ·  v0.2
   Loaded only on the front page. Reuses tokens and components from main.css.
   Placeholder panels (.ph) stand in for photography until media is added via CMS.
   ============================================================================= */

/* Mobile horizontal scrollers. On small screens the before/afters, featured
   treatments and dentists grids become swipeable rows with a peek of the next
   card and a "swipe" hint. On larger screens they keep their normal grid. */
.swipe-hint{display:none}
@media (max-width:760px){
	.wsdc-hscroll{
		display:flex;flex-wrap:nowrap;gap:var(--s-4);
		overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
		scroll-padding-inline:var(--gutter);
		margin-inline:calc(var(--gutter) * -1);
		padding:0 var(--gutter) .75rem;
		scrollbar-width:thin;
	}
	.wsdc-hscroll > *{flex:0 0 82%;scroll-snap-align:start}
	.wsdc-hscroll::-webkit-scrollbar{height:6px}
	.wsdc-hscroll::-webkit-scrollbar-thumb{background:var(--barley);border-radius:999px}
	.wsdc-hscroll::-webkit-scrollbar-track{background:rgba(0,0,0,.06)}
	.swipe-hint{display:flex;align-items:center;justify-content:flex-end;gap:.4rem;margin:0 0 .7rem;font-size:.8rem;font-weight:600;letter-spacing:.02em;color:var(--barley-dark)}
	.swipe-hint span{display:inline-block;animation:wsdcSwipeNudge 1.4s ease-in-out infinite}
	.feat-treat .swipe-hint{color:var(--barley-light)}
}
@keyframes wsdcSwipeNudge{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}
@media (prefers-reduced-motion:reduce){.swipe-hint span{animation:none}}
/* Force the reused grids into the horizontal scroller on phones. Two-class
   selectors so they beat the single-class base grid rules defined later on. */
@media (max-width:760px){
	.feat-treat__grid.wsdc-hscroll,
	.pillars__grid.wsdc-hscroll,
	.journey__steps.wsdc-hscroll{display:flex;gap:var(--s-4)}
}

/* ---------- Hero banner (full-bleed) ---------- */
.hero-banner{position:relative;min-height:clamp(580px,82vh,840px);display:grid;grid-template-rows:1fr auto;color:#fff;overflow:hidden;background:var(--mirage)}
.hero-banner::before{content:"";position:absolute;inset:0;z-index:0;background-image:linear-gradient(90deg,rgba(20,30,42,.94),rgba(20,30,42,.64) 55%,rgba(20,30,42,.36)),var(--hero-image,radial-gradient(140% 130% at 78% 22%,rgba(164,134,98,.22),rgba(20,30,42,.96)));background-size:cover;background-position:center}
.hero-banner__row{position:relative;z-index:1;display:flex;align-items:center}
.hero-banner__content{max-width:680px;padding-block:clamp(3rem,2rem + 5vw,6rem)}
.hero-banner__eyebrow{font-size:.8rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--barley);margin:0 0 var(--s-3)}
.hero-banner__title{font-family:var(--font-display);font-weight:500;font-size:clamp(2.6rem,1.5rem + 4.2vw,4.6rem);line-height:1.03;letter-spacing:-.01em;color:#fff;margin:0 0 var(--s-4)}
.hero-banner__title .accent{color:var(--barley)}
.hero-banner__lead{font-size:var(--fs-lead);color:rgba(255,255,255,.85);max-width:46ch;margin:0 0 var(--s-5)}
.hero-banner__actions{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-bottom:var(--s-6)}
.hero-banner__trust{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-5)}
.hero-banner__trust li{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:rgba(255,255,255,.85)}
.hero-banner__trust svg{width:18px;height:18px;color:var(--barley);flex:none}
.hero-banner__bar{position:relative;z-index:1;background:rgba(15,23,32,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-top:1px solid var(--hairline-light)}
.hero-banner__bar-inner{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-4);padding-block:var(--s-4)}
.hero-bar__item{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:inherit;border-radius:10px;padding:.35rem .5rem;margin:-.35rem -.5rem;transition:background .2s var(--ease)}
.hero-bar__item:hover{background:rgba(255,255,255,.08)}
.hero-bar__item:hover .hero-bar__value{color:var(--cream)}
.hero-bar__item svg{width:22px;height:22px;color:var(--barley);flex:none}
.hero-bar__text{display:block}
.hero-bar__label{display:block;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:.1rem}
.hero-bar__value{display:block;font-weight:600;font-size:.95rem;color:#fff;transition:color .2s var(--ease)}

/* Shared placeholder panels */
.ph{background:linear-gradient(135deg,rgba(164,134,98,.18),rgba(28,42,58,.10)),var(--cream);border:1px solid var(--hairline);border-radius:var(--radius);overflow:hidden}
.ph--dark{background:linear-gradient(135deg,rgba(164,134,98,.30),rgba(28,42,58,.65)),var(--mirage);border-color:var(--hairline-light)}
/* A panel with .has-photo and an inline --photo url renders the photograph in place of the placeholder gradient. */
.ph.has-photo{background:var(--photo) center/cover no-repeat;border-color:transparent}

.section-head{text-align:center;max-width:46ch;margin:0 auto var(--s-6)}
.section-head .eyebrow{justify-content:center}
.section-head h2{font-size:var(--fs-h1);margin-bottom:var(--s-3)}
.section-head p{color:var(--ink-muted)}
.on-dark .section-head p{color:var(--ink-on-dark)}

.link-arrow{font-weight:600;font-size:.9rem;display:inline-flex;align-items:center;gap:.35rem}
.link-arrow span{transition:transform .25s var(--ease)}
.link-arrow:hover span{transform:translateX(2px)}
.actions-row{display:flex;align-items:center;gap:var(--s-4);flex-wrap:wrap;margin-top:var(--s-4)}

/* ---------- Featured treatments (navy) ---------- */

/* ---------- Award-winning expertise (navy) ---------- */
.expertise{background:var(--mirage);color:#fff;padding-block:var(--section-y)}
.expertise__head{max-width:52ch;margin:0 auto var(--s-6);text-align:center}
.expertise__head .eyebrow{justify-content:center}
.eyebrow--light{color:var(--barley-light)}
.expertise__head h2{font-size:var(--fs-h1);color:#fff;margin-bottom:var(--s-3)}
.expertise__head p{color:rgba(255,255,255,.82)}
.expertise__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-4)}
.exp-card{display:flex;flex-direction:column;gap:.5rem;padding:var(--s-5);border:1px solid var(--hairline-light);border-radius:var(--radius);background:rgba(255,255,255,.03);transition:transform .3s var(--ease),background .3s var(--ease),border-color .3s var(--ease)}
.exp-card--feature{background:rgba(164,134,98,.14);border-color:var(--barley)}
.exp-card:hover{transform:translateY(-6px);background:rgba(164,134,98,.16);border-color:var(--barley)}
.exp-card__mark{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:rgba(164,134,98,.18);color:var(--barley-light);margin-bottom:var(--s-2);transition:background .3s var(--ease),color .3s var(--ease)}
.exp-card:hover .exp-card__mark{background:var(--barley);color:#fff}
.exp-card__mark svg{width:28px;height:28px}
.exp-card__title{font-family:var(--font-display);font-size:var(--fs-h3);color:#fff;margin:0}
.exp-card__lead{font-size:.8rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--barley-light);margin:0}
.exp-card__dentist{color:var(--barley-light);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;transition:color .2s var(--ease)}
.exp-card__dentist:hover{color:#fff}
.exp-card__body{color:rgba(255,255,255,.8);font-size:.97rem;margin:.25rem 0 0}
.exp-card .link-arrow{color:var(--barley-light);margin-top:auto;padding-top:var(--s-3)}
.exp-card:hover .link-arrow{color:#fff}
.exp-card .link-arrow span{transition:transform .25s var(--ease)}
.exp-card:hover .link-arrow span{transform:translateX(4px)}

/* ---------- Accreditation strip (refined, light) ---------- */
.accred{background:#fff;padding-block:var(--s-5);text-align:center;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.accred__label{font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-muted);margin:0 0 var(--s-3)}
.accred__marquee{--gap:clamp(2.2rem,1.4rem + 3vw,4.5rem);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)}
.accred__track{display:flex;gap:var(--gap);width:max-content;animation:accred-scroll 42s linear infinite}
.accred__marquee:hover .accred__track{animation-play-state:paused}
.accred__set{display:flex;align-items:center;gap:var(--gap);margin:0;padding:0;list-style:none}
.accred__item{flex:none;display:flex;align-items:center}
.accred__logo-img{height:clamp(46px,3.6vw,62px);width:auto;max-width:170px;object-fit:contain;opacity:.9;transition:opacity .25s var(--ease),transform .25s var(--ease)}
.accred__logo-img:hover{opacity:1;transform:scale(1.04)}
@keyframes accred-scroll{from{transform:translateX(0)}to{transform:translateX(calc(-50% - (var(--gap) / 2)))}}
@media (prefers-reduced-motion:reduce){.accred__track{animation:none;flex-wrap:wrap;justify-content:center;width:auto}.accred__set:last-child{display:none}}

/* ---------- What sets us apart (pillars) ---------- */
.pillars{padding-block:var(--section-y)}
/* The question heading runs to two lines, not five (Sean, 9 Oct 2026). */
.pillars .section-head{max-width:62rem}
.pillars .section-head h2{max-width:24ch;margin-inline:auto;text-wrap:balance}
.pillars__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-5)}
.pillar{display:flex;flex-direction:column;background:#fff;border:1px solid var(--hairline);border-radius:var(--radius);overflow:hidden;height:100%}
.pillar__media{aspect-ratio:16/9}
.pillar__copy{display:flex;flex-direction:column;gap:.6rem;padding:var(--s-5)}
.pillar__index{display:flex;align-items:center;gap:.65rem;font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--barley-dark);margin:0}
.pillar__index span{color:var(--ink-muted);font-weight:600}
.pillar__title{font-size:var(--fs-h3);margin:0;max-width:22ch}
.pillar__body{color:var(--ink-muted);margin:0}
.pillar .link-arrow{color:var(--barley-dark);margin-top:auto;padding-top:.35rem}

/* ---------- What we treat (navy) ---------- */
.treat{background:var(--mirage);color:#fff;padding-block:var(--section-y)}
.treat__cards{display:grid;grid-template-columns:1.5fr 1fr;grid-auto-rows:1fr;gap:var(--s-3)}
.treat-card{border:1px solid var(--hairline-light);border-radius:var(--radius);padding:var(--s-5);display:flex;flex-direction:column;gap:.5rem;min-height:0}
.treat-card__eyebrow{font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--barley)}
.treat-card__title{font-family:var(--font-display);font-size:var(--fs-h3);color:#fff;margin:.15rem 0}
.treat-card__body{color:var(--ink-on-dark);font-size:.95rem}
.treat-card .link-arrow{color:#fff;margin-top:auto;padding-top:var(--s-3)}
.treat-card__media{margin-top:var(--s-3);aspect-ratio:16/9}
.treat-card--featured{grid-row:span 2;display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4);align-items:center}
.treat-card--featured .treat-card__media{aspect-ratio:3/4;margin:0;height:100%}
.treat-card--featured .treat-card__copy{display:flex;flex-direction:column;gap:.5rem}

/* ---------- Google reviews ---------- */
.greviews{background:var(--cream);padding-block:var(--section-y)}
.greviews__head{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:var(--s-4) var(--s-5);margin-bottom:var(--s-6)}
.greviews__intro .eyebrow{margin-bottom:var(--s-2)}
.greviews__intro h2{font-size:var(--fs-h1);margin:0}
.greviews__badge{display:flex;align-items:center;gap:.85rem;background:#fff;border:1px solid var(--hairline);border-radius:var(--radius);padding:.75rem 1.1rem}
.greviews__glogo svg{width:30px;height:30px;display:block}
.greviews__badgetext{display:flex;flex-direction:column;gap:.15rem}
.greviews__score{display:flex;align-items:center;gap:.5rem;font-size:1.1rem;color:var(--mirage)}
.greviews__score strong{font-family:var(--font-display);font-size:1.5rem;font-weight:600;line-height:1}
.greviews__stars{display:inline-flex;gap:1px;color:#f5b301}
.grev-star{width:16px;height:16px}
.greviews__count{font-size:.8rem;color:var(--ink-muted)}
.greviews__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-4)}
.greviews__trustindex{margin-top:var(--s-3)}
.greview{display:flex;flex-direction:column;gap:.85rem;background:#fff;border:1px solid var(--hairline);border-radius:var(--radius);padding:var(--s-5);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.greview:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(28,42,58,.12)}
.greview__stars{display:inline-flex;gap:2px;color:#f5b301}
.greview__body{color:var(--ink);font-size:1rem;line-height:1.6;margin:0;flex:1}
.greview__by{display:flex;align-items:center;gap:.7rem;margin-top:auto}
.greview__avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--cream);color:var(--barley-dark);font-family:var(--font-display);font-size:1.15rem;flex:none}
.greview__meta{display:flex;flex-direction:column;line-height:1.3}
.greview__name{font-weight:600;color:var(--mirage);font-size:.95rem}
.greview__src{font-size:.78rem;color:var(--ink-muted)}

/* ---------- Clinicians (light) ---------- */
.team{padding-block:var(--section-y);background:var(--light-grey)}
.team__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-5) var(--s-4)}
/* Homepage dentists and therapists: 4 across, so 7 people read as 4 then 3 with
   every column the same width (the last cell in the second row stays empty). */
.team .team__grid--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1024px){.team .team__grid--4{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){.team .team__grid--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.team .team__grid--4{grid-template-columns:repeat(2,1fr);gap:var(--s-4) var(--s-3)}}
.team-card{text-align:center}
.team-card__media{display:block;position:relative;overflow:hidden;border-radius:var(--radius);margin-bottom:var(--s-4)}
.team-card__media::before{content:"";display:block;padding-top:134.6%}
.team-card__play{position:absolute;right:1rem;bottom:1rem;width:52px;height:52px;border-radius:50%;border:2px solid var(--barley);background:rgba(28,42,58,.35);display:grid;place-items:center}
.team-card__play::after{content:"";border-left:13px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:3px}
.team-card__name{font-family:var(--font-display);font-size:var(--fs-h3);margin:0}
.team-card__role{font-size:.85rem;color:var(--barley-dark);font-weight:600;margin:.1rem 0 .5rem}
.team-card__bio{font-size:.95rem;color:var(--ink-muted);max-width:34ch;margin:0 auto .75rem}
.team-card__social{display:flex;justify-content:center;gap:.85rem;color:var(--ink-muted)}
.team-card__social a:hover{color:var(--mirage)}

/* ---------- Testimonial (gold) ---------- */
.testi{background:var(--barley);color:#fff;padding-block:var(--section-y)}
.testi__inner{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-7);align-items:center}
.testi__media{position:relative;aspect-ratio:4/3}
.testi__media .team-card__play{border-color:#fff;background:rgba(255,255,255,.25)}
.testi__stars{color:#fff;letter-spacing:.2em;margin-bottom:var(--s-3)}
.testi__quote{font-family:var(--font-display);font-style:italic;font-size:clamp(1.4rem,1.2rem + .9vw,1.9rem);line-height:1.3;color:#fff;margin:0 0 var(--s-4)}
.testi__by{font-weight:600}
.testi__by span{display:block;font-weight:400;font-size:.9rem;color:rgba(255,255,255,.8)}

/* ---------- Support: nervous or dissatisfied (light) ---------- */
.reassure{padding-block:var(--section-y)}
.reassure__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-4)}
.reassure-card{display:flex;flex-direction:column;gap:.6rem;background:#fff;border:1px solid var(--hairline);border-radius:var(--radius);padding:var(--s-5)}
.reassure-card__icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--cream);color:var(--barley-dark);margin-bottom:var(--s-2)}
.reassure-card__icon svg{width:26px;height:26px}
.reassure-card__title{font-size:var(--fs-h3);margin:0}
.reassure-card__body{color:var(--ink-muted);font-size:.97rem;margin:0}
.reassure-card .link-arrow{color:var(--barley-dark);margin-top:auto;padding-top:.35rem}

/* ---------- Treatment journey (numbered steps) ---------- */
.journey{padding-block:var(--section-y);background:var(--cream)}
.journey__steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-5)}
.jstep{display:flex;flex-direction:column;background:#fff;border:1px solid var(--hairline);border-radius:var(--radius);overflow:hidden;height:100%}
.jstep__media{position:relative;aspect-ratio:16/10}
.jstep__num{position:absolute;left:1rem;top:1rem;width:46px;height:46px;border-radius:50%;background:var(--barley);color:#fff;font-family:var(--font-display);font-size:1.4rem;line-height:1;display:grid;place-items:center;box-shadow:0 4px 14px rgba(28,42,58,.25)}
.jstep__copy{display:flex;flex-direction:column;gap:.5rem;padding:var(--s-5)}
.jstep__label{font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);margin:0}
.jstep__title{font-size:var(--fs-h3);margin:0}
.jstep__text{color:var(--ink-muted);font-size:.97rem;margin:0}
.jstep .link-arrow{color:var(--barley-dark);margin-top:auto;padding-top:.35rem}

/* ---------- Hover interactions (pillars, steps, support) ---------- */
.pillar,.jstep,.reassure-card{transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.pillar:hover,.jstep:hover,.reassure-card:hover{transform:translateY(-6px);box-shadow:0 18px 42px rgba(28,42,58,.15);border-color:var(--barley-light)}
.pillar__media,.jstep__media{transition:transform .55s var(--ease)}
.pillar:hover .pillar__media,.jstep:hover .jstep__media{transform:scale(1.06)}
.jstep__num{transition:transform .3s var(--ease),background .3s var(--ease)}
.jstep:hover .jstep__num{transform:scale(1.08);background:var(--barley-dark)}
.reassure-card__icon{transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease)}
.reassure-card:hover .reassure-card__icon{background:var(--barley);color:#fff;transform:rotate(-4deg) scale(1.05)}
.pillar .link-arrow span,.jstep .link-arrow span,.reassure-card .link-arrow span{transition:transform .25s var(--ease)}
.pillar:hover .link-arrow span,.jstep:hover .link-arrow span,.reassure-card:hover .link-arrow span{transform:translateX(4px)}
@media (prefers-reduced-motion:reduce){
	.pillar,.jstep,.reassure-card,.pillar__media,.jstep__media,.reassure-card__icon{transition:none}
	.pillar:hover,.jstep:hover,.reassure-card:hover{transform:none}
	.pillar:hover .pillar__media,.jstep:hover .jstep__media{transform:none}
}

/* ---------- Newsletter band (gold) ----------
   Gravity Form 11. Every rule is scoped to .news-band__form and written to
   beat Gravity's own theme CSS, so the form reads as part of the band
   whatever fields the clinic adds: white pill inputs, white labels and a
   navy pill button, matching .btn--primary. */
.news-band{background:var(--barley);color:#fff;padding-block:var(--section-y);text-align:center}
.news-band h2{font-size:var(--fs-h1);color:#fff;margin-bottom:var(--s-3)}
.news-band p{color:rgba(255,255,255,.9);max-width:48ch;margin:0 auto var(--s-5)}
.news-band .news-band__eyebrow{justify-content:center;color:#fff;margin-bottom:var(--s-3)}
.news-band .news-band__eyebrow .gold-rule{background:rgba(255,255,255,.7)}
/* A matching rule after the label so the eyebrow sits centred (go-live check, 9 Oct 2026). */
.news-band .news-band__eyebrow::after{content:"";display:inline-block;width:56px;height:2px;margin-left:.75rem;background:rgba(255,255,255,.7);flex:none}
.news-band__form{max-width:680px;margin-inline:auto;text-align:left}
.news-band__form .gform_wrapper,.news-band__form .gform_wrapper form{margin:0}
.news-band__form .gform_heading,.news-band__form .gform_required_legend{display:none}
.news-band__form .gform_wrapper .gform_fields{display:grid !important;grid-template-columns:1fr !important;gap:var(--s-3) !important;margin:0;padding:0;list-style:none}
.news-band__form .gform_wrapper .gfield{grid-column:1 / -1 !important;margin:0 !important;padding:0 !important}
@media (min-width:600px){
	.news-band__form .gform_wrapper .gform_fields{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
	.news-band__form .gform_wrapper .gfield--width-half{grid-column:span 1 !important}
}
.news-band__form .gform_wrapper .gfield_label,
.news-band__form .gform_wrapper .gform-field-label:not(.gform-field-label--type-inline),
.news-band__form .gform_wrapper legend.gfield_label{display:block;font-size:.72rem !important;font-weight:600 !important;letter-spacing:.12em;text-transform:uppercase;color:#fff !important;margin:0 0 .4rem !important;padding:0}
.news-band__form .gform_wrapper .gfield_required{color:rgba(255,255,255,.85) !important;margin-left:.2rem}
.news-band__form .gform_wrapper .gfield_required .gfield_required_text{font-size:.7rem;text-transform:none;letter-spacing:0}
.news-band__form .gform_wrapper .ginput_complex{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3) !important;margin:0 !important}
.news-band__form .gform_wrapper .ginput_complex>span{margin:0 !important;padding:0 !important;width:auto !important;max-width:none !important;flex:none !important}
.news-band__form .gform_wrapper .ginput_complex .gform-field-label--type-sub,
.news-band__form .gform_wrapper .ginput_complex label{font-size:.72rem;color:rgba(255,255,255,.8) !important;margin-top:.3rem}
.news-band__form .gform_wrapper input[type=text],
.news-band__form .gform_wrapper input[type=email],
.news-band__form .gform_wrapper input[type=tel],
.news-band__form .gform_wrapper select,
.news-band__form .gform_wrapper textarea{width:100% !important;box-sizing:border-box;font:inherit !important;font-size:var(--fs-body) !important;line-height:1.3 !important;color:var(--mirage) !important;background:#fff !important;border:1.5px solid transparent !important;border-radius:999px !important;padding:.85rem 1.25rem !important;min-height:0 !important;height:auto !important;box-shadow:0 8px 22px -16px rgba(28,42,58,.5) !important;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
.news-band__form .gform_wrapper textarea{border-radius:var(--radius-sm) !important;min-height:96px !important}
.news-band__form .gform_wrapper input::placeholder,.news-band__form .gform_wrapper textarea::placeholder{color:rgba(28,42,58,.5)}
.news-band__form .gform_wrapper input:focus,.news-band__form .gform_wrapper select:focus,.news-band__form .gform_wrapper textarea:focus{outline:0 !important;border-color:var(--mirage) !important;box-shadow:0 0 0 3px rgba(255,255,255,.45) !important}
.news-band__form .gform_wrapper .gfield_description,
.news-band__form .gform_wrapper .gfield_consent_description{font-size:.8rem !important;color:rgba(255,255,255,.8) !important;padding:.3rem 0 0 !important;border:0 !important;background:none !important;max-height:none !important;overflow:visible !important}
.news-band__form .gform_wrapper .gchoice,
.news-band__form .gform_wrapper .ginput_container_consent{display:flex !important;align-items:flex-start;gap:.6rem !important}
.news-band__form .gform_wrapper .gchoice label,
.news-band__form .gform_wrapper .gfield_consent_label{font-size:.85rem !important;font-weight:400 !important;line-height:1.5;letter-spacing:0 !important;text-transform:none !important;color:rgba(255,255,255,.92) !important;margin:0 !important}
.news-band__form .gform_wrapper .gfield_consent_label a,.news-band__form .gform_wrapper .gchoice label a{color:#fff;text-decoration:underline;text-underline-offset:2px}
.news-band__form .gform_wrapper input[type=checkbox],.news-band__form .gform_wrapper input[type=radio]{width:18px;height:18px;flex:none;margin:.15rem 0 0 !important;accent-color:var(--mirage)}
.news-band__form .gform_wrapper .gform_footer,
.news-band__form .gform_wrapper .gform-footer{display:flex;justify-content:center;margin:var(--s-5) 0 0 !important;padding:0 !important}
.news-band__form .gform_wrapper .gform_footer input[type=submit],
.news-band__form .gform_wrapper .gform_footer button,
.news-band__form .gform_wrapper .gform-footer input[type=submit],
.news-band__form .gform_wrapper .gform-footer button,
.news-band__form .gform_wrapper .gform_button{appearance:none;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-body) !important;font-weight:600 !important;font-size:.9375rem !important;line-height:1 !important;padding:.95rem 2.25rem !important;min-height:0 !important;border-radius:999px !important;border:1.5px solid var(--mirage) !important;background:var(--mirage) !important;color:#fff !important;cursor:pointer;box-shadow:none !important;transition:box-shadow .25s var(--ease),transform .2s var(--ease)}
.news-band__form .gform_wrapper .gform_footer input[type=submit]:hover,
.news-band__form .gform_wrapper .gform-footer input[type=submit]:hover,
.news-band__form .gform_wrapper .gform_button:hover{box-shadow:0 12px 26px -14px rgba(28,42,58,.6) !important;transform:translateY(-1px)}
.news-band__form .gform_wrapper .gform_button:focus-visible{outline:2px solid #fff !important;outline-offset:3px}
.news-band__form .gform_wrapper .gform_validation_errors{background:#fff !important;border:0 !important;border-radius:var(--radius-sm) !important;padding:.8rem 1rem !important;margin:0 0 var(--s-4) !important;box-shadow:none !important}
.news-band__form .gform_wrapper .gform_validation_errors h2{font-size:.9rem !important;color:#8A2B21 !important;margin:0 !important;font-family:var(--font-body) !important}
.news-band__form .gform_wrapper .validation_message,.news-band__form .gform_wrapper .gfield_validation_message{font-size:.8rem !important;color:#fff !important;background:rgba(138,43,33,.55) !important;border:0 !important;border-radius:6px;padding:.3rem .6rem !important;margin-top:.4rem !important}
.news-band__form .gform_wrapper .gfield_error input{border-color:#8A2B21 !important}
.news-band__form .gform_confirmation_message{text-align:center;font-size:var(--fs-lead);color:#fff}
.news-band__form .gform_ajax_spinner{margin-left:.6rem}
@media (prefers-reduced-motion:reduce){.news-band__form .gform_wrapper .gform_button:hover{transform:none}}

/* ---------- Latest news (cream) ---------- */
.news{background:var(--cream);padding-block:var(--section-y)}
.news__head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-4);margin-bottom:var(--s-5)}
.news__head h2{font-size:var(--fs-h1);max-width:16ch;margin:0}
.news__head p{color:var(--ink-muted);margin:.5rem 0 0}
.news__track{display:flex;gap:var(--s-4);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:var(--s-3);-webkit-overflow-scrolling:touch}
.news__track::-webkit-scrollbar{height:0}
.news-card{flex:0 0 clamp(280px,30%,360px);scroll-snap-align:start;background:#fff;border:1px solid var(--hairline);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.news-card__media{aspect-ratio:16/10}
.news-card__body{padding:var(--s-4)}
.news-card__meta{display:flex;gap:.6rem;font-size:.8rem;color:var(--ink-muted);margin-bottom:.5rem}
.news-card__meta span:first-child{border:1px solid var(--hairline);border-radius:999px;padding:.15rem .6rem}
.news-card__title{font-size:var(--fs-h3);margin:0 0 .5rem}
.news-card__excerpt{font-size:.95rem;color:var(--ink-muted);margin-bottom:var(--s-3)}
.news-card .link-arrow{color:var(--barley-dark)}
.news__nav{display:flex;gap:.6rem;justify-content:flex-end;margin-top:var(--s-4)}
.news__nav button{width:44px;height:44px;border-radius:50%;border:1px solid var(--hairline);background:#fff;display:grid;place-items:center;color:var(--mirage)}
.news__nav button:hover{background:var(--mirage);color:#fff;border-color:var(--mirage)}

/* ---------- FAQ (white) ---------- */
.faq{padding-block:var(--section-y)}
.faq__inner{display:grid;grid-template-columns:1fr 1.5fr;gap:var(--s-7);align-items:start}
.faq__intro h2{font-size:var(--fs-h1);margin-bottom:var(--s-3)}
.faq__intro p{color:var(--ink-muted);margin-bottom:var(--s-4)}
.faq__list{display:grid;gap:var(--s-3)}
.faq-item{border:1px solid var(--hairline);border-radius:var(--radius);background:#fff}
.faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--s-3);padding:var(--s-4);font-weight:600;font-size:1.05rem}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:1.4rem;font-weight:400;color:var(--barley);transition:transform .25s var(--ease);line-height:1}
.faq-item[open] summary::after{content:"\00d7"}
.faq-item__answer{padding:0 var(--s-4) var(--s-4);color:var(--ink-muted)}

/* ---------- Home responsive ---------- */
@media (max-width:900px){
	.hero-banner__bar-inner{grid-template-columns:1fr 1fr;gap:var(--s-3) var(--s-4)}
	.feat-treat__inner,.treat__cards,.testi__inner,.faq__inner{grid-template-columns:1fr}
	.feat-treat__media{order:-1}
	.pillars__grid{grid-template-columns:1fr 1fr}
	.greviews__head{grid-template-columns:1fr}
	.greviews__grid{grid-template-columns:1fr}
	.treat-card--featured{grid-row:auto;grid-template-columns:1fr}
	.treat-card--featured .treat-card__media{aspect-ratio:16/9;order:-1}
	.team__grid{grid-template-columns:1fr 1fr}
	.reassure__grid{grid-template-columns:1fr}
	.journey__steps{grid-template-columns:1fr}
	.expertise__grid{grid-template-columns:1fr}
	.news__head{flex-direction:column;align-items:flex-start}
}
@media (max-width:600px){
	.hero-banner__bar-inner{grid-template-columns:1fr}
	.pillars__grid{grid-template-columns:1fr}
	.team__grid{grid-template-columns:1fr}
	.news-band__form .gform_wrapper .ginput_complex{grid-template-columns:1fr}
	.news-band__form .gform_wrapper .gform_button{width:100%}
}

.feat-treat{background:var(--mirage);color:#fff;padding-block:var(--section-y)}
.feat-treat .section-head h2,.feat-treat .section-head p{color:#fff}
.feat-treat .section-head p{color:rgba(255,255,255,.75)}
.feat-treat__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-4,1.5rem)}
.ft-card{display:flex;flex-direction:column;background:rgba(255,255,255,.04);border:1px solid var(--hairline-light);border-radius:var(--radius,12px);overflow:hidden;transition:transform .25s var(--ease),border-color .25s var(--ease),background .25s var(--ease)}
.ft-card:hover{transform:translateY(-4px);border-color:var(--barley);background:rgba(255,255,255,.07)}
.ft-card__media{position:relative;display:block;aspect-ratio:3/2;background-image:var(--photo);background-size:cover;background-position:center;background-color:rgba(255,255,255,.06)}
.ft-card__media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(28,42,58,.55),transparent 55%)}
.ft-card__tag{position:absolute;left:.85rem;top:.85rem;z-index:1;font-size:.75rem;font-weight:600;letter-spacing:.04em;background:var(--barley);color:var(--mirage);border-radius:999px;padding:.3rem .7rem}
.ft-card__popular{position:absolute;right:.85rem;top:.85rem;z-index:1;display:inline-flex;align-items:center;font-size:.75rem;font-weight:700;letter-spacing:.04em;background:#fff;color:var(--mirage);border-radius:999px;padding:.3rem .7rem;box-shadow:0 2px 10px rgba(28,42,58,.22)}
.ft-card__body{display:flex;flex-direction:column;gap:.4rem;padding:1.2rem 1.3rem 1.4rem}
.ft-card__name{font-family:var(--font-display);font-size:1.35rem;line-height:1.2;color:#fff}
.ft-card__desc{font-size:.9rem;line-height:1.5;color:rgba(255,255,255,.7)}
.ft-card__more{margin-top:.3rem;font-size:.82rem;font-weight:500;color:var(--barley)}
@media (max-width:900px){.feat-treat__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.feat-treat__grid{grid-template-columns:1fr}}

/* Real results: dynamic before/after showcase (replaces the old testimonial).
   Reuses the treatment .td-ba-sec, which is cream; the homepage wants the brand
   white here, so override the background. */
.home-cases{padding-block:var(--s-7,4rem);background:var(--white)}
.home-cases__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-4,1.5rem)}
.hc-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--hairline,rgba(28,42,58,.12));border-radius:var(--radius,12px);overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease)}
.hc-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px -22px rgba(28,42,58,.42);border-color:var(--barley,#A48662)}
.hc-card__media{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#f4f1ec}
.hc-card__media img{width:100%;height:100%;object-fit:contain;display:block}
.hc-card__tag{position:absolute;left:.75rem;top:.75rem;background:rgba(28,42,58,.85);color:#fff;font-size:.75rem;text-transform:uppercase;letter-spacing:.07em;padding:.25rem .6rem;border-radius:999px}
.hc-card__body{display:flex;flex-direction:column;gap:.3rem;padding:1.1rem 1.2rem 1.3rem}
.hc-card__eyebrow{font-size:.75rem;text-transform:uppercase;letter-spacing:.07em;color:var(--barley,#A48662)}
.hc-card__title{font-family:var(--font-display,Georgia,serif);font-size:1.15rem;line-height:1.25;color:var(--mirage,#1C2A3A)}
.hc-card__by{font-size:.82rem;color:var(--ink-muted,rgba(28,42,58,.65))}
.home-cases__foot{display:flex;flex-wrap:wrap;align-items:center;gap:1.25rem 2rem;justify-content:center;margin-top:var(--s-5,2rem)}

@media (max-width:900px){.home-cases__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.home-cases__grid{grid-template-columns:1fr}}

/* Find-us map on the homepage. The td-map component and its lazy-load facade
   are shared with treatment pages; these rules are duplicated here so the map
   is styled on the homepage without loading the whole treatment stylesheet. */
.td-map{padding-block:var(--section-y);background:var(--mirage);color:#fff}
.td-map .td-eyebrow{color:var(--barley-light)}
.td-map .gold-rule{background:var(--barley-light)}
.td-map .btn--secondary{border-color:rgba(255,255,255,.5);color:#fff;background:transparent}
.td-map .btn--secondary:hover{background:rgba(255,255,255,.12);border-color:#fff}
.td-map__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(2rem, 1rem + 3vw, 4rem);align-items:center}
.td-map__heading{font-family:var(--font-display);font-weight:500;font-size:var(--fs-h2);line-height:1.15;margin:var(--s-2) 0 var(--s-3);color:#fff}
.td-map__sub{color:rgba(255,255,255,.82);font-size:var(--fs-body);margin:0 0 var(--s-4);max-width:48ch}
.td-map__facts{margin:0 0 var(--s-4);display:grid;gap:var(--s-3)}
.td-map__facts div{display:grid;gap:.2rem}
.td-map__facts dt{font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--barley-light)}
.td-map__facts dd{margin:0;color:rgba(255,255,255,.9);font-size:var(--fs-body);line-height:1.6}
.td-map__facts dd a{color:#fff;text-decoration:none}
.td-map__facts dd a:hover{color:var(--barley-light)}
.td-map__actions{display:flex;gap:var(--s-3);flex-wrap:wrap}
.td-map__embed{position:relative;aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.35)}
.td-map__embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.td-map__facade{display:grid;place-items:center;background:linear-gradient(160deg,#22344a,var(--mirage))}
.td-map__placeholder{text-align:center;color:#fff;padding:var(--s-5);max-width:34ch}
.td-map__placeholder svg{width:44px;height:44px;color:var(--barley-light);margin-bottom:var(--s-3)}
.td-map__placeholder-addr{font-size:var(--fs-body);color:rgba(255,255,255,.9);margin:0 0 var(--s-4)}
.td-map__placeholder-note{font-size:.75rem;color:rgba(255,255,255,.6);margin:var(--s-3) 0 0}
.td-map__load{cursor:pointer;border:0}
@media (max-width:900px){
	.td-map__grid{grid-template-columns:1fr}
	.td-map__embed{aspect-ratio:16/11}
}
@media (max-width:520px){
	.td-map__actions{flex-direction:column;align-items:stretch}
	.td-map__actions .btn{width:100%;justify-content:center}
}

/* Ask a Dentist: portrait video FAQ under Our dentists.
   Sticky portrait player beside a searchable question list. The video iframe is
   loaded only when a question is chosen (see main.js). */
.ask-dentist{padding-block:var(--section-y);background:var(--cream)}
.ask-dentist .section-head{margin-bottom:var(--s-5)}
.ad-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(1.5rem,1rem + 2vw,3rem);align-items:start}
.ad-player{position:sticky;top:96px}
.ad-shell{position:relative;aspect-ratio:9/16;max-width:400px;margin-inline:auto;border-radius:var(--radius);overflow:hidden;background:linear-gradient(160deg,#22344a,var(--mirage));box-shadow:0 24px 60px rgba(28,42,58,.28)}
.ad-shell iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ad-facade{position:absolute;inset:0;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s-3);padding:var(--s-5);border:0;background:transparent;color:#fff;cursor:pointer;text-align:center;font:inherit}
.ad-facade__ring{width:72px;height:72px;border-radius:50%;background:var(--barley);color:#fff;display:grid;place-items:center;transition:transform .2s var(--ease),background .2s var(--ease)}
.ad-facade__ring svg{width:26px;height:26px;margin-left:3px}
.ad-facade:hover .ad-facade__ring,.ad-facade:focus-visible .ad-facade__ring{transform:scale(1.07);background:var(--barley-light);color:var(--mirage)}
.ad-facade__q{font-family:var(--font-display);font-weight:500;font-size:1.3rem;line-height:1.3;max-width:20ch}
.ad-facade__hint{font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--barley-light)}
.ad-facade:focus-visible{outline:3px solid var(--barley-light);outline-offset:-4px}
.ad-qlist{display:flex;flex-direction:column;gap:var(--s-3);min-width:0}
.ad-search{position:relative;display:flex;align-items:center}
.ad-search svg{position:absolute;left:15px;width:18px;height:18px;color:var(--ink-muted);pointer-events:none}
.ad-search input{width:100%;min-width:0;-webkit-appearance:none;appearance:none;box-sizing:border-box;padding:.8rem 1rem .8rem 2.7rem;border:1px solid var(--hairline);border-radius:999px;font:inherit;font-size:.95rem;line-height:1.4;background:#fff;color:var(--ink)}
/* Safari renders type=search with a fixed-height native control that can overlap
   the list below it; strip the native decorations so it sizes like any input. */
.ad-search input::-webkit-search-decoration,
.ad-search input::-webkit-search-cancel-button,
.ad-search input::-webkit-search-results-button{-webkit-appearance:none;appearance:none}
.ad-search input:focus{outline:2px solid var(--barley);outline-offset:1px;border-color:transparent}
.ad-list{list-style:none;margin:0;padding:4px;display:flex;flex-direction:column;gap:.5rem;max-height:min(72vh,660px);overflow:auto;overscroll-behavior:contain}
.ad-list li{margin:0}
.ad-q{width:100%;text-align:left;background:#fff;color:var(--ink);padding:.7rem .95rem;border-radius:12px;cursor:pointer;font:inherit;font-size:.95rem;line-height:1.35;border:1px solid var(--hairline);transition:transform .15s var(--ease),background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease)}
.ad-q:hover{transform:translateY(-1px);border-color:var(--barley);background:var(--barley);color:#fff}
.ad-q.is-active{background:var(--mirage);color:#fff;border-color:var(--mirage)}
.ad-q:focus-visible{outline:2px solid var(--barley);outline-offset:2px}
.ad-empty{color:var(--ink-muted);font-size:.9rem;padding:.25rem 0}
@media (max-width:900px){
	.ad-grid{grid-template-columns:1fr;gap:var(--s-4)}
	.ad-player{position:static}
	.ad-shell{max-width:300px}
	.ad-list{max-height:min(60vh,520px)}
}

/* Philosophy / positioning band: an image paired with an editorial statement,
   the closing line pulled out as an emphasised quote. */
.home-ethos{padding-block:var(--section-y);background:var(--cream,#F4F0EA)}
.home-ethos__grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(2rem,1.2rem + 3vw,4.5rem);align-items:center}
.home-ethos__media{border-radius:var(--radius,16px);min-height:440px;background-image:var(--ethos-image);background-size:cover;background-position:center;box-shadow:0 26px 60px -30px rgba(20,30,42,.55)}
.home-ethos__title{font-family:var(--font-display);font-weight:500;font-size:var(--fs-h2);line-height:1.12;margin:var(--s-2) 0 var(--s-4);color:var(--heading)}
.home-ethos__lead{font-size:1.02rem;line-height:1.7;color:var(--ink);font-weight:500;margin:0 0 var(--s-4);max-width:60ch}
.home-ethos__text{font-size:1.02rem;color:var(--ink-muted);line-height:1.7;margin:0 0 var(--s-3);max-width:60ch}
.home-ethos__quote{margin:var(--s-4) 0 0;padding:var(--s-2) 0 var(--s-2) var(--s-4);border-left:3px solid var(--barley,#A48662);font-family:var(--font-display);font-size:1.3rem;line-height:1.4;color:var(--mirage);font-style:italic}
@media (max-width:900px){
	.home-ethos__grid{grid-template-columns:1fr}
	.home-ethos__media{min-height:260px;order:-1}
}
