/* Shared scale and collision-safe layout. Retains the approved Ege visual direction. */
:root{--heading-xl:clamp(3.5rem,7vw,6rem);--heading-lg:clamp(2.5rem,4.4vw,4rem);--heading-md:clamp(1.75rem,2.8vw,2.5rem);--body-size:1rem;--section-space:clamp(48px,6vw,88px);--gutter:clamp(20px,5vw,80px)}
.section{max-width:1440px;padding-block:var(--section-space)}
h1,h2,h3{overflow-wrap:break-word;text-wrap:balance;line-height:1.1;letter-spacing:-.025em}
.header,.home .header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:24px;max-width:1360px;margin-inline:auto;height:88px;padding:10px 20px 10px 12px}
.header nav{justify-self:end;margin-left:0;gap:clamp(18px,2vw,28px);min-width:0}
.header .logo,.home .header .logo{width:112px;height:64px;padding:4px 10px;flex-shrink:0}
.header .logo img,.home .header .logo img{width:92px;height:56px;object-fit:contain}
.header nav>a,.header .dropdown-toggle{font-size:13px;line-height:1.5;min-height:44px}
.header-wa,.home .header-wa{margin:0;white-space:nowrap;gap:16px;font-size:13px;min-height:44px}
.header .dropdown-menu{top:100%;min-width:280px;max-height:calc(100dvh - 140px);overflow-y:auto}
.header .dropdown-menu a{font-size:14px;min-height:44px}
.header :focus-visible,.cinema-hero :focus-visible,.contact-scene :focus-visible{outline-color:#fff8ef}
.inner-page main{padding-top:120px}
/* Content defines the hero's height; copy and controls occupy separate grid cells. */
.cinema-hero{height:auto;min-height:min(850px,100svh);max-height:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,370px);grid-template-areas:'title title' 'scroll note' 'caption caption';grid-template-rows:1fr auto auto;gap:24px 48px;padding:160px var(--gutter) 32px;align-items:end}
.cinema-title{grid-area:title;position:relative;inset:auto;padding:24px 0 32px;min-width:0}
.cinema-title h1{font-size:var(--heading-xl);line-height:1.02;max-width:950px;margin:0 0 32px;letter-spacing:-.03em}
.cinema-title h1>span{max-width:none}.cinema-title h1 em{display:inline}
.cinema-actions{flex-wrap:wrap;gap:12px}
.button,.cinema-actions .button,.contact-scene-bottom .button{font-size:14px;min-height:48px;gap:16px;padding:8px 9px 8px 20px;white-space:normal;text-align:left}
.button>svg{flex-shrink:0;width:32px;height:32px}
.cinema-note,.home .cinema-note{grid-area:note;position:relative;inset:auto;max-width:none;width:auto;padding:24px;border-radius:28px 6px 6px 6px;gap:16px}
.cinema-note p{font-size:14px;line-height:1.75}.note-symbol{flex:0 0 30px}
.hero-scroll{grid-area:scroll;position:relative;inset:auto;justify-self:start;font-size:13px;gap:16px}
.hero-caption{grid-area:caption;position:relative;inset:auto;text-align:right;max-width:none;font-size:12px;line-height:1.6;opacity:.9}
.scene-heading{gap:24px;justify-content:space-between;margin-bottom:40px}.scene-heading h2{text-align:left}
.scene-orbit{position:static;flex:0 0 48px;width:48px;height:48px}
.scene-heading h2,.belief-heading h2,.result-scene>h2,.team-heading h2,.contact-scene h2{font-size:var(--heading-lg);line-height:1.12;letter-spacing:-.025em}
.belief-scene{padding-block:var(--section-space)}.belief-heading{padding-bottom:40px}
.service-window{height:390px}.service-deck,.inner-page .service-deck{min-height:390px}
.window-title{font-size:clamp(22px,2vw,28px);line-height:1.15;padding-inline:12px;padding-bottom:72px}
.service-window.selected .window-title{font-size:clamp(30px,3vw,40px);line-height:1.1;padding:0 24px 76px;max-width:none;text-align:center;align-self:center}
.window-art,.service-window.selected .window-art{top:28px;height:185px;width:min(160px,90%)}
.window-link,.selected .window-link{width:44px;height:44px;left:50%;right:auto;bottom:16px;transform:translateX(-50%)}
.belief-card{grid-template-columns:.35fr 1fr 1.1fr;gap:32px;padding:36px;min-height:300px;top:calc(120px + var(--card)*12px)}
.belief-card h3{font-size:var(--heading-md);line-height:1.15;margin:0}
.belief-text p{font-size:15px;line-height:1.8;max-width:60ch}.belief-arrow{width:44px;height:44px}
.result-scene>h2{text-align:left;margin:0 0 40px;font-style:italic}
.result-stage{grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:clamp(32px,6vw,88px);padding:0;max-width:1040px;margin-inline:auto}
.result-stage .comparison{width:100%;max-width:440px;aspect-ratio:.9;border-radius:180px 180px 8px 8px}
.result-side{padding-top:0}.result-side p{font-size:16px;line-height:1.85;max-width:42ch;margin:0 0 24px}
.orbit-link{width:112px;height:112px;font-size:12px;gap:12px}.orbit-link svg{width:25px}
.result-decoration{width:35%;right:0;opacity:.25;pointer-events:none}
.team-heading{margin-bottom:32px}.team-heading>span{width:88px;height:100px;margin:0;flex-shrink:0}
.team-scene .doctor-list,.inner-page .doctor-list{margin-left:0}.team-scene .doctor-row:nth-child(n){margin-left:0}
.doctor-row{padding:28px 0;gap:24px}.doctor-row>div{min-width:0}.doctor-row h3{font-size:var(--heading-md);line-height:1.15;margin-bottom:10px}.doctor-row p{font-size:14px;line-height:1.6}
.doctor-row .round-arrow{width:44px;height:44px;flex-shrink:0}
.contact-scene{padding-block:var(--section-space)}.contact-scene h2{max-width:760px}.contact-scene h2 em{padding-left:10%;margin-top:8px}
.contact-scene-bottom{margin-top:32px;gap:32px}.contact-scene-bottom p{font-size:16px;line-height:1.85;max-width:48ch}
.inner-title{padding-block:48px;max-width:1440px}.inner-page .inner-title h1{font-size:clamp(40px,5vw,72px);line-height:1.1}
.inner-page .prose p,.intro-copy,.inner-page .result-detail-copy p,.inner-page .why-list p,.inner-page .bio-section li{font-size:16px;line-height:1.85}
.prose{max-width:68ch}.inner-page .about-section h2{font-size:var(--heading-lg)}.inner-page .why-list summary{font-size:28px;line-height:1.25}
.inner-page .result-detail .comparison{max-width:440px;width:100%;justify-self:center;aspect-ratio:.9}
.contact-email,.footer-contact a{overflow-wrap:anywhere}.contact-large{font-size:clamp(32px,4vw,52px)}
footer{max-width:1440px}.footer-top{gap:40px}.footer-links,.footer-contact{font-size:14px;line-height:1.8}.footer-links{gap:4px}.footer-links a{min-height:44px;display:flex;align-items:center}.footer-bottom{font-size:12px;line-height:1.7;padding-right:64px}.footer-bottom a{min-height:44px}
@media(max-width:1100px){
 .header,.home .header{grid-template-columns:auto minmax(0,1fr) auto;height:80px;left:16px;right:16px;padding:8px 12px;gap:12px}
 .header .logo,.home .header .logo{width:100px;height:60px}.header .logo img,.home .header .logo img{width:84px;height:52px}
 .header-wa,.home .header-wa{justify-self:end;margin:0}
 .header .menu-toggle{display:flex;width:44px;height:44px;padding:12px 9px;flex-direction:column;justify-content:space-around;background:none;border:0}
 .header nav,.home .header nav{display:none;position:absolute;top:calc(100% + 10px);left:0;right:0;margin:0;background:#451c2d;border:1px solid #ffffff38;border-radius:18px;padding:12px 22px;max-height:calc(100dvh - 125px);overflow-y:auto}
 .header nav.open{display:flex;flex-direction:column;align-items:stretch;gap:0}
 .header nav>a,.header .dropdown-toggle{font-size:15px;white-space:normal;padding:14px 0;width:100%;text-align:left}.header .dropdown-toggle{justify-content:space-between}
 .header .dropdown-menu{position:static;display:none;visibility:visible;opacity:1;transform:none;min-width:0;max-height:none;box-shadow:none}.header .nav-dropdown.open .dropdown-menu{display:block}
 .belief-card{grid-template-columns:1fr 1fr}.belief-art{position:absolute;inset:auto auto -30px -30px;width:160px;opacity:.12;pointer-events:none}
 .service-window{height:360px}.service-deck,.inner-page .service-deck{min-height:360px}.window-art,.service-window.selected .window-art{height:145px}
}
@media(max-width:620px){
 :root{--heading-xl:clamp(48px,13vw,72px);--heading-lg:clamp(34px,9vw,46px);--heading-md:clamp(26px,7vw,32px)}
 .header,.home .header{left:10px;right:10px;top:10px;gap:8px;height:76px;padding:7px 8px;border-radius:18px}
 .header .logo,.home .header .logo{width:88px;height:58px;padding:4px 6px}.header .logo img,.home .header .logo img{width:76px;height:50px}
 .header-wa,.home .header-wa{font-size:12px;padding:10px 12px;gap:8px}.header-wa svg{width:14px}
 .cinema-hero{min-height:780px;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto auto;grid-template-areas:'title' 'note' 'scroll' 'caption';padding:128px var(--gutter) 24px;gap:24px}
 .cinema-title{padding:8px 0}.cinema-title h1{margin-bottom:24px}.cinema-title h1 em{display:block}
 .cinema-actions .button{font-size:13px;padding:8px 9px 8px 16px;min-height:48px;gap:12px}
 .cinema-note,.home .cinema-note{padding:20px;display:block}.cinema-note p{font-size:14px;line-height:1.75}
 .hero-scroll{font-size:12px}.scroll-stem{width:32px;height:44px}.hero-caption{text-align:left;font-size:11px}
 .scene-heading{gap:16px;margin-bottom:28px}.scene-orbit{width:44px;height:44px;flex-basis:44px}
 .service-deck,.inner-page .service-deck{min-height:0}.service-window{height:104px;min-height:104px}.service-window.selected{height:300px;min-height:300px}
 .window-select{padding:0 68px 0 78px}.window-title{font-size:24px;padding:0;line-height:1.15}
 .window-art{left:2px;top:12px;width:70px;height:78px}.service-window.selected .window-art{top:20px;left:50%;width:150px;height:150px}
 .service-window.selected .window-title{font-size:32px;left:22px;right:22px;bottom:74px;padding:0;text-align:center}
 .window-link{left:auto;right:12px;bottom:30px;transform:none}.selected .window-link{left:50%;right:auto;bottom:16px;transform:translateX(-50%)}
 .belief-card{position:relative;top:0;grid-template-columns:minmax(0,1fr);min-height:0;gap:20px;padding:28px 24px;margin-bottom:20px}.belief-card h3{max-width:none}.belief-text p{font-size:15px;max-width:none}.belief-heading{padding-bottom:28px}
 .result-scene>h2{margin-bottom:28px}.result-stage{display:flex;gap:28px;padding:0}.result-stage .comparison{max-width:360px}.result-side{padding:0;display:block}.result-side p{font-size:16px;margin-bottom:20px}.result-decoration{display:none}.orbit-link{width:104px;height:104px}
 .team-heading{margin-bottom:24px}.team-heading>span{display:none}.team-heading h2{overflow-wrap:normal}.doctor-row{padding:24px 0;gap:16px}.doctor-row p{font-size:14px}
 .contact-scene-bottom{align-items:start;gap:24px;margin-top:28px}.contact-scene-bottom p{font-size:16px}.contact-scene h2 em{max-width:none}
 .footer-top{grid-template-columns:minmax(0,1fr);gap:24px}.footer-top .logo{grid-column:auto}.footer-contact>a:first-child{font-size:28px}.footer-links,.footer-contact{font-size:14px}.footer-bottom{flex-wrap:wrap;font-size:12px;gap:8px}
 .inner-title{padding-block:36px}.inner-page .inner-title h1{font-size:clamp(38px,10vw,52px)}.inner-page .prose p,.intro-copy{font-size:16px}.inner-page .doctor-role{font-size:26px}.address-panel{padding:28px 22px;min-height:320px}.address-panel p{font-size:26px}
}
@media(prefers-reduced-motion:reduce){.belief-card{position:relative;top:0}}
@media(min-width:621px) and (max-width:1100px){
 .service-deck{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
 .service-window,.service-window.selected{height:340px;min-height:340px}
 .service-window:last-child:nth-child(odd){grid-column:1/-1}
 .window-title,.service-window.selected .window-title{font-size:30px;padding:0 24px 76px;max-width:none}
 .window-art,.service-window.selected .window-art{height:145px;width:150px;top:24px}
}
/* Screenshot feedback: keep navigation clear of the hero photograph. */
.header,.home .header{position:relative;top:auto;left:auto;right:auto;width:calc(100% - 48px);margin:16px auto 24px}
.inner-page main{padding-top:0}
.cinema-hero{min-height:680px;padding-top:56px;gap:24px 48px}
.cinema-title{padding-top:24px}
/* Group the title, explanation and link beside the comparison. */
.result-scene{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);grid-template-rows:auto 1fr;column-gap:clamp(32px,6vw,80px);row-gap:24px;align-items:start;max-width:1240px;padding-block:64px}
.result-scene>h2{grid-column:1;grid-row:1;text-align:left;margin:0;padding-top:24px}
.result-stage{display:contents}
.result-side{grid-column:1;grid-row:2;align-self:start;padding:0}
.result-side p{margin:0 0 24px;max-width:44ch}
.result-stage .comparison{grid-column:2;grid-row:1 / span 2;align-self:center;margin:0;max-width:440px}
.result-decoration{display:none}
/* Crop the supplied composite equally on both sides, excluding its embedded logo. */
.comparison .comparison-photo img,.result-stage .comparison-photo img{top:-25%;height:125%;width:200%;object-fit:cover}
@media(max-width:1100px){.header,.home .header{width:calc(100% - 32px);margin:12px auto 20px}}
@media(max-width:620px){
 .header,.home .header{width:calc(100% - 20px);margin:10px auto 18px}
 .cinema-hero{min-height:0;padding-top:32px;padding-bottom:28px;gap:24px}
 .cinema-title{padding-top:8px;padding-bottom:8px}
 .result-scene{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:24px;padding-block:48px}
 .result-scene>h2{grid-column:1;grid-row:1;padding:0;margin:0}
 .result-stage .comparison{grid-column:1;grid-row:2;justify-self:center;width:100%;max-width:360px}
 .result-side{grid-column:1;grid-row:3;width:100%}
}
/* Full photograph, viewport-sized hero. No cover crop or image-driven page height. */
.home .header{position:absolute;top:16px;left:24px;right:24px;width:auto;margin:0 auto}
.cinema-hero{display:block;height:100svh;min-height:600px;max-height:none;padding:0;background:#321322;overflow:hidden}
.cinema-photo{position:absolute;inset:0;z-index:-2}
.cinema-photo img{display:block;width:100%;height:100%;object-fit:contain;object-position:right center;animation:none}
.cinema-shade{display:block;background:linear-gradient(90deg,#321322 0%,#321322cc 18%,#32132235 48%,transparent 75%),linear-gradient(0deg,#220615a6,transparent 45%)}
.cinema-title{position:absolute;inset:auto auto 100px var(--gutter);padding:0;max-width:62%}
.cinema-title h1{font-size:clamp(52px,5vw,88px);line-height:1.02;margin-bottom:24px;max-width:850px}
.cinema-title h1 em{display:inline}.cinema-actions{flex-wrap:wrap}
.cinema-note,.home .cinema-note{position:absolute;left:auto;right:var(--gutter);top:auto;bottom:64px;width:330px;max-width:29%;padding:20px}
.cinema-note p{font-size:13px;line-height:1.7}
.hero-scroll{position:absolute;left:var(--gutter);bottom:24px;top:auto;font-size:12px;gap:12px}.scroll-stem{height:44px;width:32px}
.hero-caption{position:absolute;right:var(--gutter);bottom:26px;text-align:right;font-size:11px}
@media(max-width:1100px){
 .home .header{top:12px;left:16px;right:16px;width:auto;margin:0 auto}
 .cinema-title{bottom:100px;max-width:60%}.cinema-title h1{font-size:clamp(44px,5.4vw,64px)}
 .cinema-note,.home .cinema-note{max-width:32%;padding:18px}.cinema-note p{font-size:12px}
}
@media(max-width:620px){
 .home{background:#321322}.home main>section:not(.cinema-hero):not(.belief-scene):not(.contact-scene){background:var(--paper)}.home footer{background:var(--paper)}
 .home .header{position:relative;inset:auto;width:calc(100% - 20px);height:76px;margin:10px auto 14px}
 .cinema-hero{display:grid;height:calc(100svh - 100px);min-height:540px;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(120px,1fr) auto auto auto;gap:12px;padding:0 20px 18px}
 .cinema-photo{position:relative;inset:auto;z-index:0;min-height:0;grid-row:1;grid-column:1;width:100%;height:100%}
 .cinema-photo img{width:100%;height:100%;object-fit:contain;object-position:center;animation:none}
 .cinema-shade{display:none}
 .cinema-title{position:relative;inset:auto;padding:0;max-width:none;grid-area:auto;grid-row:2}
 .cinema-title h1{font-size:clamp(36px,10vw,48px);line-height:1;margin:0 0 14px}.cinema-title h1 em{display:inline}
 .cinema-actions{gap:8px}.cinema-actions .button{font-size:12px;min-height:44px;padding:6px 8px 6px 14px;gap:8px}
 .cinema-note,.home .cinema-note{position:relative;inset:auto;grid-area:auto;grid-row:3;width:auto;max-width:none;margin:0;padding:14px 16px;border-radius:18px 6px 6px 6px}
 .cinema-note p{font-size:13px;line-height:1.6}
 .hero-scroll{display:none}.hero-caption{position:relative;inset:auto;grid-area:auto;grid-row:4;text-align:left;margin:0;font-size:11px;line-height:1.4}
}
@media(min-width:621px) and (max-height:700px){
 .cinema-title{bottom:90px}.cinema-title h1{font-size:clamp(44px,4.5vw,64px);margin-bottom:18px}
 .cinema-note,.home .cinema-note{bottom:58px;padding:16px}.cinema-note p{font-size:12px}
}
@media(max-width:620px){
 .cinema-hero{height:auto;min-height:0;grid-template-rows:auto auto auto auto;gap:16px;padding-top:8px;padding-bottom:24px}
 .cinema-photo{height:auto;aspect-ratio:3 / 2}
 .cinema-photo img{object-position:center}
}
/* Feather the photograph's actual left edge, not the whole viewport. */
@media(min-width:621px){
 .cinema-photo{left:auto;right:0;width:min(100%,max(900px,150svh));
  -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.12) 5%,rgba(0,0,0,.45) 11%,rgba(0,0,0,.8) 17%,#000 24%);
  mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.12) 5%,rgba(0,0,0,.45) 11%,rgba(0,0,0,.8) 17%,#000 24%)}
}
/* Final brand and CTA alignment. */
.header .logo,.home .header .logo{width:174px;padding:6px 8px}
.header .logo picture{display:block;width:100%}
.header .logo img,.home .header .logo img{width:158px;height:52px;object-fit:contain}
.belief-heading em,.contact-scene h2 em{font-style:normal;font-weight:500}
.result-scene>h2{font-style:normal}
.cinema-title{top:38%;bottom:auto;max-width:min(43%,650px)}
.cinema-title h1{font-size:clamp(52px,4.6vw,84px);margin-bottom:20px}
.cinema-title .cinema-note,.home .cinema-title .cinema-note{position:static;inset:auto;width:auto;max-width:46ch;margin:0 0 26px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;color:#f6f1e8;display:block}
.cinema-title .cinema-note .note-symbol{display:none}
.cinema-title .cinema-note p{font-size:15px;line-height:1.8;color:#e9d7dc}
.contact-scene{padding-block:64px}
.contact-scene h2 em{display:inline;padding:0;margin:0;color:inherit}
.contact-scene-bottom{max-width:none;margin-top:24px;gap:32px}
.contact-scene-bottom p{max-width:58ch}
.contact-options{display:grid;grid-template-columns:1fr 1fr 1.25fr;gap:32px;padding-top:28px;margin-top:32px;border-top:1px solid #e9d7dc40;color:#f6f1e8;font-size:15px;line-height:1.7}
.contact-options a{padding-block:8px;min-height:44px;overflow-wrap:anywhere}
.contact-options a:first-child{font-size:24px;line-height:1.3}
@media(max-width:1100px){.header .logo,.home .header .logo{width:150px}.header .logo img,.home .header .logo img{width:134px;height:48px}.cinema-title{top:32%;max-width:49%}.cinema-title h1{font-size:clamp(44px,5vw,60px)}}
@media(min-width:621px) and (max-height:740px){.cinema-title{top:29%}.cinema-title h1{font-size:clamp(42px,4vw,60px);margin-bottom:16px}.cinema-title .cinema-note p{font-size:14px;line-height:1.65}.cinema-title .cinema-note,.home .cinema-title .cinema-note{margin-bottom:20px}}
@media(max-width:620px){
 .header .logo,.home .header .logo{width:132px;height:56px}.header .logo img,.home .header .logo img{width:116px;height:44px}
 .cinema-title{position:relative;inset:auto;max-width:none}
 .cinema-title h1{font-size:clamp(36px,10vw,48px);margin-bottom:16px}
 .cinema-title .cinema-note,.home .cinema-title .cinema-note{margin:0 0 20px;max-width:none}
 .cinema-title .cinema-note p{font-size:14px;line-height:1.7}
 .hero-caption{grid-row:3}
 .contact-scene{padding-block:48px}.contact-options{grid-template-columns:1fr;gap:4px;padding-top:20px;margin-top:24px;font-size:14px}
}
/* Client revisions: navigation, article and early analysis section. */
.header .logo,.home .header .logo{width:190px;padding:0 4px;background:#f6f1e8;border-radius:12px}
.header .logo img,.home .header .logo img{width:182px;height:70px;object-fit:contain}
.header nav{gap:clamp(12px,1.5vw,24px)}
.header nav>a,.header .dropdown-toggle{font-size:13px}
.dropdown-menu:before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.social-links{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.social-links a{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 14px;border:1px solid #552d3a30;border-radius:30px;font-size:14px}
.social-links svg{width:20px;height:20px;flex:none}
.social-links a:hover{background:#552d3a0c}
.contact-social{padding-block:0 40px}
.analysis-top{display:grid;grid-template-columns:1fr 1.2fr;gap:20px 48px;padding-block:40px}
.analysis-top h2{font-size:clamp(36px,4vw,58px);align-self:center}
.analysis-top .contact-scene-bottom{margin:0;gap:24px;align-items:center}
.analysis-top .contact-options{grid-column:1/-1;margin:0;padding-top:20px;font-size:14px}
.analysis-top .contact-contour{display:none}
.eye-label{position:absolute;left:12%;right:12%;bottom:6%;height:15%;display:flex;align-items:center;justify-content:center;background:#4a202f;color:#fff;font-size:clamp(14px,2vw,20px);font-weight:600;letter-spacing:.02em;z-index:1;border-radius:5px}
.before .eye-label{background:#65575a}
.doctor-row.has-photo{display:grid;grid-template-columns:100px minmax(0,1fr) auto;gap:24px;align-items:center}
.doctor-portrait{width:100px;height:116px;object-fit:cover;object-position:center top;border-radius:12px;background:#ece8e4}
.profile-portrait{width:min(320px,calc(100% - 48px));margin:32px auto 0}
.profile-portrait img{width:100%;height:auto;display:block;border-radius:24px}
.blog-list{padding-top:20px;padding-bottom:80px}
.blog-card{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;border-block:1px solid #552d3a25;padding-block:28px}
.blog-card>img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:24px}
.blog-card h2{font-size:clamp(30px,3.4vw,50px);line-height:1.12;margin:0 0 20px}
.blog-card p{max-width:50ch;line-height:1.8;color:#76686c}
.blog-card span{display:inline-flex;width:48px;height:48px;align-items:center;justify-content:center;border:1px solid #552d3a40;border-radius:50%;font-size:24px;margin-top:20px}
.blog-article{max-width:850px;padding-top:40px;padding-bottom:80px}
.blog-article h1{font-size:clamp(40px,5vw,66px);line-height:1.1;margin:24px 0 32px}
.blog-article h2{font-size:clamp(30px,3vw,40px);line-height:1.2;margin:40px 0 20px}
.blog-article h3{font-family:Manrope,sans-serif;font-size:20px;line-height:1.4;margin:28px 0 12px}
.blog-article p{font-size:17px;line-height:1.9;margin-bottom:20px;color:#695b60}
.article-back{display:inline-flex;min-height:44px;align-items:center}
@media(max-width:1100px){.header .logo,.home .header .logo{width:172px}.header .logo img,.home .header .logo img{width:164px;height:62px}.analysis-top{grid-template-columns:1fr}.analysis-top .contact-scene-bottom{justify-content:space-between}}
@media(max-width:620px){.header .logo,.home .header .logo{width:158px;height:62px}.header .logo img,.home .header .logo img{width:150px;height:60px}.analysis-top{gap:20px;padding-block:32px}.analysis-top .contact-scene-bottom{align-items:start;gap:20px}.blog-card{grid-template-columns:1fr;gap:24px}.doctor-row.has-photo{grid-template-columns:76px minmax(0,1fr) auto;gap:12px}.doctor-portrait{width:76px;height:94px}.doctor-row h3{font-size:23px}.blog-article p{font-size:16px}}
/* Remove the animation canvas's side whitespace while preserving all frames. */
.header .logo,.home .header .logo{width:126px;padding:0 5px;height:72px}
.header .logo img,.home .header .logo img{width:116px;height:70px}
@media(max-width:1100px){.header .logo,.home .header .logo{width:116px;height:64px}.header .logo img,.home .header .logo img{width:106px;height:62px}}
@media(max-width:620px){.header .logo,.home .header .logo{width:108px;height:62px}.header .logo img,.home .header .logo img{width:98px;height:60px}}
.comparison-photo.after{z-index:0}.comparison-photo.before{z-index:1}.compare-line{z-index:2}.compare-input{z-index:3}
.before .eye-label{justify-content:flex-start;padding-left:10%}.after .eye-label{justify-content:flex-end;padding-right:10%}
.blog-card>img{height:auto}

/* Integrated animated wordmark and direct analysis navigation. */
.header .logo,.home .header .logo{background:transparent;border:0;box-shadow:none;border-radius:0}
.header .logo img,.home .header .logo img{filter:brightness(0) invert(1);opacity:.94}
.header nav>a,.header .dropdown-toggle{white-space:nowrap}
@media(min-width:1101px) and (max-width:1280px){.header,.home .header{gap:14px}.header nav{gap:12px}.header-wa,.home .header-wa{gap:10px;padding-inline:16px}}

.header .logo img,.home .header .logo img{mix-blend-mode:normal}

/* Center the animated brand mark optically inside the navigation bar. */
.header .logo,.home .header .logo{display:flex;align-items:center;justify-content:center;align-self:center;width:142px;height:68px;padding:0;overflow:visible}
.header .logo picture{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.header .logo img,.home .header .logo img{display:block;width:136px;height:78px;max-width:none;flex:none;object-fit:contain;transform:translateY(-3px)}
@media(max-width:1280px){.header .logo,.home .header .logo{width:130px}.header .logo img,.home .header .logo img{width:128px;height:74px}}
@media(max-width:620px){.header .logo,.home .header .logo{width:120px;height:62px}.header .logo img,.home .header .logo img{width:120px;height:70px;transform:translateY(-2px)}}

/* Site creator credit, aligned with the footer's final row. */
.footer-bottom{align-items:center;flex-wrap:wrap;column-gap:24px;row-gap:12px}
.footer-bottom>span{margin-right:auto}
.footer-bottom .footer-credit{display:inline-flex;align-items:center;justify-content:flex-end;gap:12px;flex:0 0 auto;min-height:56px;color:var(--muted);text-decoration:none}
.footer-credit span{font-size:11px;line-height:1.5;white-space:nowrap}
.footer-credit img{display:block;width:136px;height:56px;max-width:none;flex:none;object-fit:cover;object-position:center;mix-blend-mode:multiply}
.footer-credit:hover span{color:var(--ink)}
.footer-credit:focus-visible{outline:2px solid var(--ink);outline-offset:5px;border-radius:4px}
@media(max-width:620px){
 .footer-bottom{padding-right:0;padding-bottom:88px;column-gap:20px}
 .footer-bottom .footer-credit{flex-basis:100%;margin-left:auto}
}

/* Brand-colored social links beneath the footer logo. */
.footer-top .footer-brand{display:flex;flex-direction:column;align-items:center;gap:22px;justify-self:start;width:206px;max-width:100%}
.footer-brand>.logo{display:flex;justify-content:center;width:100%;height:auto}
.footer-top .footer-brand>.logo img{display:block;width:170px;height:auto;max-width:100%}
.social-links{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0}
.social-links .social-link{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:50%;background:#fff;box-shadow:none;transition:transform .2s ease,box-shadow .2s ease}
.social-links .social-link img{display:block;width:22px;height:22px;object-fit:contain}
.social-links .social-link:focus-visible{outline:2px solid var(--red);outline-offset:4px;box-shadow:0 4px 14px #431d2614}
.footer-top .footer-contact>a:first-child{font-family:inherit;font-size:14px;line-height:1.8}
@media(hover:hover){.social-links a.social-link:hover{background:#fff;box-shadow:0 6px 18px #431d261a;transform:translateY(-3px)}}
@media(min-width:621px) and (max-width:900px){.footer-top .footer-brand{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){.social-links .social-link{transition:none}.social-links a.social-link:hover{transform:none}}

.social-links .social-link[aria-disabled="true"]{position:relative;cursor:default}
.social-links [data-tooltip]::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);width:max-content;max-width:200px;padding:6px 10px;border-radius:8px;background:var(--ink);color:var(--paper);font-family:Manrope,sans-serif;font-size:11px;font-weight:400;line-height:1.5;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;z-index:2}
.social-links [data-tooltip]:hover::after,.social-links [data-tooltip]:focus-visible::after{opacity:1;visibility:visible}

/* Primary home-page action: online hair analysis. */
.hero-analysis{display:flex;align-items:center;gap:16px;width:390px;max-width:100%;min-height:88px;padding:16px 18px;border:1px solid #fff8ed;border-radius:20px;background:linear-gradient(120deg,#fffaf1,#f1dfcc);color:#481b2c;box-shadow:0 12px 32px #19081440,0 0 0 5px #f7dfc80d;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.hero-analysis-icon{display:grid;place-items:center;flex:0 0 44px;width:44px;height:48px;border-right:1px solid #481b2c26;padding-right:12px;color:#7e2941}
.hero-analysis-icon svg{display:block;width:32px;height:32px}
.hero-analysis-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px}
.hero-analysis-title{font-size:18px;font-weight:800;line-height:1.35;letter-spacing:-.02em}
.hero-analysis-description{font-size:12px;font-weight:500;line-height:1.5;color:#76505b}
.hero-analysis-arrow{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border-radius:50%;background:#7e1c37;color:#fffaf1;box-shadow:0 4px 12px #7e1c3726}
.hero-analysis-arrow svg{width:21px;height:21px;transition:transform .2s ease}
.hero-analysis:focus-visible{outline:3px solid #fff8ed;outline-offset:7px}
@media(hover:hover){.hero-analysis:hover{transform:translateY(-3px);box-shadow:0 16px 36px #19081450,0 0 0 5px #f7dfc81a}.hero-analysis:hover .hero-analysis-arrow svg{transform:translateX(3px)}}
.hero-analysis:active{transform:translateY(0)}
@media(max-width:620px){
 .hero-analysis{width:100%;min-height:82px;gap:12px;padding:14px;border-radius:18px}
 .hero-analysis-icon{flex-basis:40px;width:40px;height:44px;padding-right:8px}
 .hero-analysis-title{font-size:17px}
 .hero-analysis-arrow{flex-basis:38px;width:38px;height:38px}
}
@media(prefers-reduced-motion:reduce){.hero-analysis,.hero-analysis-arrow svg{transition:none}.hero-analysis:hover,.hero-analysis:hover .hero-analysis-arrow svg{transform:none}}
