:root{
  --paper:#f8f8f3;
  --white:#fff;
  --ink:#17201c;
  --sage:#b9c8b7;
  --deep:#355c4c;
  --deep-hover:#29483c;
  --soft:#e9eee7;
  --line:#ccd3ca;
  --muted:#5f6d65;
  --serif:Georgia,"Times New Roman",serif;
  --sans:Arial,Helvetica,sans-serif;
  --header-h:89px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 18px)}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
body.menu-open{overflow:hidden}
a{color:inherit}
button,input,textarea,select{font:inherit}
img{max-width:100%}

.skip{position:fixed;left:14px;top:12px;z-index:2000;transform:translateY(-160%);padding:10px 14px;background:var(--white);border:1px solid var(--line);text-decoration:none;transition:transform .18s ease}
.skip:focus{transform:translateY(0)}
.wrap{width:min(1120px,calc(100% - 48px));margin-inline:auto}

.site-header{position:sticky;top:0;z-index:1000;background:rgba(248,248,243,.9);border-bottom:1px solid transparent;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.site-header.is-scrolled,.site-header.menu-active{border-bottom-color:rgba(204,211,202,.9);box-shadow:0 8px 28px rgba(23,32,28,.045);background:rgba(248,248,243,.96)}
.nav-shell{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0}
.brand>img{display:block;width:48px;height:48px;object-fit:contain;flex:0 0 auto}
.brand-copy{font:400 1.2rem var(--serif);letter-spacing:.04em;white-space:nowrap}
.brand-copy small{display:block;margin-top:3px;font:600 .56rem/1.2 var(--sans);text-transform:uppercase;letter-spacing:.29em;color:var(--muted)}

.desktop-nav{display:flex;gap:30px;align-items:center}
.desktop-nav a{position:relative;text-decoration:none;font-size:.78rem;color:#4e5c54;min-height:44px;display:inline-flex;align-items:center;transition:color .18s ease}
.desktop-nav a:not(.call)::after{content:"";position:absolute;left:0;right:100%;bottom:8px;height:1px;background:var(--deep);transition:right .2s ease}
.desktop-nav a:hover,.desktop-nav a:focus-visible{color:var(--deep)}
.desktop-nav a:hover::after,.desktop-nav a:focus-visible::after{right:0}
.call{border-bottom:1px solid var(--deep);color:var(--deep)!important}

.menu-toggle{display:none;align-items:center;gap:10px;min-height:44px;padding:0 2px;border:0;background:transparent;color:var(--ink);cursor:pointer}
.menu-label{font-size:.74rem;letter-spacing:.08em;text-transform:uppercase}
.menu-icon{position:relative;display:block;width:24px;height:16px}
.menu-icon i{position:absolute;left:0;width:24px;height:1px;background:currentColor;transition:transform .22s ease,top .22s ease}
.menu-icon i:first-child{top:4px}.menu-icon i:last-child{top:11px}
.menu-toggle[aria-expanded="true"] .menu-icon i:first-child{top:8px;transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] .menu-icon i:last-child{top:8px;transform:rotate(-45deg)}
.mobile-menu{display:none}

.label{text-transform:uppercase;letter-spacing:.21em;font-size:.62rem;font-weight:600;color:#56645c}
.hero{min-height:690px;display:grid;grid-template-columns:1fr 1fr;gap:clamp(52px,7vw,105px);align-items:center;padding:68px 0 108px}
.hero h1{font:400 clamp(4rem,7.5vw,7.7rem)/.9 var(--serif);letter-spacing:-.06em;margin:28px 0 32px}
.hero h1 em{font-weight:400;color:var(--deep)}
.hero p{color:#5d6a63;max-width:500px}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;margin-top:32px}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 19px;background:var(--deep);color:#fff;text-decoration:none;font-size:.78rem;letter-spacing:.04em;border:1px solid var(--deep);transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}
.btn:hover{background:var(--deep-hover);border-color:var(--deep-hover);box-shadow:0 8px 18px rgba(53,92,76,.12)}
.btn:active{transform:translateY(1px);box-shadow:none}
.btn:focus-visible,.text-link:focus-visible,.desktop-nav a:focus-visible,.mobile-nav a:focus-visible,.menu-toggle:focus-visible,.contact-grid a:focus-visible,.brand:focus-visible{outline:2px solid var(--deep);outline-offset:4px}
.text-link{display:inline-flex;align-items:center;min-height:44px;text-underline-offset:5px;font-size:.78rem;color:#334139}

.image{aspect-ratio:4/3;background:var(--soft);position:relative;overflow:hidden}
.image:before{content:"";position:absolute;width:92%;height:88%;left:4%;bottom:0;border-radius:50% 50% 0 0;background:var(--sage)}
.image img{position:absolute;width:86%;height:82%;left:7%;top:9%;object-fit:cover;border:3px solid var(--paper);border-radius:50% 50% 4px 4px;box-shadow:0 18px 25px rgba(53,92,76,.27)}

.quiet-bar{border-block:1px solid var(--line);padding:25px 0}
.quiet-bar .wrap{display:grid;grid-template-columns:repeat(3,1fr)}
.quiet-bar .wrap>div{text-align:center;font:italic 1rem var(--serif)}
.quiet-bar .wrap>div+div{border-left:1px solid var(--line)}

section{padding:115px 0}
#approach,#care,#visit{scroll-margin-top:calc(var(--header-h) + 18px)}
.intro{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px}
.intro h2,.visit h2{font:400 clamp(3rem,5.5vw,5.8rem)/.96 var(--serif);letter-spacing:-.05em;margin:12px 0 30px}
.intro-copy>p{font:400 1.25rem/1.55 var(--serif);max-width:620px}
.principles{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:55px}
.principles>div{border-top:1px solid var(--line);padding-top:18px;transition:border-color .18s ease,transform .18s ease}
.principles>div:hover{border-color:#a7b4aa;transform:translateY(-2px)}
.principles small{display:block;color:#5f6d65;font-size:.63rem;font-weight:600;letter-spacing:.12em}
.principles strong{font:400 1.12rem var(--serif)}

.care{background:var(--deep);color:#fff}
.care .label{color:#d6e1db}
.care-head{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end;margin-bottom:70px}
.care h2{font:400 clamp(3.2rem,6vw,6.5rem)/.91 var(--serif);letter-spacing:-.055em;margin:12px 0 0}
.care-head>p{margin:0;color:#d0dbd5;max-width:510px}
.care-list{border-top:1px solid #769085}
.care-item{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr) minmax(260px,.8fr);gap:32px;align-items:center;border-bottom:1px solid #769085;padding:36px 14px;transition:background .22s ease,padding-left .22s ease,padding-right .22s ease}
.care-item:hover{background:rgba(255,255,255,.045);padding-left:22px;padding-right:22px}
.care-number{font:italic 1.1rem var(--serif);color:#c4d2ca}
.care-item h3{font:400 1.9rem/1.15 var(--serif);margin:0}
.care-item p{margin:0;color:#d0dbd5;font-size:.92rem;line-height:1.65}

.pause{background:var(--white);overflow:hidden}
.pause-grid{display:grid;grid-template-columns:minmax(340px,.9fr) minmax(0,1.1fr);gap:clamp(64px,8vw,118px);align-items:center}
.pause-visual{position:relative;width:min(100%,470px);aspect-ratio:4/5;margin:0;justify-self:center;isolation:isolate}
.pause-visual::before{content:"";position:absolute;inset:0 8% 3% 2%;background:var(--soft);border-radius:48% 48% 26px 26px / 36% 36% 26px 26px;z-index:-2}
.pause-visual::after{content:"";position:absolute;inset:6% 2% 10% 10%;border:1px solid var(--line);border-radius:48% 48% 22px 22px / 36% 36% 22px 22px;z-index:-1}
.pause-photo{position:absolute;inset:7% 9% 17% 9%;overflow:hidden;border:3px solid var(--paper);border-radius:47% 47% 18px 18px / 34% 34% 18px 18px;background:#d8d1c8;box-shadow:0 20px 38px rgba(53,92,76,.16)}
.pause-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.pause-visual figcaption{position:absolute;right:0;bottom:4%;width:min(86%,360px);padding:18px 22px;background:var(--paper);border:1px solid var(--line);font:italic clamp(1.2rem,2vw,1.65rem)/1.2 var(--serif);color:var(--deep);box-shadow:0 12px 28px rgba(23,32,28,.08)}
.pause h2{font:400 clamp(3rem,5.2vw,5.5rem)/.95 var(--serif);letter-spacing:-.05em;margin:14px 0 25px}
.pause p{color:#59665f}

.visit{padding-bottom:50px}
.visit-exterior{width:min(900px,100%);margin:0 auto 60px;background:var(--soft);padding:10px;overflow:hidden}
.visit-exterior img{display:block;width:100%;height:auto}
.visit-head{display:flex;justify-content:space-between;align-items:end;gap:50px;border-bottom:1px solid var(--line);padding-bottom:45px}
.visit h2{max-width:700px}
.contact-grid{display:grid;grid-template-columns:2fr 1fr 1fr}
.contact-grid>div{padding:28px 18px 28px 0;border-right:1px solid var(--line)}
.contact-grid>div+div{padding-left:25px}
.contact-grid>div:last-child{border:0}
.contact-grid small{display:block;text-transform:uppercase;letter-spacing:.15em;font-size:.59rem;font-weight:600;color:#5b6961;margin-bottom:7px}
.contact-grid a{text-underline-offset:4px;overflow-wrap:anywhere}
.contact-grid .mini-map{grid-column:1/-1;height:280px;padding:0;border:1px solid var(--line)}
.mini-map iframe{width:100%;height:100%;border:0;display:block;filter:saturate(.6) sepia(.08)}

footer{padding:30px 0;color:#66736b;font-size:.76rem}
.foot{display:flex;justify-content:space-between}

@media(max-width:900px){
  .hero{gap:48px}
  .care-item{grid-template-columns:58px minmax(0,1fr) minmax(220px,.72fr);gap:24px}
}

@media(max-width:800px){
  :root{--header-h:75px}
  .wrap{width:min(calc(100% - 28px),1120px)}
  .nav-shell{height:var(--header-h)}
  .brand>img{width:42px;height:42px}
  .brand-copy{font-size:1.05rem}
  .brand-copy small{font-size:.53rem;letter-spacing:.24em}
  .desktop-nav{display:none}
  .menu-toggle{display:inline-flex}
  .mobile-menu{display:block;position:fixed;left:0;right:0;top:var(--header-h);height:calc(100dvh - var(--header-h));background:var(--paper);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px);transition:opacity .2s ease,transform .2s ease,visibility .2s ease;border-top:1px solid var(--line);overflow:auto}
  .site-header.menu-active .mobile-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
  .mobile-nav{display:flex;flex-direction:column;padding-top:34px;padding-bottom:34px}
  .mobile-nav a{display:grid;grid-template-columns:44px 1fr;align-items:center;min-height:70px;border-bottom:1px solid var(--line);text-decoration:none;font:400 clamp(1.65rem,8vw,2.5rem)/1 var(--serif);letter-spacing:-.025em}
  .mobile-nav a>span{font:600 .62rem/1 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:#627068}
  .mobile-nav .mobile-call{margin-top:24px;min-height:58px;padding:0 16px;background:var(--deep);color:#fff;border:0;font:500 1rem var(--sans);letter-spacing:.03em;grid-template-columns:58px 1fr}
  .mobile-nav .mobile-call>span{color:#dce6e0}

  .hero{grid-template-columns:1fr;gap:42px;min-height:auto;padding:42px 0 68px}
  .hero h1{font-size:clamp(3rem,14vw,3.65rem);margin:22px 0 26px}
  .hero-actions{margin-top:28px}
  .image{max-width:500px;width:100%}

  .quiet-bar .wrap{grid-template-columns:1fr}
  .quiet-bar .wrap>div+div{border-left:0;border-top:1px solid var(--line);padding-top:15px;margin-top:15px}
  .intro,.care-head,.pause-grid{grid-template-columns:1fr;gap:35px}
  .principles{grid-template-columns:1fr;margin-top:42px}

  .care-head{margin-bottom:50px}
  .care-item{grid-template-columns:42px minmax(0,1fr);gap:10px 18px;padding:29px 4px;align-items:start}
  .care-item:hover{padding-left:4px;padding-right:4px;background:transparent}
  .care-number{padding-top:4px}
  .care-item h3{font-size:1.55rem}
  .care-item p{grid-column:2;color:#d4ded8;font-size:.9rem;max-width:520px}

  .pause-visual{max-width:460px}
  .visit-exterior{margin-bottom:42px}
  .visit-head{display:block}
  .visit-head .btn{margin-top:10px}
  .contact-grid{grid-template-columns:1fr}
  .contact-grid>div,.contact-grid>div+div{padding:20px 0;border-right:0;border-bottom:1px solid var(--line)}
  .contact-grid a{display:inline-flex;min-height:36px;align-items:center}
  .contact-grid .mini-map{padding:0;height:260px}
  .foot{flex-direction:column;gap:7px}
  section{padding:78px 0}
}

@media(max-width:800px){
  .pause-grid{gap:48px}
  .pause-visual{justify-self:start}
}

@media(max-width:430px){
  .brand-copy small{letter-spacing:.19em}
  .hero{padding-top:34px}
  .hero h1{font-size:clamp(2.9rem,15.4vw,3.45rem)}
  .hero-actions{align-items:flex-start}
  .text-link{margin-left:0}
  .care h2{font-size:3rem}
  .pause-visual{width:min(100%,390px);aspect-ratio:4/5}
  .pause-visual figcaption{width:88%;padding:15px 17px;font-size:1.15rem}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
