/* Shared compact rhythm. Loaded last for every page, including product and journal templates. */
:root{--page-space:30px;--content-space:18px;--column-space:36px}
body :is(main,.shell) :is(.section,.svc-section,.home-section,.home-team-band,.home-booking,
.team-doctors,.team-nursing,.team-appointment,.team-support,.contact-locations,.contact-enquiry,
.shop-hero,.shop-catalogue,.shop-advice,.shop-product-detail,.shop-related,.routine-builder,
.support-hero,.support-help,.policy-heading,.policy-layout,.advertising-intro,.advertising-section,
.advertising-further,.price-hero,.price-layout,.price-help,.ed-intro,.ed-next,.svc-contact,
.svc-directory-intro,.svc-directory-help){padding-block:var(--page-space)}
/* Override the earlier service-only rhythm with the same site-wide spacing. */
body :is(main,.shell):has(> #doctor-led)>:is(.section,.svc-section){padding-block:var(--page-space)}
body :is(main,.shell) :is(.doctor-led-section,.understanding-section,.consultation-section,.booking-options,.enquire-grid,
.team-nursing,.team-support,.team-appointment,.contact-enquiry,.home-booking,.shop-advice,
.policy-layout,.price-layout,.price-help,.advertising-section,.support-layout,.ed-reading-layout){column-gap:var(--column-space);row-gap:var(--content-space)}
body :is(main,.shell):has(> #doctor-led) :is(.doctor-led-section,.understanding-section,.consultation-section,.booking-options,.enquire-grid){column-gap:var(--column-space);row-gap:var(--content-space)}
body :is(main,.shell) :is(.svc-section-top,.journal-heading,.skincare-heading,.section-heading,.home-section-head,.contact-section-heading){margin-bottom:var(--content-space)}
body :is(main,.shell):has(> #doctor-led) :is(.svc-section-top,.journal-heading,.skincare-heading){margin-bottom:var(--content-space)}
body :is(main,.shell) .editorial-film{margin-top:16px}
body :is(main,.shell) .editorial-film figcaption{margin-top:8px}
body :is(main,.shell) :is(.education-topic>summary,.faq-content summary,.svc-disclosure summary,.journey-step summary,.price-category>summary){padding-block:14px;min-height:48px;line-height:1.5}
body :is(main,.shell) :is(.education-topic>summary,.faq-content summary):after{top:50%;transform:translateY(-50%)}
body :is(main,.shell) :is(.education-topic .educational-content,.faq-content .answer,.svc-disclosure .answer){padding-top:0;padding-bottom:14px;line-height:1.7}
body :is(main,.shell) :is(.educational-content,.answer) p{margin-block:0 12px;line-height:1.7}
body :is(main,.shell) :is(.educational-content,.answer) p:last-child{margin-bottom:0}
body :is(main,.shell) .consultation-content .journey-step p{margin-bottom:14px;line-height:1.7}
body :is(main,.shell) .journey-support{margin-top:14px}
body :is(main,.shell) .appointment-facts{margin-top:12px}
body :is(main,.shell) .appointment-facts>div{padding-block:10px}
body :is(main,.shell) .doctor-led-copy>p{margin-bottom:12px}
body :is(main,.shell) .svc-option{padding-block:18px}
body :is(main,.shell) .svc-option :is(h3,p){margin-bottom:12px}
body :is(main,.shell) .svc-directory-group{padding-top:22px}
body :is(main,.shell) .svc-directory-help{margin-top:20px}
body :is(main,.shell) :is(.booking-filters,.master-area-heading){margin-top:20px;margin-bottom:14px}
body :is(main,.shell) .home-hero{padding-block:30px;gap:28px}
body :is(main,.shell) .home-skincare{padding-top:30px;margin-bottom:30px;row-gap:20px}
body :is(main,.shell) .home-service{padding-block:24px}
body :is(main,.shell) .home-source-faq details{padding-block:10px}
body :is(main,.shell) .home-source-faq summary{display:flex;align-items:center;min-height:48px}
body :is(main,.shell) .home-source-faq details>div{padding-top:6px}
body :is(main,.shell) .home-service :is(h3,p){margin-bottom:14px}
body :is(main,.shell) .shop-quiz{padding-block:24px;margin-bottom:24px}
body :is(main,.shell) .ed-next{margin-block:28px 20px}
body :is(main,.shell) .ed-reading-layout{margin-bottom:30px}
body :is(main,.shell) .ed-prose section{padding-bottom:16px;margin-bottom:18px}
body :is(main,.shell) :is(.ed-prose h2,.support-copy h2,.policy-section h2){margin-bottom:16px}
body :is(main,.shell) .ed-article-header{margin-block:20px 24px}
body :is(main,.shell) .ed-article-photo{margin-bottom:24px}
body :is(main,.shell) .ed-grid{row-gap:28px}
body :is(main,.shell) .ed-card-copy{padding-top:14px}
body :is(main,.shell) .ed-featured{gap:28px;padding-bottom:24px}
body :is(main,.shell) .support-photo{margin-bottom:24px}
body :is(main,.shell) .support-copy section{padding-block:18px}
body :is(main,.shell) .policy-section{margin-top:20px;padding-top:20px}
body :is(main,.shell) :is(.policy-prose p,.ed-prose p){margin-bottom:14px}
body :is(main,.shell) .contact-clinic-copy{padding-top:16px}
body :is(main,.shell) .contact-enquiry-copy>p{margin-block:16px}
body :is(main,.shell) .skincare-note{margin-top:20px}
body :is(main,.shell) .journal-article img{margin-bottom:16px}
body :is(main,.shell) .enquiry-story-copy>p{margin-top:14px}
body :is(main,.shell) #preview-form :is(.field-hint,.next-step){margin-bottom:16px}
body :is(main,.shell) #preview-form label{margin-bottom:16px}
body .shell .card{padding-block:24px}
body .shell .pad{padding-top:20px}
body .shell .lede{margin-bottom:14px}
body footer{padding-top:30px}
@media(max-width:760px){
 :root{--page-space:22px;--content-space:16px;--column-space:20px}
 body :is(main,.shell) .home-hero{padding-block:22px;gap:20px}
 body :is(main,.shell) .home-skincare{padding-top:22px;margin-bottom:22px}
 body :is(main,.shell) .home-service{padding-block:18px}
 body :is(main,.shell) :is(.education-topic>summary,.faq-content summary,.svc-disclosure summary,.journey-step summary,.price-category>summary){padding-block:12px;min-height:48px}
 body :is(main,.shell) .editorial-film{margin-top:14px}
 body :is(main,.shell) .ed-featured{gap:0}
 body :is(main,.shell) .ed-grid{row-gap:22px}
 body :is(main,.shell) .ed-reading-layout{gap:22px}
 body :is(main,.shell) .shop-quiz{padding-block:20px;margin-bottom:22px}
 body :is(main,.shell) .enquiry-story{min-height:380px}
 body .shell .card{padding-block:20px}
 body footer{padding-top:24px}
}

/* Appointment options are visible across the page, with a direct booking action. */
body :is(main,.shell) .booking-options{display:block}
body :is(main,.shell) .booking-options-heading h2{margin-bottom:12px}
body :is(main,.shell) .booking-options-heading>p:last-child{margin-bottom:20px;max-width:70ch}
body :is(main,.shell) .booking-options-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
body :is(main,.shell) .booking-appointment{padding-block:16px;border-top:1px solid var(--line);scroll-margin-top:130px;min-width:0}
body :is(main,.shell) .booking-appointment:only-child{grid-column:1/-1}
body :is(main,.shell) .booking-appointment h3{font:500 16px/1.5 var(--sans);margin:0 0 6px}
body :is(main,.shell) .booking-appointment p{margin:0 0 6px;font-size:13px}
body :is(main,.shell) .booking-clinic-links{gap:12px 24px}
body :is(main,.shell) .booking-clinic-links a{display:inline-flex;align-items:center;min-height:44px;font-size:13px}
body :is(main,.shell) .booking-options-actions{display:flex;align-items:center;flex-wrap:wrap;gap:14px 24px;margin-top:16px}
@media(max-width:760px){
 body :is(main,.shell) .booking-options-list{grid-template-columns:minmax(0,1fr)}
 body :is(main,.shell) .booking-options-actions>.button{width:100%;justify-content:center}
}

/* Keep the stock-image caption legible over light clinical photography. */
body .consultation-credit{right:auto;max-width:calc(100% - 40px);padding:6px 9px;background:rgba(48,28,32,.8);font-size:10px;line-height:1.5;letter-spacing:0;text-shadow:none}

/* v155: shared reading scale for every template. Important declarations keep
   older component rules from overriding the site-wide typography contract. */
:root{--reading-size:16px;--title-size:clamp(48px,4.5vw,64px);--section-size:clamp(36px,3.1vw,44px);--small-heading:22px;--accordion-size:16px;--paragraph-gap:14px}
body :is(main,.shell) h1{font-size:var(--title-size)!important;line-height:1.08!important;letter-spacing:-.6px!important}
body :is(main,.shell) h2:not(.ed-contents h2,.price-sidebar h2,.policy-sidebar h2,.advertising-further h2,.ed-card h2,.ed-featured h2,.price-category>summary h2){font-size:var(--section-size)!important;line-height:1.12!important;letter-spacing:-.4px!important}
body :is(main,.shell) h3:not(.shop-product-description h3){font-size:var(--small-heading)!important;line-height:1.25!important;letter-spacing:normal!important}
body :is(main,.shell) h4:not(.policy-section h4){font-size:20px!important;line-height:1.3!important}
body :is(main,.shell) :is(p,li,dd,address,blockquote,.answer,.educational-content,.ed-prose,.lede,.od){font-size:var(--reading-size)!important;line-height:1.5!important;font-weight:400}
body :is(main,.shell) p:not(.eyebrow){margin-bottom:var(--paragraph-gap)}
body :is(main,.shell) :is(.eyebrow,.skincare-brand){font-size:11px!important;line-height:1.5!important}
body :is(main,.shell) :is(figcaption,.field-hint,.quiet,.privacy,.next-step,.disc,.form-note,.home-medical-note,.home-service-note,.skincare-note,.svc-options-note,.image-credit,.consultation-credit,.ed-meta){font-size:13px!important;line-height:1.5!important}
body :is(main,.shell) summary{font-size:var(--accordion-size)!important;line-height:1.4!important;font-weight:300!important}
body :is(main,.shell) .price-category>summary h2{font-size:var(--accordion-size)!important;line-height:1.4!important;letter-spacing:normal!important}
body :is(main,.shell) .ed-card h2{font-size:var(--small-heading)!important;line-height:1.25!important}
body :is(main,.shell) .ed-featured h2{font-size:var(--section-size)!important;line-height:1.15!important}
body :is(main,.shell) :is(.intro-copy,.intro-lead){margin-block:16px}
body :is(main,.shell) :is(.ed-prose h2,.support-copy h2,.policy-section h2,.ed-article-header h1,.contact-opening h1,.ed-related>h2){margin-bottom:16px}
body :is(main,.shell) :is(.educational-content,.answer) p:last-child{margin-bottom:0}
body :is(main,.shell) .consultation-content .journey-step p{line-height:1.5!important}
body .footer-grid :is(p,a,address),body .footer-bottom{line-height:1.55}
@media(max-width:760px){
 :root{--reading-size:16px;--title-size:clamp(34px,9vw,40px);--section-size:clamp(28px,7.4vw,32px);--small-heading:20px;--accordion-size:16px;--paragraph-gap:12px}
 body :is(main,.shell) h4:not(.policy-section h4){font-size:18px!important}
 body :is(main,.shell) label{line-height:1.5!important}
 body :is(main,.shell) :is(.home-section-head,.svc-section-top,.journal-heading,.skincare-heading,.section-heading){margin-bottom:16px}
 body :is(main,.shell) :is(.ed-prose h2,.support-copy h2,.policy-section h2,.ed-article-header h1,.contact-opening h1,.ed-related>h2){margin-bottom:12px}
 body :is(main,.shell) :is(.ed-card h2,.ed-card h3,.enquiry-channels h3){margin-bottom:12px}
}

/* Lighter question labels, with existing accessible tap-target heights. */
@font-face{font-family:Poppins;src:url('/wp-content/plugins/flawless-studio/public/assets/optimised/poppins-light-300.woff2') format('woff2');font-style:normal;font-weight:300;font-display:swap}
body :is(main,.shell) summary :is(h2,h3,span:not(.step-num)){font-weight:inherit!important}
body :is(main,.shell) :is(h1,h2,h3,h4){font-weight:400}
body :is(main,.shell) :is(.team-opening,.contact-opening){padding-block:var(--page-space);column-gap:var(--column-space);row-gap:var(--content-space)}
body :is(main,.shell) .support-layout{padding-bottom:var(--page-space)}
body :is(main,.shell) .tab-list{margin-bottom:16px}
body :is(main,.shell) :is(.education-topic>summary,.faq-content summary,.svc-disclosure summary,.journey-step summary,.price-category>summary){padding-block:12px;min-height:48px}
@media(min-width:761px){
 body main .editorial-hero{min-height:0}
 body main .editorial-hero .intro{padding-block:40px}
}
@media(max-width:760px){
 /* Reserve the existing 300px image area, then a compact 24px gap. */
 body :is(main,.shell) .editorial-hero .intro{padding-top:324px;padding-bottom:22px}
}

/* Compact general-information notices across the redesign. */
body :is(main,.shell) :is(.disclaimer,.disc,.home-medical-note),
body :is(main,.shell) :is(.disclaimer,.disc,.home-medical-note) :is(p,a,strong,span){font-size:13px!important;line-height:1.5!important;}
body :is(main,.shell) .disclaimer strong{font-weight:500!important;}

/* Skin quiz results capture + footer newsletter (added 5 Nov 2026) */
.quiz-capture{margin:28px 0;padding:24px;border:1px solid var(--line,#d7cebe);border-radius:12px;background:var(--paper,#fef6ec);color:var(--ink,#231f20);text-align:left}
.quiz-capture h3{margin:0 0 6px;font-family:var(--serif,Georgia,serif);font-weight:400;font-size:1.5rem}
.quiz-capture p{margin:0}
.quiz-capture form{display:grid;gap:12px;margin-top:16px}
.quiz-capture .qc-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.quiz-capture label{display:grid;gap:6px;font-size:14px}
.quiz-capture label span{opacity:.7;font-size:12px}
.quiz-capture input,.fa-newsletter input{font:inherit;padding:12px 14px;border:1px solid var(--line,#d7cebe);border-radius:8px;background:#fff;width:100%;box-sizing:border-box;color:var(--ink,#231f20)}
.quiz-capture button,.fa-newsletter button{justify-self:start;font:inherit;font-size:14px;min-height:48px;padding:0 26px;border:0;border-radius:999px;background:var(--wine,#78081c);color:#fff;cursor:pointer}
.quiz-capture button:disabled,.fa-newsletter button:disabled{opacity:.6;cursor:default}
.qc-status,.fa-newsletter-status{min-height:1.2em;font-size:14px}
.fa-newsletter{background:var(--cream,#f2eee3);border-bottom:1px solid var(--line,#d7cebe);padding:36px 0}
.fa-newsletter-inner{display:grid;gap:18px;grid-template-columns:1fr minmax(280px,440px);align-items:center}
.fa-newsletter h2{margin:4px 0 6px;font-family:var(--serif,Georgia,serif);font-weight:400;font-size:clamp(1.4rem,2.4vw,1.9rem)}
.fa-newsletter p{margin:0}
.fa-newsletter-form{display:grid;grid-template-columns:1fr auto;gap:10px}
.fa-newsletter-form .fa-newsletter-status{grid-column:1/-1}
.fa-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:720px){.fa-newsletter-inner{grid-template-columns:1fr}.fa-newsletter-form{grid-template-columns:1fr}.fa-newsletter button{justify-self:stretch}}

#stage #quiz-capture{background:var(--paper,#fef6ec)!important;color:var(--ink,#231f20)!important;border-color:var(--line,#d7cebe)!important}
#stage #quiz-capture h3,#stage #quiz-capture p,#stage #quiz-capture label{color:var(--ink,#231f20)!important}
#stage #quiz-capture input{background:#fff!important;color:var(--ink,#231f20)!important;border:1px solid var(--line,#d7cebe)!important}
#stage #quiz-capture button{background:var(--wine,#78081c)!important;color:#fff!important;border:0!important;border-radius:999px!important;padding:0 26px!important;min-height:48px!important;width:auto!important}
.editorial-film .fa-film-still,.editorial-film .fa-film-still img,.editorial-film img.fa-film-still{display:block;width:100%!important;height:auto!important;aspect-ratio:auto!important;max-height:640px;object-fit:cover;object-position:50% 35%;border-radius:inherit}
/* Newsletter sits flush at the top edge of the footer */
footer#footer{padding-top:0!important}
footer#footer > .fa-newsletter{margin:0 0 50px}
footer#footer .fa-newsletter button{background:#78081c!important;color:#fff!important;opacity:1}
footer#footer .fa-newsletter button:disabled{opacity:.6}