/* 1. Foundations */
:root {
  --paper:#fff; --ink:#34443d; --muted:#65736b; --green:#536d60;
  --line:#e0e6e1; --soft:#f7f9f6; --gold:#a99570;
  --serif:'Yu Mincho','Hiragino Mincho ProN',serif;
  --sans:'Yu Gothic','Hiragino Kaku Gothic ProN',sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:132px; }
body { margin:0; background:var(--paper); color:var(--ink); font:400 16px/1.95 var(--sans); letter-spacing:.025em; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
h1,h2,h3,p,figure { margin:0; }
h1,h2 { font-family:var(--serif); font-weight:400; letter-spacing:.1em; }
h1 { font-size:clamp(36px,3.6vw,56px); line-height:1.9; }
h2 { font-size:clamp(29px,3vw,42px); line-height:1.8; }
h3 { font-size:19px; font-weight:500; }
p+p { margin-top:22px; }
.wrap { max-width:1160px; margin-inline:auto; width:calc(100% - 100px); }
.section { padding-block:112px; }
.eyebrow { font:13px/1.6 Georgia,serif; letter-spacing:.21em; color:var(--green); margin-bottom:22px; }
.small,.draft-note { font-size:13px; color:var(--muted); }
.draft-note { margin:22px 0; }
:focus-visible { outline:2px solid var(--green); outline-offset:5px; }
.skip { position:fixed; top:-80px; left:15px; background:#fff; padding:12px; z-index:100; }
.skip:focus { top:10px; }
.button { display:inline-flex; align-items:center; justify-content:center; padding:14px 30px; min-height:56px; background:var(--green); color:#fff; border:1px solid var(--green); border-radius:5px; font-size:14px; letter-spacing:.07em; transition:background .45s,color .45s,border-color .45s,box-shadow .45s; }
.button:not([aria-disabled=true]):hover,.button:not([aria-disabled=true]):focus-visible { background:#405d4d; box-shadow:0 5px 18px #3d574414; }
.button.compact { padding:9px 20px; min-height:44px; }
.button[aria-disabled=true] { background:#edf2ed; border-color:#d5ded6; color:var(--ink); cursor:default; }
.text-button,.back-top { display:inline-block; font-size:14px; border-bottom:1px solid #abbcaf; padding:10px 0; transition:color .4s,box-shadow .4s; }
.text-button:hover,.back-top:hover { box-shadow:0 1px 0 var(--green); }
/* 2. Header */
#header { position:fixed; inset:0 0 auto; z-index:20; height:112px; padding:0 3%; display:flex; align-items:center; gap:24px; background:#ffffffc7; backdrop-filter:blur(18px); border-bottom:1px solid #edf0ed; transition:background .4s; }
#header.scrolled { background:#fffffff5; }
.brand { display:flex; flex-direction:column; align-items:flex-start; gap:5px; line-height:1.5; }
.brand small { display:block; font-size:10px; letter-spacing:.12em; }
.brand strong { font:400 18px/1.6 var(--serif); letter-spacing:.06em; white-space:nowrap; }
.logo-slot { font-size:10px; color:var(--muted); letter-spacing:.02em; }
.client-logo { max-width:200px; max-height:42px; object-fit:contain; }
nav { display:flex; margin-left:auto; gap:18px; }
nav a { position:relative; font-size:13px; white-space:nowrap; transition:color .4s; }
nav a:after { content:''; position:absolute; bottom:-5px; left:0; width:100%; height:1px; background:var(--green); transform:scaleX(0); transform-origin:left; transition:transform .45s; }
nav a:hover:after,nav a:focus-visible:after { transform:scaleX(1); }
.header-actions { display:flex; align-items:center; gap:16px; white-space:nowrap; }
.header-tel { font:14px Georgia,serif; letter-spacing:.04em; }
#menu,.mobile-nav { display:none; }
/* 3. Opening composition */
#hero { position:relative; display:flex; align-items:center; min-height:790px; height:min(860px,94svh); padding-top:112px; overflow:hidden; }
.hero-copy { position:relative; z-index:2; margin-left:max(7%,calc((100% - 1160px)/2)); width:52%; }
.hero-copy .eyebrow { margin-bottom:34px; }
.hero-line { display:block; }
.hero-description { font-size:15px; line-height:2.3; color:#59695f; margin-top:27px; }
.hero-buttons { display:flex; gap:32px; align-items:center; margin-top:35px; }
.hero-location { margin-top:44px; font-size:12px; letter-spacing:.1em; }
.hero-location span { margin-inline:12px; }
.hero-image { position:absolute; right:0; top:112px; width:60%; height:calc(100% - 128px); overflow:hidden; }
.hero-image img { width:100%; height:100%; object-fit:cover; object-position:65% center; }
.hero-image:after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,#fff 0%,#ffffff80 18%,transparent 45%); pointer-events:none; }
.hero-image figcaption { position:absolute; z-index:3; right:24px; bottom:19px; font-size:11px; color:var(--muted); background:#ffffffbb; padding:2px 7px; }


.news { display:flex; align-items:center; gap:32px; border-block:1px solid var(--line); padding-block:28px; }
.news .eyebrow { margin:0; white-space:nowrap; }
.news .eyebrow span { margin-left:20px; font:12px var(--sans); letter-spacing:0; }
.news>p:nth-child(2) { margin:0; font-size:14px; }
.news>a { margin-left:auto; font-size:12px; white-space:nowrap; border-bottom:1px solid #b9c6bc; }
/* 4. Message and medical information */
.message { display:grid; grid-template-columns:1fr 1.1fr; gap:95px; padding-block:125px; }
.section-note { margin-top:24px; font-size:14px; }
.message-body { font-size:15px; line-height:2.45; }
.message-signature { margin-top:35px; }
.message-signature span { display:block; font-size:12px; color:var(--muted); }
.message-signature strong { font:400 24px/1.8 var(--serif); letter-spacing:.15em; }
.message-portrait { margin-top:42px; width:190px; height:125px; background:var(--soft); border:1px solid var(--line); display:flex; flex-direction:column; justify-content:center; align-items:center; }
.message-portrait p { font-size:14px; }.message-portrait small { font-size:11px; color:var(--muted); }
.service,.doctor { border-block:1px solid var(--line); }
.section-top { display:flex; align-items:center; justify-content:space-between; gap:45px; margin-bottom:55px; }
.section-top>p { font-size:15px; line-height:2.2; }
.symptoms { display:grid; grid-template-columns:repeat(3,1fr); gap:38px; margin:50px 0 24px; }
.symptoms article { border-right:1px solid var(--line); padding-right:30px; }
.symptoms article:last-child { border:0; padding-right:0; }
.symptom-heading { display:flex; align-items:center; gap:17px; margin-bottom:24px; }
.symptom-heading .eyebrow { margin:0; font-size:11px; }
.care-icon { display:block; height:34px; }
.care-icon svg { width:34px; height:34px; fill:none; stroke:var(--green); stroke-width:1.1; stroke-linecap:round; stroke-linejoin:round; }
.symptoms h3 { font:400 25px/1.6 var(--serif); letter-spacing:.08em; }
.category-intro { color:var(--muted); font-size:13px; margin-top:10px; }
.symptoms ul { list-style:none; margin:23px 0 0; padding:0; font-size:14px; }
.symptoms li { padding:10px 0; border-bottom:1px solid #edf0ed; }
.symptom-note { max-width:900px; }
.care-description { display:grid; grid-template-columns:1fr 1fr; gap:65px; border-top:1px solid var(--line); padding-top:34px; margin-top:40px; }
.care-description>div { display:flex; gap:25px; }.care-description h3 { white-space:nowrap; font-family:var(--serif); }.care-description p { font-size:14px; }
.care-question { margin-top:28px; }
/* 5. First visit and doctor */
.steps { padding:0; list-style:none; display:grid; grid-template-columns:repeat(5,1fr); margin:40px 0 25px; }
.steps li { padding:0 22px; border-right:1px solid var(--line); }.steps li:first-child{padding-left:0}.steps li:last-child{border:0;padding-right:0}
.steps span { font:italic 29px Georgia,serif; color:#708575; }.steps h3 { margin:18px 0 13px; }.steps p { font-size:14px; line-height:1.9; }
.visit-notes { margin-top:36px; padding:32px 0; border-block:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; gap:70px; }
.visit-notes h3 { margin-bottom:15px; }.visit-notes p { font-size:14px; }.visit-notes .small { font-size:12px; margin-top:12px; }
.doctor-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:85px; align-items:start; }
.portrait-slot { height:370px; border:1px solid var(--line); background:var(--soft); display:flex; flex-direction:column; align-items:center; justify-content:center; }
.portrait-slot p { font:24px var(--serif); }.portrait-slot .small { margin-top:12px; }
.doctor-title { margin-top:25px; font-size:13px; }.doctor-name { font:30px/1.7 var(--serif); margin:8px 0; letter-spacing:.08em; }
.doctor-name span { font:13px Georgia,serif; margin-left:18px; letter-spacing:.05em; }.doctor-context { font-size:13px; color:var(--muted); }
.profile { font-size:14px; margin:25px 0 0; }.profile>div { display:grid; grid-template-columns:70px 1fr; gap:22px; padding:16px 0; border-bottom:1px solid var(--line); }.profile dd { margin:0; color:var(--muted); }
.doctor-photo { width:100%; height:100%; object-fit:cover; filter:saturate(.8); }
/* 6. Access, questions, and appointment */
.access-grid { display:grid; grid-template-columns:1fr 1.25fr; gap:60px; }.access-grid h3 { margin-bottom:20px; }.access-grid p { font-size:15px; }
.access-grid iframe { width:100%; height:380px; border:0; filter:saturate(.6); }
.access-details { font-size:13px; margin:25px 0 0; }.access-details>div { display:flex; gap:22px; padding:10px 0; }.access-details dt { min-width:70px; }.access-details dd { margin:0; }
.hours { margin-top:50px; }.hours h3 { margin-bottom:20px; }.table-scroll { overflow:auto; }
table { border-collapse:collapse; width:100%; text-align:center; font-size:14px; }th { font-weight:500; }th,td { padding:17px 10px; border-bottom:1px solid var(--line); }thead { background:var(--soft); }caption { text-align:left; caption-side:bottom; padding-top:15px; }
.faq { border-top:1px solid var(--line); }.faq h2 { margin-bottom:35px; }
details { border-bottom:1px solid var(--line); }summary { padding:24px 42px 24px 0; cursor:pointer; list-style:none; position:relative; font-size:15px; transition:color .35s; }summary::-webkit-details-marker { display:none; }
summary:after { content:'+'; position:absolute; right:8px; top:15px; font:26px Georgia,serif; color:var(--green); }details[open] summary:after { content:'−'; }summary:hover { color:var(--green); }details>p { padding:0 35px 25px 0; font-size:14px; max-width:880px; line-height:2.1; }
.reserve { border-block:1px solid var(--line); text-align:center; }.reserve h2 { font-size:40px; }.reserve p { margin-top:20px; }.reserve .button { margin-top:28px; min-width:300px; }.reserve-tel { display:inline-block; font:30px Georgia,serif; letter-spacing:.06em; margin-top:22px; }.reserve-tel+.small { margin-top:12px; }
.sns { padding-block:65px; display:flex; align-items:center; justify-content:space-between; gap:30px; }.sns .eyebrow { margin-bottom:12px; }.sns h2 { font-size:25px; }.sns p { font-size:14px; margin-top:14px; }
.social-links { display:flex; gap:16px; }.social-button { width:56px; height:56px; border-radius:50%; background:#e1e9df; position:relative; display:grid; place-items:center; transition:background .4s; }.social-button img { width:25px; height:25px; object-fit:contain; transition:opacity .4s; }.social-button:after { content:''; position:absolute; width:25px; height:25px; mask:var(--icon) center/contain no-repeat; -webkit-mask:var(--icon) center/contain no-repeat; background:#fff; opacity:0; transition:opacity .4s; }.social-button:hover,.social-button:focus-visible { background:var(--green); }.social-button:hover img,.social-button:focus-visible img { opacity:0; }.social-button:hover:after,.social-button:focus-visible:after { opacity:1; }
footer { border-top:1px solid var(--line); padding:45px 0 22px; }.footer-top { display:flex; align-items:center; gap:45px; }.footer-top>p { font-size:12px; }.back-top { margin-left:auto; white-space:nowrap; font-size:12px; }.footer-bottom { margin-top:30px; border-top:1px solid var(--line); padding-top:20px; display:flex; justify-content:space-between; font-size:11px; color:var(--muted); }.footer-bottom small { font-size:11px; }
/* 7. Motion: only opacity and transforms; no content dependency on JavaScript. */
@keyframes entrance { from{opacity:0;transform:translate3d(0,13px,0)}to{opacity:1;transform:translate3d(0,0,0)} }
html[data-motion=active] .hero-copy>.eyebrow { animation:entrance 1s .05s both; }
html[data-motion=active] .hero-line { animation:entrance 1.1s .2s both; }
html[data-motion=active] .hero-line:nth-child(2) { animation-delay:.38s; }
html[data-motion=active] .hero-description { animation:entrance 1s .6s both; }
html[data-motion=active] .hero-buttons { animation:entrance 1s .8s both; }
html[data-motion=active] .hero-location { animation:entrance 1s 1s both; }
html[data-motion=active] .motion-enter { animation:entrance .95s cubic-bezier(.2,.65,.3,1) var(--motion-delay,0ms) both; }
html[data-motion=active] .motion-focused { animation:none; }
html[data-motion=paused] *,html[data-motion=paused] *:before,html[data-motion=paused] *:after { animation:none!important; transition:none!important; }
html[data-motion=paused] { scroll-behavior:auto; }
/* 8. Tablet and mobile */
@media(max-width:1200px) { #header{gap:15px;padding:0 24px}nav{gap:12px}nav a{font-size:12px}.brand strong{font-size:16px}.header-tel{font-size:13px}.header-actions{gap:12px}.wrap{width:calc(100% - 70px)} }
@media(max-width:767px) {
 #menu{display:flex;width:40px;height:44px;border:0;background:none;flex-direction:column;justify-content:center;gap:7px;padding:7px}#menu span{display:block;width:25px;height:1px;background:var(--ink)}
 nav{display:none;position:absolute;top:112px;left:0;right:0;background:#fff;padding:20px 25px;max-height:calc(100svh - 112px);overflow:auto}nav.open{display:flex;flex-direction:column;gap:0}nav a{font-size:14px;padding:12px 0;border-bottom:1px solid var(--line)}nav a:after{bottom:0}.mobile-nav{display:block}.header-actions{margin-left:auto}
 .section{padding-block:85px}.message,.doctor-grid{gap:45px}.section-top{gap:30px}.symptoms{gap:22px}.symptoms article{padding-right:18px}.symptoms ul{font-size:13px}.steps li{padding-inline:13px}.steps p{font-size:13px}.access-grid{gap:30px}.hero-copy{width:65%;margin-left:6%}.hero-image{width:61%}h1{font-size:40px}
}
@media(max-width:700px) {
 html{scroll-padding-top:128px}.wrap{width:calc(100% - 40px)}
 #header{height:110px;padding:10px 16px;flex-wrap:wrap;align-content:center;gap:8px 12px}.brand{gap:3px;max-width:calc(100% - 42px)}.brand strong{font-size:16px}.logo-slot{font-size:10px}.header-actions{width:100%;margin:0;gap:16px}.header-tel{font-size:14px}.button.compact{min-height:30px;padding:4px 18px;font-size:12px;margin-left:auto}#menu{position:absolute;right:14px;top:18px}nav{top:110px}
 #hero{height:auto;min-height:0;padding:0 0 48px;flex-direction:column;overflow:visible}.hero-image{position:relative;top:auto;right:auto;width:100%;height:290px;margin-top:110px;order:-1}.hero-image img{object-position:65% center}.hero-image:after{background:linear-gradient(0deg,#fff 0%,transparent 25%)}.hero-image figcaption{bottom:13px;right:12px;font-size:10px}.hero-copy{width:calc(100% - 40px);margin:0 auto;padding-top:25px}.hero-copy .eyebrow{font-size:11px;margin-bottom:17px}h1{font-size:30px;line-height:1.85;letter-spacing:.06em}h2{font-size:28px;letter-spacing:.08em}.hero-description{font-size:13px;line-height:2.1;margin-top:20px}.hero-buttons{gap:25px;margin-top:25px}.hero-buttons .button{font-size:12px;padding:13px 21px;min-height:48px}.text-button{font-size:13px}.hero-location{font-size:11px;margin-top:28px}.hero-location span{margin-inline:6px}
 .news{padding-block:22px;gap:12px;flex-wrap:wrap}.news .eyebrow{width:100%}.news>p:nth-child(2){width:100%;font-size:13px}.news>a{margin-left:0}
 .section{padding-block:68px}.eyebrow{font-size:12px;margin-bottom:17px}.message{grid-template-columns:1fr;gap:30px}.message-portrait{width:160px;height:100px;margin-top:25px}.message-body{font-size:14px;line-height:2.3}.message-body br{display:none}.message-signature strong{font-size:23px}.section-top{display:block;margin-bottom:30px}.section-top>p{margin-top:24px;font-size:14px}
 .symptoms{grid-template-columns:1fr;margin-top:35px;gap:30px}.symptoms article,.symptoms article:last-child{padding:0 0 28px;border-right:0;border-bottom:1px solid var(--line)}.symptom-heading{margin-bottom:16px}.symptoms h3{font-size:24px}.symptoms ul{font-size:14px}.symptoms li{padding:9px 0}.care-description{grid-template-columns:1fr;gap:25px;margin-top:30px}.care-description p{font-size:14px}
 .steps{grid-template-columns:1fr;margin-top:25px}.steps li,.steps li:first-child,.steps li:last-child{display:grid;grid-template-columns:40px 65px 1fr;gap:12px;align-items:start;border-right:0;border-bottom:1px solid var(--line);padding:22px 0}.steps h3{margin:0;font-size:16px}.steps span{font-size:25px}.steps p{font-size:13px}.visit-notes{grid-template-columns:1fr;gap:25px;padding:25px 0}.visit-notes h3{font-size:17px}
 .doctor-grid{grid-template-columns:1fr;gap:35px}.portrait-slot{height:250px}.doctor-name{font-size:27px}.doctor-name span{font-size:12px;margin-left:12px}.profile{font-size:13px}.profile>div{grid-template-columns:60px 1fr;gap:15px}
 .access-grid{grid-template-columns:1fr;gap:30px}.access-grid iframe{height:280px}.hours{margin-top:35px}table{font-size:12px}th,td{padding:13px 7px}.small,.draft-note{font-size:12px}summary{font-size:14px;padding-right:28px}details>p{font-size:14px;padding-right:10px}.reserve h2{font-size:30px}.reserve p{font-size:14px}.reserve .button{min-width:265px}.reserve-tel{font-size:28px}
 .sns{padding-block:45px;display:block}.sns h2{font-size:22px}.social-links{margin-top:22px}.social-links:empty{margin:0}footer{padding-top:35px}.footer-top{flex-wrap:wrap;gap:22px;align-items:flex-start}.footer-top .brand{max-width:100%}.footer-top>p{font-size:12px;width:100%;margin:0}.back-top{margin-left:0}.footer-bottom{display:block;font-size:10px}.footer-bottom span{display:block;margin-top:7px}
}
@media(prefers-reduced-motion:reduce) { *,*:before,*:after{animation:none!important;transition:none!important}html{scroll-behavior:auto} }

/* Supplied Canva artwork: original pixels, whitespace framed in CSS only. */
.logo-slot.supplied-logo{display:block;position:relative;width:172px;height:96px;overflow:hidden;flex:none}
.logo-slot.supplied-logo img{position:absolute;width:300px;height:300px;max-width:none;left:-65px;top:-99px}
.director-grid{margin-top:85px;padding-top:75px;border-top:1px solid var(--line)}
.director-portrait{margin:0;max-width:355px}
.director-portrait>img{width:100%;height:auto;display:block;filter:saturate(.85)}
.director-portrait figcaption{font-size:11px;color:var(--muted);margin-top:12px}
.director-portrait figcaption a,.doctor-source a{text-decoration:underline;text-underline-offset:3px}
.doctor-source{margin-top:22px}
@media(max-width:700px){
 #header .brand{max-width:none;height:51px}
 #header .logo-slot.supplied-logo{width:158px;height:53px}
 #header .logo-slot.supplied-logo img{width:170px;height:170px;left:-6px;top:-57px}
 .director-grid{margin-top:45px;padding-top:45px}
 .director-portrait{max-width:300px}
}

@media(max-width:700px){
 html{scroll-padding-top:151px}
 #header{height:136px}
 #header .brand{height:78px}
 #header .logo-slot.supplied-logo{width:152px;height:78px}
 #header .logo-slot.supplied-logo img{width:245px;height:245px;left:-47px;top:-82px}
 nav{top:136px;max-height:calc(100svh - 136px)}
 .hero-image{margin-top:136px}
}

/* 9. Editorial refinement and laptop navigation */
.hero-description,.message-body,.section-top>p,.steps p,.visit-notes p,
.symptoms ul,.care-description p,.access-grid p,.profile,details>p{font-size:1rem}
.category-intro,summary,.access-details{font-size:.9375rem}
.brand{flex-shrink:0}
nav a{font-size:.875rem}
.hero-buttons .button{min-width:180px}
@media(min-width:768px) and (max-width:1199px){
 #header{height:142px;display:grid;grid-template-columns:auto 1fr;padding:8px 30px;gap:0 28px}
 #header .brand{grid-row:1 / 3}
 #navigation{grid-column:2;grid-row:2;display:flex;position:static;margin:0;justify-content:flex-end;gap:20px;padding:0 0 10px;background:none}
 #navigation a{font-size:.875rem}
 #navigation .mobile-nav{display:none}
 .header-actions{grid-column:2;grid-row:1;justify-content:flex-end}
 #menu{display:none}
 html{scroll-padding-top:166px}
 #hero{padding-top:142px}
 .hero-image{top:142px;height:calc(100% - 158px)}
 .message,.doctor-grid{gap:42px}
}
@media(min-width:768px) and (max-width:900px){#navigation{gap:13px}#navigation a{font-size:.8125rem}}
@media(max-width:767px){
 .hero-description,.message-body,.section-top>p,.steps p,.visit-notes p,
 .symptoms ul,.care-description p,.access-grid p,.profile,details>p{font-size:1rem}
 .steps li,.steps li:first-child,.steps li:last-child{grid-template-columns:36px 1fr;gap:8px 16px}
 .steps p{grid-column:2}.steps h3{align-self:center}
 .care-description>div{display:block}.care-description h3{margin-bottom:12px}
 .hero-buttons{gap:20px}.hero-buttons .button{min-width:0;font-size:.875rem}
 .text-button{font-size:.875rem}#navigation a{font-size:1rem}
 .button.compact{min-height:38px;font-size:.875rem}
 .portrait-slot{height:210px}.profile>div{grid-template-columns:65px 1fr}
 .table-scroll{border:1px solid var(--line)}table{min-width:560px}
 .reserve .button{min-width:0;width:min(100%,340px)}
}
@media(min-width:701px) and (max-width:767px){
 #header{height:112px}.hero-copy{width:70%}.header-actions{gap:10px}
}

.steps #booking-step{font:inherit;color:inherit}

/* 10. Fixed-height header and supplied emblem lockups */
:root{--header-height:96px}
html{scroll-padding-top:calc(var(--header-height) + 20px)}
#header{height:var(--header-height);display:flex;padding:0 3%;gap:24px;flex-wrap:nowrap}
#header .brand{height:auto;max-width:none;grid-row:auto}
.logo-slot.logo-lockup{display:flex;align-items:center;gap:12px;color:var(--green);font-size:inherit}
.logo-mark{position:relative;display:block;flex:none;width:54px;height:58px;overflow:hidden}
.logo-mark img{position:absolute;width:357.6px;height:357.6px;max-width:none;left:-152px;top:-123px}
.logo-wordmark{display:flex;flex-direction:column;gap:5px}
.logo-wordmark strong{font:400 19px/1.5 var(--serif);letter-spacing:.06em}
.logo-wordmark small{font:10px/1.5 Georgia,serif;letter-spacing:.16em}
#navigation{position:static;display:flex;margin-left:auto;padding:0;gap:18px;background:none}
#navigation .mobile-nav{display:none}
.header-actions{margin:0;gap:16px;grid-column:auto;grid-row:auto}
#hero{padding-top:var(--header-height)}
.hero-image{top:var(--header-height);height:calc(100% - var(--header-height) - 16px)}
#footer .logo-lockup{flex-direction:column;text-align:center;gap:10px}
#footer .logo-wordmark{align-items:center}
@media(min-width:768px) and (max-width:1199px){
 #header{display:grid;grid-template-columns:auto 1fr;gap:0 22px;padding:8px 24px}
 #header .brand{grid-row:1 / 3}
 #navigation{grid-column:2;grid-row:2;justify-content:flex-end;gap:14px;padding:0}
 #navigation a{font-size:13px}
 .header-actions{grid-column:2;grid-row:1;justify-content:flex-end;gap:14px}
 .logo-wordmark strong{font-size:16px}.logo-lockup{gap:6px}
 .logo-wordmark small{font-size:9px}
}
@media(min-width:768px) and (max-width:900px){
 #header{gap:0 12px;padding-inline:18px}
 #navigation{gap:11px}#navigation a{font-size:12px}
 #header .logo-wordmark strong{font-size:14px}
 #header .logo-mark{width:42px;height:48px}#header .logo-mark img{width:286px;height:286px;left:-122px;top:-99px}
}
@media(max-width:767px){
 :root{--header-height:96px}
 #header{display:grid;grid-template-columns:1fr auto;padding:7px 16px;gap:4px 10px}
 #header .brand{grid-column:1;grid-row:1}
 #header .logo-lockup{gap:8px}
 #header .logo-mark{width:36px;height:40px}
 #header .logo-mark img{width:250px;height:250px;left:-107px;top:-87px}
 #header .logo-wordmark strong{font-size:16px}
 #header .logo-wordmark small{font-size:9px;letter-spacing:.12em}
 .header-actions{display:flex;grid-column:1 / 3;grid-row:2;width:100%;gap:14px;margin:0}
 .header-tel{font-size:14px}.button.compact{margin-left:auto;min-height:32px;padding:4px 17px;font-size:13px}
 #menu{display:flex;position:absolute;right:15px;top:7px;width:40px;height:40px}
 #navigation{display:none;position:absolute;top:var(--header-height);left:0;right:0;max-height:calc(100svh - var(--header-height));overflow:auto;background:#fff;padding:16px 22px;margin:0}
 #navigation.open{display:flex;flex-direction:column;gap:0}
 #navigation a{font-size:15px}#navigation .mobile-nav{display:block}
 #hero{padding-top:0;display:flex;flex-direction:column;height:auto;min-height:0}
 .hero-image{position:relative;top:auto;width:100%;height:290px;margin-top:var(--header-height);order:-1}
 .hero-copy{width:calc(100% - 40px);margin-inline:auto}
}
/* 11. Hero crop and balanced calls to action */
.hero-buttons{gap:30px;align-items:center}
.hero-buttons .button,.hero-buttons .text-button{font-size:14px;line-height:24px;letter-spacing:.07em}
.hero-buttons .button{padding:15px 34px;min-height:56px;min-width:0}
.hero-buttons .text-button{display:inline-flex;align-items:center;justify-content:center;padding:15px 0;min-height:56px;border-bottom:0;position:relative}
.hero-buttons .text-button:after{content:'';position:absolute;left:0;right:0;bottom:7px;height:1px;background:#abbcaf;transition:background .4s}
.hero-buttons .text-button:hover{box-shadow:none}.hero-buttons .text-button:hover:after{background:var(--green)}
@media(max-width:767px){
 .hero-image{height:clamp(200px,33svh,280px);overflow:hidden}
 .hero-image img{object-fit:cover;object-position:88% 55%;width:135%;height:120%;margin-left:-35%;margin-top:-6%;max-width:none;transform-origin:80% 55%}
 .hero-image:after{background:linear-gradient(0deg,#fff 0%,#ffffff50 9%,transparent 22%)}
 .hero-copy{padding-top:14px}
 .hero-buttons{gap:24px;margin-top:24px}
 .hero-buttons .button,.hero-buttons .text-button{font-size:14px;line-height:24px}
 .hero-buttons .button{padding:14px 32px;min-height:54px}
 .hero-buttons .text-button{padding:14px 0;min-height:54px}
 .hero-description{max-width:34em}
}
@media(max-width:359px){
 .hero-buttons{gap:18px}.hero-buttons .button{padding-inline:24px}
 .hero-buttons .button,.hero-buttons .text-button{font-size:13px}
 .hero-image{height:clamp(180px,30svh,230px)}
}
@media(max-width:359px){.hero-copy h1{font-size:26px;letter-spacing:.04em}}


/* 12. Calm opening: stationary scene, a single local bloom. */
.botanical-motion{position:relative;width:100%;height:100%}
@keyframes calm-appear{from{opacity:0}to{opacity:1}}
@keyframes calm-copy{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
html[data-motion=active] .hero-image,html[data-motion=active] .hero-copy{transform:none;will-change:auto}
html[data-motion=active] .hero-image img,html[data-motion=active] .hero-image:after{animation:none;transform:none}
html[data-motion=active] .botanical-motion{animation:calm-appear 3.8s ease-out both}
html[data-motion=active] .hero-copy>.eyebrow{animation:calm-copy 3s .1s both}
html[data-motion=active] .hero-line{animation:calm-copy 3s .35s both}
html[data-motion=active] .hero-line:nth-child(2){animation-delay:.65s}
html[data-motion=active] .hero-description{animation:calm-copy 3s .9s both}
html[data-motion=active] .hero-buttons{animation:calm-copy 3s 1.2s both}
html[data-motion=active] .hero-location{animation:calm-copy 3s 1.4s both}
html[data-motion=active] .motion-enter{animation:calm-copy 1.8s ease-out var(--motion-delay,0ms) both}
.bloom{position:absolute;right:18%;top:34%;width:180px;height:180px;pointer-events:none}
.bloom-state{position:absolute;inset:0;background-image:url('assets/bloom-sprite.png');background-size:200% 100%;background-repeat:no-repeat}
.bloom-bud{background-position:left center;opacity:0}
.bloom-flower{background-position:right center;opacity:1;left:4.06%;right:-4.06%}
@keyframes bud-to-flower{0%,35%{opacity:1}100%{opacity:0}}
@keyframes flower-open{0%,35%{opacity:0}100%{opacity:1}}
html[data-motion=active] .bloom-bud{animation:bud-to-flower 10s ease-in-out both}
html[data-motion=active] .bloom-flower{animation:flower-open 10s ease-in-out both;transform-origin:50% 75%}
@media(max-width:767px){.bloom{right:18%;top:24%;width:140px;height:140px}}
@media(prefers-reduced-motion:reduce){.bloom-bud{opacity:0}.bloom-flower{opacity:1;transform:none}}
/* Anchor the bloom within the foreground foliage. */
.bloom{right:7%;top:auto;bottom:9%;width:180px;height:180px;mask-image:linear-gradient(to bottom,#000 0%,#000 63%,transparent 91%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 63%,transparent 91%)}
@media(max-width:767px){.bloom{right:4%;top:auto;bottom:0;width:140px;height:140px}}