/* Presentation only. Approved text, images, product layout and features retained. */
:root{--paper:#faf9f6;--warm:#f3f1ed;--ink:#24231f;--olive:#24231f;--line:#dedbd5;--muted:#68655f}
body{background:var(--paper);font-size:15px;line-height:1.65}
.wrap{max-width:1280px}
.minimal-preview-note{font:10px/1.5 Arial,sans-serif;color:#68655f;text-align:center;padding:7px 18px;background:#f0efeb}
header{padding-top:18px;padding-bottom:18px}
header>nav a{font-size:14px;font-weight:600}
header>nav,header>nav.open{gap:17px}
.hero{background:var(--paper);margin:32px 0 0;gap:40px;grid-template-columns:1fr 1fr}
.hero-copy{padding:38px 15px 38px 0}
.hero h1{font-size:clamp(42px,5vw,60px);line-height:1.06;letter-spacing:-.035em;margin:20px 0}
.hero-copy>p:not(.eyebrow){font:18px/1.5 Arial,sans-serif}
.hero-img{min-height:440px;max-height:520px}
.section{padding:35px 0;margin-top:35px}
.service h3{font-size:25px}
.eco-home{background:var(--paper);margin:35px 0 0;padding:35px 0;border-top:1px solid var(--line)}
.eco-home h2{font-size:clamp(29px,3.3vw,40px);line-height:1.15}
.eco-grid h3{font-size:24px}
.eco-grid p{font-size:14px}
.page:not(.haircare-page){padding:42px 0 30px}
.page:not(.haircare-page)>h1{font-size:clamp(37px,4.8vw,57px);line-height:1.1;max-width:850px}
.page:not(.haircare-page)>.lead{font:18px/1.6 Arial,sans-serif;max-width:66ch}
.text-grid{gap:35px;margin:35px 0}
.text-grid h2{font-size:30px}
.text-grid p,.identity-intro,.service-detail>p:not(.eyebrow),.service-detail li,.salon p,.review p{font-size:15px;line-height:1.65}
.brand-proposal-page h2{font-size:clamp(28px,3vw,36px);line-height:1.15}
.service-detail h2,.diagnosis-panel h2{font-size:34px;line-height:1.15}
.salon h3{font-size:29px}
.under{font-size:13px}
.btn,.outline{font-size:13px;min-height:44px}
.floating{font-size:12px;padding:12px 17px}
/* Hair Care retains its approved warm photographic montage and product distribution. */
.hc-product,.hc-product:nth-child(even){background:var(--paper)}
.hc-hero .eyebrow sup{font:9px Arial,sans-serif;margin-left:2px}
/* Equal service photo frames override intrinsic HTML height attributes. */
.service-row>img,.service>img{display:block;width:100%;max-width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center}
.service-row,.service{min-width:0}
.belen-profile>h1{white-space:nowrap;font-size:clamp(28px,7.6vw,56px)!important;letter-spacing:-.04em}
@media(max-width:1100px){header>nav#nav a{font:22px/1.25 Georgia,serif;padding:13px 0}}
@media(max-width:620px){.wrap{padding:0 20px}.hero{margin:22px 0 0;grid-template-columns:1fr;gap:18px}.hero-copy{padding:14px 0}.hero h1{font-size:43px}.hero-copy>p:not(.eyebrow){font-size:17px}.hero-img{height:350px;min-height:0;max-height:none}.section{margin-top:30px;padding:26px 0}.eco-home{margin:30px 0 0;padding:26px 0}.eco-home h2{font-size:30px}.page:not(.haircare-page)>h1{font-size:38px}.page:not(.haircare-page)>.lead{font-size:17px}.text-grid h2,.service-detail h2,.diagnosis-panel h2{font-size:29px}.text-grid{gap:26px}.brand-proposal-page h2{font-size:29px}.salon h3{font-size:27px}}

/* Registration mark stays outside the original wordmark; arrows use text presentation. */
.brand{overflow:visible;margin-right:12px}
.brand sup{right:-13px;top:2px;font:10px/1 Arial,sans-serif;color:var(--ink)}
.hero .hero-copy>p.hero-tagline{white-space:nowrap;max-width:none;font-size:clamp(11px,3.45vw,17px);line-height:1.5}
@media(min-width:1101px){header>nav#nav{gap:12px}header>nav#nav a{font-size:13px}}

/* Show all lettering of the original asset in a proportional SVG viewport. */
header .brand .logo-clip{inset:0;width:100%;height:100%;overflow:visible}
header .brand .logo-clip img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:left center}
header .reserve-top{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn,.outline,.under{transition:background-color .18s ease,color .18s ease,border-color .18s ease}
.hero .actions>a,#reserve .actions>a{background:var(--ink);color:var(--paper);border:1px solid var(--ink);-webkit-text-fill-color:currentColor}
.hero .actions>a:active,#reserve .actions>a:active,.hero .actions>a:focus-visible,#reserve .actions>a:focus-visible{background:var(--ink);color:var(--paper)}
.belen-profile a.under{position:relative;z-index:1;pointer-events:auto}
@media(hover:hover){.hero .actions>a:hover,#reserve .actions>a:hover{background:var(--ink);color:var(--paper)}.btn:hover,.outline:hover{background:var(--ink);color:var(--paper)}header .reserve-top:hover{background:#000;color:#fff}.under:hover{color:var(--ink);border-bottom-width:2px}}
@media(prefers-reduced-motion:reduce){.btn,.outline,.under{transition:none}}

/* The footer uses the same proportional original logo as the header. */
.brand .logo-clip{inset:0;width:100%;height:100%;overflow:visible}
.brand .logo-clip img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:left center}
button.close,button.menu,button.under,a.under,.salon .actions a{color:var(--ink);-webkit-text-fill-color:currentColor}
button.close{appearance:none;-webkit-appearance:none}
.text-grid:empty,.service-detail ul:empty{display:none}

/* A single original wordmark includes its registration mark on every page. */
.brand{position:relative;display:block;width:210px;height:65px;flex-shrink:0;text-decoration:none;line-height:1}
.brand .logo-clip{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.brand .logo-clip img{position:static;display:block;width:100%;height:100%;object-fit:contain;object-position:left center}
.guide-page header{display:grid;grid-template-columns:210px minmax(0,1fr) auto;gap:18px;align-items:center;max-width:1280px;padding:18px 20px}
header>nav#nav a{margin:0}
.guide-page footer{max-width:1280px;padding:28px 20px;font-size:12px}
.guide-page .reserve-top{border:1px solid var(--ink);background:var(--ink);color:var(--paper);font:13px Arial,sans-serif}
.guide-page header>nav#nav{position:static;width:auto;border:0;box-shadow:none;padding:0;background:var(--paper)}
.guide-page header>.header-actions{grid-column:3;grid-row:1}
@media(max-width:1100px){.guide-page header>.header-actions{grid-column:2}.guide-page header>nav#nav{width:100%;padding:12px 0;border-top:1px solid var(--line)}}
@media(max-width:1100px){.brand,header>.brand{width:150px;height:50px}.guide-page header{grid-template-columns:minmax(0,1fr) auto;gap:10px}}
@media(max-width:360px){.brand,header>.brand{width:125px;height:50px}}
