/* Customer experience: real spaces, plain prices, room to breathe. */
:root { --porcelain:#fff; --cloud:#eef4f2; --hairline:#dfe6e4; --ink:#252c2d; --slate:#65716f; --spruce:#187b9c; --spruce-deep:#115d79; --radius:8px; --shell:1120px; }
body { font-size:16px; line-height:1.65; }
h1,h2,h3,.eyebrow,.button,.site-header nav a,.shift-label { letter-spacing:0; }
.skip-link { position:fixed; z-index:100; top:8px; left:12px; background:white; padding:10px 16px; transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.site-header,.site-header.stuck { position:sticky; top:0; height:76px; padding:0 max(24px,calc((100% - 1240px)/2)); background:#fffffff5; backdrop-filter:blur(14px); box-shadow:none; border-bottom:1px solid #e8edeb; }
.site-header .logo-light { display:none; } .site-header .logo-dark { display:block; }
.site-header .logo img { width:125px; height:auto; }
.site-header nav { gap:26px; }
.site-header nav a,.site-header.stuck nav a { color:#4f5e5b; font-size:13px; }
.site-header nav a:hover,.site-header.stuck nav a:hover { color:#087eaa; border-color:#087eaa; }
.site-header nav .brue-nav,.site-header.stuck nav .brue-nav { color:#327753; font-weight:600; }
.site-header .header-cta { border:1px solid #cddbd5; background:#fff; color:#273c34; border-radius:5px; min-height:40px; padding:0 17px; font-size:13px; }
.button { border-radius:5px; min-height:46px; font-size:14px; padding:0 22px; }
.eyebrow { font-size:11px; font-weight:600; }
.hero { min-height:460px; height:min(640px,calc(100svh - 156px)); }
.hero > img { object-position:center 53%; }
.hero-shade { background:linear-gradient(90deg,rgba(17,29,30,.77),rgba(17,29,30,.16) 65%,rgba(17,29,30,.02)); }
.hero-inner { padding:60px 0; }
.hero-inner h1 { font-size:62px; line-height:1.05; max-width:700px; margin-top:16px; }
.hero-inner h1 span { display:block; font-size:28px; font-style:italic; margin-top:10px; color:#dcebe6; }
.hero-inner > p { font-size:19px; line-height:1.5; margin-top:22px; }
.hero-inner > p.eyebrow { font-size:11px; margin:0; }
.hero-actions { margin-top:28px; gap:24px; } .hero-actions a { font-size:13px; }
.hero-inner small { font-size:12px; color:#edf2ef; margin-top:24px; }
.welcome-strip { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:22px max(24px,calc((100% - 1120px)/2)); border-bottom:1px solid var(--hairline); font-size:12px; }
.welcome-strip > * { display:flex; align-items:center; gap:8px; color:#52615d; }
.welcome-strip img { width:17px; height:17px; } .welcome-strip strong { color:#263833; font-weight:600; }
.brue { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); padding:68px max(24px,calc((100% - 1080px)/2)); gap:70px; background:#193d34; color:#f3faf6; }
.brue-visual { height:420px; border-radius:4px; box-shadow:none; }
.brue-stamp { font-size:22px; bottom:22px; } .brue-stamp i { color:#e3edb9; }
.brue-copy h2 { font-size:43px; line-height:1.12; max-width:500px; margin:14px 0 20px; }
.brue .eyebrow { color:#c7daac; } .brue-copy > p { font-size:15px; line-height:1.7; color:#ccddd4; }
.brue-copy .coffee-invitation { padding-top:18px; margin-top:18px; border-top:1px solid #426256; color:#f3faf6; }
.brue-actions { gap:18px; margin-top:26px; flex-wrap:wrap; }
.coffee-button { background:#dfecb9; color:#183b2b; } .coffee-button:hover { background:#edf6d4; }
.brue .text-button { font-size:12px; text-decoration-color:#799c87; }
.word-line { margin-top:24px; font-size:11px; color:#9fbead; } .word-line span { color:#9fbead; }
.video-toggle { border-radius:4px; font-size:0; width:36px; min-width:36px; height:36px; padding:0; }
.video-toggle::after { content:"Ⅱ"; font-size:16px; } .video-toggle[aria-label^="Play"]::after { content:"▶"; font-size:13px; }
.experience,.memberships,.faq { padding-block:72px; }
.section-intro { margin-bottom:30px; } .section-intro h2 { font-size:38px; max-width:620px; margin-top:10px; }
.section-intro > p:not(.eyebrow),.section-intro > div > p:not(.eyebrow) { font-size:14px; color:var(--slate); margin-top:14px; }
.experience { border-bottom:1px solid var(--hairline); }
.experience-viewer { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:50px; background:none; border:0; border-radius:0; }
.experience-photo { border-radius:4px; aspect-ratio:16/10; height:auto; }
.experience-photo img { width:100%; height:100%; object-fit:cover; }
.experience-copy { padding:0; align-self:center; } .experience-copy h3 { font-size:34px; margin:14px 0; }
.experience-copy p { font-size:15px; max-width:34ch; } .slider-controls { margin-top:26px; }
.slider-controls button { width:40px; height:40px; border-radius:50%; font-size:18px; }
.memberships-intro { margin-bottom:24px; }
.shift-strip { grid-template-columns:1fr 1fr; gap:24px; padding:18px 0; margin:0 0 28px; border:0; border-top:1px solid var(--hairline); border-bottom:1px solid var(--hairline); border-radius:0; }
.shift-label { font-size:10px; margin:0 0 3px; } .shift-strip strong { font-size:12px; } .shift-strip em { font-size:11px; }
.plan-carousel { margin-top:0; }
.plan-viewport { overflow:visible; cursor:auto; border:0; border-radius:0; touch-action:auto; }
.plan-track { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; transform:none; }
.plan-slide { display:flex; flex-direction:column; min-width:0; width:auto; flex:none; min-height:0; border:1px solid var(--hairline); border-radius:6px; background:white; overflow:hidden; }
.plan-slide-photo { width:100%; aspect-ratio:4/3; min-height:0; height:auto; }
.plan-slide-photo img { width:100%; height:100%; object-fit:cover; }
.plan-slide-body { display:flex; flex-direction:column; align-items:flex-start; padding:24px; gap:0; flex:1; }
.plan-slide-body h3 { font-size:28px; margin:8px 0 12px; }
.plan-slide-body .eyebrow { font-size:10px; }
.plan-essence { font-size:13px; line-height:1.65; }
.plan-slide .plan-points { margin:18px 0 22px; gap:7px; }
.plan-points li { font-size:12px; line-height:1.5; padding-left:17px; }
.plan-points li::before { width:10px; height:10px; top:4px; color:#40876a; }
.plan-slide .plan-price { font-family:inherit; font-size:24px; font-weight:500; padding:0; margin: auto 0 14px; }
.plan-price small { font-family:inherit; font-size:11px; font-weight:400; color:#65716f; }
.plan-cta { font-size:12px; font-weight:600; margin:0; color:#17799d; border-bottom:1px solid #b9d9e2; padding-bottom:4px; }
.plan-slide-hours { grid-column:1/-1; background:#f0f5f3; border:0; border-radius:0; }
.plan-slide-hours .plan-slide-body { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:28px; padding:22px 26px; max-width:none; }
.plan-slide-hours .eyebrow { grid-column:1/-1; color:#5b796a; }
.plan-slide-hours h3 { font-size:23px; color:#263a32; margin:5px 0 8px; }
.plan-slide-hours .plan-essence { grid-column:1; color:#5a7064; max-width:68ch; }
.plan-slide-hours .plan-price { grid-column:2; grid-row:2; margin:0; font-size:23px; color:#263a32; align-self:center; }
.plan-slide-hours .plan-price small { color:#65716f; }
.plan-slide-hours .plan-cta { grid-column:2; grid-row:3; color:#327753; border-color:#c3d8ce; align-self:center; }
.plan-slide-hours .hours-block,.plan-slide-hours .plan-points { display:none; }
.plan-rooms { grid-template-columns:1fr 1fr; gap:42px; margin-top:48px; border:0; border-radius:0; padding:0; background:none; }
.plan-rooms-photos { display:block; min-height:0; }
.plan-rooms-photos img { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; border-radius:4px; }
.plan-rooms-body { padding:8px 0; } .plan-rooms-body h3 { font-size:34px; margin:12px 0; }
.plan-rooms-body .plan-price { font-family:inherit; font-size:24px; margin:18px 0; }
.plan-rooms-body .plan-points { margin:18px 0; }
.short-stay-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:48px 0 16px; }
.short-stay-heading h3 { font-size:27px; } .short-stay-heading a { font-size:12px; }
.short-stay-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--hairline); border-bottom:1px solid var(--hairline); }
.short-stay-options a { display:grid; gap:9px; padding:24px; border-right:1px solid var(--hairline); color:var(--ink); }
.short-stay-options a:first-child { padding-left:0; } .short-stay-options a:last-child { border:0; }
.short-stay-options a:hover { background:#f5f9f7; }
.short-stay-options span { font-size:13px; } .short-stay-options span:last-child { color:var(--slate); font-size:12px; }
.short-stay-options strong { font-weight:500; font-size:23px; } .short-stay-options small { font-size:11px; color:var(--slate); font-weight:400; }
.short-stays { padding:0; margin-top:20px; font-size:12px; max-width:none; background:none; border:0; }
.amenities { background:#eef4f2; padding:64px 0; }
.amenity-layout { grid-template-columns:1fr 1.25fr; gap:50px; }
.amenity-list { gap:0; } .amenity-list button { border:0; border-bottom:1px solid #d7e2dc; border-radius:0; padding:20px 0 20px 25px; font-size:14px; text-align:left; background:none; }
.amenity-list button::before { left:0; } .amenity-list button.active { background:none; color:#157451; }
.amenity-photo { border-radius:4px; height:350px; }
.amenity-photo img { width:100%; height:100%; object-fit:cover; }
.invitation { min-height:400px; } .invitation-copy { width:min(1120px,calc(100% - 48px)); padding:66px 0; }
.invitation-copy h2 { font-size:43px; max-width:600px; } .invitation-copy p { font-size:15px; max-width:48ch; }
.invitation-shade { background:linear-gradient(90deg,#172925d9,#17292533); }
.faq { display:grid; grid-template-columns:1fr 1.5fr; gap:60px; }
.faq .section-intro h2 { font-size:34px; }
.faq-grid { display:block; border-top:1px solid var(--hairline); }
.faq-item { border-bottom:1px solid var(--hairline); padding:18px 0; }
.faq-item summary { cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:24px; font-size:14px; font-weight:500; list-style:none; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:"+"; font-size:21px; color:var(--slate); flex:none; }
.faq-item[open] summary::after { content:"−"; }
.faq-item p { font-size:13px; line-height:1.75; margin:12px 0 0; }
.location { display:grid; width:100%; margin:0; grid-template-columns:1.4fr 1fr; gap:60px; padding:54px max(24px,calc((100% - 1120px)/2)); background:#f3f6f7; }
.location h2 { font-size:36px; } .location > div > p { font-size:14px; }
.location .location-context { font-size:12px; max-width:70ch; }
.entrance-note img { max-height:170px; width:auto; border-radius:3px; }
.entrance-note { display:flex; align-items:center; gap:18px; } .entrance-note figcaption { font-size:12px; max-width:180px; }
.contact-list a { font-size:15px; padding:18px 0; overflow-wrap:anywhere; }
footer { padding:40px max(24px,calc((100% - 1120px)/2)) 90px; background:#202d2d; gap:22px; }
footer > img { width:110px; } footer > p { font-size:21px; } footer nav { flex-wrap:wrap; gap:15px; } footer nav a,footer small { font-size:11px; }
.guide-launcher,.mobile-whatsapp { min-height:44px; border-radius:6px; font-size:12px; padding:0 15px; box-shadow:0 4px 18px #172d2420; }
.guide-launcher { bottom:20px; right:180px; background:white; color:#2b4941; border:1px solid #d5e2db; }
.guide-launcher-icon { width:24px; height:24px; font-size:12px; border-radius:4px; }
.mobile-whatsapp { bottom:20px; right:24px; background:#1d5641; }
.space-guide { border-radius:8px; bottom:76px; right:24px; width:370px; max-width:calc(100% - 32px); max-height:calc(100dvh - 100px); }
.guide-messages { min-height:120px; max-height:280px; } .guide-message { border-radius:6px; font-size:13px; }
.visit-dialog { border-radius:8px; max-height:calc(100dvh - 32px); overflow:auto; }
.visit-dialog h2 { font-size:32px; } .visit-dialog > form > p { font-size:14px; }
.visit-dialog input { border-radius:5px; min-height:44px; font-size:16px; }
.page-hero { padding:54px 0 30px; } .page-hero h1 { font-size:44px; max-width:24ch; }
.page-hero .lead { font-size:16px; max-width:65ch; } .page-body h2 { font-size:28px; margin-top:32px; }
.page-body p,.page-body ul li { font-size:15px; } .content-page .site-header { background:#fffffff5; }
@media (max-width:600px) {
  .price-table { table-layout:fixed; font-size:13px; }
  .price-table th,.price-table td { padding:14px 6px; overflow-wrap:anywhere; }
  .price-table td:last-child,.price-table th:last-child { white-space:normal; }
  .price-table .price { font-size:16px; }
}
@media (max-width:900px) {
  .site-header nav { gap:16px; } .site-header nav a { font-size:12px; }
  .brue { gap:34px; } .brue-copy h2 { font-size:35px; }
  .plan-track { gap:12px; } .plan-slide-body { padding:18px; } .plan-slide-body h3 { font-size:24px; }
  .plan-rooms { gap:28px; } .faq { gap:30px; } .welcome-strip { font-size:11px; gap:12px; }
}
@media (max-width:760px) {
  .shell { width:calc(100% - 36px); } .site-header,.site-header.stuck { height:64px; padding:0 18px; }
  .site-header .logo img { width:112px; } .menu-button span { background:var(--ink); }
  .site-header nav { padding:82px 24px 24px; background:#fff; border-bottom:1px solid var(--hairline); }
  .site-header nav a,.site-header.stuck nav a { color:#263c35; font-size:18px; }
  .menu-button[aria-expanded="true"] span:first-child,.menu-button[aria-expanded="true"] span:last-child { background:var(--ink); }
  .hero { height:calc(100svh - 168px); min-height:440px; max-height:590px; }
  .hero-inner { width:calc(100% - 40px); padding:36px 0; }
  .hero-inner h1 { font-size:42px; max-width:340px; } .hero-inner h1 span { font-size:23px; }
  .hero-inner > p { font-size:17px; } .hero-inner > p.eyebrow { font-size:10px; }
  .hero-inner small { font-size:11px; max-width:32ch; } .hero-actions { gap:18px; margin-top:24px; }
  .hero-actions .button { padding:0 18px; font-size:13px; } .hero-actions a { font-size:12px; }
  .hero-shade { background:linear-gradient(0deg,#142825cc,#14282510); }
  .welcome-strip { flex-wrap:wrap; justify-content:center; padding:16px 18px; gap:10px 18px; font-size:11px; }
  .welcome-strip > :last-child { display:none; }
  .brue { grid-template-columns:1fr; padding:42px 22px; gap:28px; }
  .brue-visual { height:310px; } .brue-copy h2 { font-size:34px; }
  .brue-copy > p { font-size:14px; } .brue-actions { margin-top:22px; }
  .experience,.memberships,.faq { padding-block:46px; }
  .section-intro h2 { font-size:31px; } .section-intro { margin-bottom:24px; }
  .experience-viewer { grid-template-columns:1fr; gap:22px; }
  .experience-copy { display:grid; grid-template-columns:1fr auto; gap:8px 18px; }
  .experience-copy > span { font-size:11px; } .experience-copy h3 { grid-column:1; margin:0; font-size:27px; }
  .experience-copy p { grid-column:1/-1; font-size:14px; max-width:none; }
  .slider-controls { grid-column:2; grid-row:1/3; margin:0; }
  .shift-strip { gap:16px; padding:16px 0; } .shift-strip strong { font-size:11px; } .shift-strip em { font-size:10px; }
  .plan-track { grid-template-columns:1fr; gap:20px; }
  .plan-slide { display:grid; grid-template-columns:1fr; }
  .plan-slide-photo { aspect-ratio:16/9; } .plan-slide-photo img { object-position:center 45%; }
  .plan-slide-body { padding:22px; } .plan-slide-body h3 { font-size:28px; }
  .plan-slide .plan-points { display:grid; grid-template-columns:1fr 1fr; column-gap:16px; row-gap:8px; margin:18px 0; }
  .plan-slide .plan-price { font-size:25px; margin-top:4px; }
  .plan-slide-hours .plan-slide-body { display:flex; padding:22px; } .plan-slide-hours .plan-points { display:none; }
  .plan-slide-hours .plan-price { margin:18px 0 12px; } .plan-slide-hours .plan-cta { align-self:flex-start; }
  .plan-rooms { grid-template-columns:1fr; margin-top:36px; gap:24px; } .plan-rooms-body h3 { font-size:30px; }
  .short-stay-heading { margin-top:34px; } .short-stay-heading h3 { font-size:25px; }
  .short-stay-options { grid-template-columns:1fr; }
  .short-stay-options a,.short-stay-options a:first-child { grid-template-columns:1fr auto; padding:17px 0; border-right:0; border-bottom:1px solid var(--hairline); }
  .short-stay-options strong { font-size:20px; } .short-stay-options span:last-child { grid-column:1/-1; }
  .amenities { padding:44px 0; } .amenity-layout { grid-template-columns:1fr; gap:20px; }
  .amenity-list { display:flex; flex-wrap:wrap; gap:6px; overflow:visible; width:100%; margin:0; padding:0; }
  .amenity-list button { flex:1 1 44%; padding:12px; font-size:12px; border:1px solid #ccdbd4; border-radius:5px; }
  .amenity-list button::before { display:none; } .amenity-list button.active { background:#fff; border-color:#5a947d; }
  .amenity-photo { height:260px; }
  .invitation { min-height:370px; } .invitation-copy { padding:44px 0; width:calc(100% - 40px); }
  .invitation-copy h2 { font-size:34px; } .invitation-copy p { font-size:14px; }
  .faq { grid-template-columns:1fr; gap:8px; } .faq .section-intro h2 { font-size:31px; }
  .location { grid-template-columns:1fr; padding:40px 22px; gap:24px; } .location h2 { font-size:31px; }
  .contact-list a { font-size:14px; }
  footer { padding:36px 22px 100px; }
  .mobile-whatsapp { bottom:max(12px,env(safe-area-inset-bottom)); right:14px; height:44px; }
  .guide-launcher { bottom:max(12px,env(safe-area-inset-bottom)); right:auto; left:14px; height:44px; }
  .space-guide { bottom:72px; right:12px; width:calc(100% - 24px); max-width:none; max-height:calc(100dvh - 94px); }
  .guide-messages { max-height:min(270px,calc(100dvh - 310px)); }
  .visit-dialog { width:calc(100% - 24px); padding:24px; } .visit-dialog h2 { font-size:29px; }
  .page-hero { padding:34px 0 24px; } .page-hero h1 { font-size:32px; } .page-hero .lead { font-size:15px; }
}
@media (max-width:360px) { .hero-inner h1 { font-size:36px; } .hero-actions { gap:14px; } .plan-slide .plan-points { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .hero-inner > * { animation:none; } }
