:root { --ink:#17251f; --muted:#637068; --paper:#f7f4ed; --white:#fffefa; --green:#173f32; --sage:#dfe8dc; --coral:#d65f45; --line:#d9ddd3; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.6; }
a { color:inherit; }
a:focus-visible, summary:focus-visible { outline:3px solid var(--coral); outline-offset:3px; }
img { display:block; max-width:100%; }
.skip-link { position:fixed; left:8px; top:8px; z-index:100; transform:translateY(-150%); padding:10px 14px; border:2px solid var(--ink); background:white; }
.skip-link:focus { transform:none; }
.site-header { position:relative; z-index:20; display:flex; align-items:center; justify-content:space-between; gap:30px; max-width:1320px; margin:auto; padding:20px 34px; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:11px; text-decoration:none; }
.brand>span { display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:var(--green); color:white; font:18px Georgia,serif; }
.brand strong,.brand small { display:block; line-height:1.1; }
.brand strong { font:20px Georgia,serif; }
.brand small { margin-top:4px; color:var(--muted); font:700 10px/1.2 system-ui,sans-serif; letter-spacing:.13em; text-transform:uppercase; }
.site-header nav { display:flex; align-items:center; gap:23px; font-size:13px; font-weight:700; }
.site-header nav>a,.room-menu summary { text-decoration:none; cursor:pointer; }
.site-header nav>a:hover,.site-header nav>a:focus-visible,.room-menu summary:hover { color:var(--coral); }
.room-menu { position:relative; }
.room-menu summary { list-style:none; }
.room-menu summary::-webkit-details-marker { display:none; }
.room-menu summary::after { content:' +'; color:var(--coral); }
.room-menu[open] summary::after { content:' −'; }
.room-menu-panel { position:absolute; right:0; top:32px; display:grid; grid-template-columns:repeat(2,minmax(125px,1fr)); width:320px; padding:10px; border:1px solid var(--line); border-radius:10px; background:var(--white); box-shadow:0 18px 50px #17251f24; }
.room-menu-panel a { padding:9px 10px; border-radius:6px; text-decoration:none; }
.room-menu-panel a:hover,.room-menu-panel a:focus-visible { background:var(--sage); }

main { min-height:70vh; }
.eyebrow { margin:0 0 9px; color:var(--coral); font-size:10px; font-weight:800; letter-spacing:.17em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1,h2,.hero aside h2,.access-reference h3,.downloads h3 { font-family:Georgia,"Times New Roman",serif; font-weight:400; letter-spacing:-.025em; }
.hero { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(270px,.65fr); gap:clamp(45px,9vw,130px); max-width:1250px; margin:auto; padding:clamp(80px,10vw,140px) 34px 110px; align-items:center; }
.hero h1 { max-width:800px; margin-bottom:24px; font-size:clamp(50px,7vw,92px); line-height:.98; }
.lede { max-width:680px; margin-bottom:28px; color:#4b5c53; font:24px/1.45 Georgia,serif; }
.edition { max-width:690px; padding:15px 18px; border-left:3px solid var(--coral); background:#fffaf2; color:var(--muted); font-size:13px; }
.edition strong { color:var(--ink); }
.hero aside { padding:36px 30px; border-radius:150px 150px 18px 18px; background:var(--green); color:white; text-align:center; }
.hero aside h2 { margin:12px 0; font-size:34px; }
.hero aside>p:not(.eyebrow) { color:#c1d0c7; font-size:13px; }
.button { display:inline-block; margin-top:16px; padding:10px 15px; border:1px solid #ffffff52; border-radius:30px; font-size:12px; font-weight:700; text-decoration:none; }
.button:hover { background:white; color:var(--green); }

.section { max-width:1320px; margin:auto; padding:100px 34px; border-top:1px solid var(--line); scroll-margin-top:10px; }
.section-heading { display:flex; gap:23px; margin-bottom:50px; align-items:flex-start; }
.section-heading>span { min-width:36px; margin-top:3px; color:var(--coral); font:16px Georgia,serif; }
.section-heading h2 { margin:0; font-size:clamp(42px,5vw,68px); line-height:1; }
.plan-section,.water-section,.questions-section { max-width:none; padding-left:max(34px,calc((100vw - 1252px)/2)); padding-right:max(34px,calc((100vw - 1252px)/2)); }
.plan-section { background:#edf1e9; }
.plan-layout { display:grid; grid-template-columns:minmax(360px,.9fr) minmax(320px,1.1fr); gap:clamp(45px,8vw,110px); align-items:center; }
.floor-plan { margin:0; }
.floor-plan-image { position:relative; width:min(100%,520px); margin:auto; }
.floor-plan-image>img { width:100%; height:auto; border-radius:12px; background:white; box-shadow:0 18px 55px #173f321b; }
.room-hotspot { position:absolute; transform:translate(-50%,-50%); padding:5px 8px; border:2px solid white; border-radius:20px; background:var(--green); color:white; font-size:10px; font-weight:800; line-height:1; text-decoration:none; white-space:nowrap; box-shadow:0 2px 8px #0004; }
.room-hotspot:hover,.room-hotspot:focus-visible { z-index:2; background:var(--coral); outline:3px solid #fff8; outline-offset:2px; }
.floor-plan figcaption,.photo figcaption { margin-top:9px; color:var(--muted); font-size:11px; line-height:1.45; }
.room-index { border-top:1px solid #cbd4c8; }
.room-index a { display:grid; grid-template-columns:1fr 1fr auto; gap:20px; align-items:center; padding:16px 4px; border-bottom:1px solid #cbd4c8; text-decoration:none; }
.room-index a:hover span { color:var(--coral); }
.room-index span { font:21px Georgia,serif; }
.room-index small { color:var(--muted); }
.room-index b { color:var(--coral); }

.water-layout { display:grid; grid-template-columns:minmax(380px,1.1fr) minmax(330px,.9fr); gap:clamp(45px,8vw,100px); align-items:start; }
.photo { margin:0; }
.photo img { width:100%; border-radius:12px; background:#e6e5df; box-shadow:0 16px 45px #17251f14; }
.water-layout .photo img { max-height:760px; object-fit:contain; background:white; }
.intro { color:#3c5045; font:23px/1.45 Georgia,serif; }
.valve-locations { margin:28px 0; border-top:1px solid var(--line); }
.valve-locations p { display:grid; grid-template-columns:45px 1fr; margin:0; padding:12px 0; border-bottom:1px solid var(--line); }
.valve-locations b { color:var(--coral); font:19px Georgia,serif; }
.valve-locations span { color:var(--muted); font-size:13px; }
.warning { margin-top:25px; padding:18px 20px; border:1px solid #e2b9ad; border-radius:9px; background:#fff6f1; }
.warning strong { display:block; margin-bottom:4px; font-size:13px; }
.warning p { margin:0; color:#5d675f; font-size:13px; }

.gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:38px 18px; }
.gallery .photo img { aspect-ratio:4/3; object-fit:cover; }
.access-reference { display:grid; grid-template-columns:1.1fr 1fr 1fr; gap:24px; margin-top:90px; padding-top:45px; border-top:1px solid var(--line); }
.access-reference>div { padding-right:20px; }
.access-reference h3 { margin-bottom:12px; font-size:38px; }
.access-reference>div p:last-child { color:var(--muted); font-size:13px; }
.access-reference .photo img { aspect-ratio:4/5; object-fit:cover; }
.questions-lede { max-width:780px; margin:-20px 0 45px 60px; color:#4f6057; font:20px/1.45 Georgia,serif; }
.questions-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; border:1px solid var(--line); background:var(--line); }
.questions-grid article { min-height:225px; padding:27px; background:var(--paper); }
.questions-grid article>span { color:var(--coral); font:14px Georgia,serif; }
.questions-grid h3 { margin:42px 0 8px; font:23px Georgia,serif; }
.questions-grid p { margin:0; color:var(--muted); font-size:13px; }

.room-hero { display:grid; grid-template-columns:1.4fr .6fr; gap:70px; max-width:1250px; margin:auto; padding:75px 34px 90px; align-items:center; }
.room-hero h1 { margin:12px 0 18px; font-size:clamp(49px,7vw,86px); line-height:1; }
.room-hero>div>p:not(.eyebrow) { max-width:640px; color:#4f6057; font:22px/1.45 Georgia,serif; }
.back-link { display:inline-block; margin-bottom:55px; color:var(--muted); font-size:12px; font-weight:700; text-decoration:none; }
.dimension { display:inline-block; padding:6px 10px; border-radius:20px; background:var(--sage); font-size:11px; font-weight:700; }
.floor-plan.compact .floor-plan-image { width:min(100%,250px); }
.floor-plan.compact .room-hotspot { width:13px; height:13px; padding:0; border-width:2px; overflow:hidden; color:transparent; }
.floor-plan.compact figcaption { text-align:center; }
.room-content,.appliance-section,.room-questions { max-width:none; padding-left:max(34px,calc((100vw - 1252px)/2)); padding-right:max(34px,calc((100vw - 1252px)/2)); }
.room-content { background:#edf1e9; }
.facts { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; border:1px solid #cfd8cc; background:#cfd8cc; }
.facts div { min-height:120px; padding:24px; background:#f7faf4; }
.facts span,.facts strong { display:block; }
.facts span { margin-bottom:16px; color:var(--muted); font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.facts strong { font:23px Georgia,serif; }
.empty-state { max-width:740px; padding:25px; border-left:3px solid var(--coral); background:#f8faf5; color:var(--muted); }
.appliance-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:80px; align-items:start; }
.identity { display:grid; grid-template-columns:repeat(2,1fr); margin-bottom:35px; border-top:1px solid var(--line); }
.identity p { margin:0; padding:13px 0; border-bottom:1px solid var(--line); }
.identity span,.identity b { display:block; }
.identity span { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.1em; }
.steps { margin:0; padding:0; counter-reset:step; list-style:none; }
.steps li { position:relative; padding:15px 0 15px 42px; border-bottom:1px solid var(--line); counter-increment:step; }
.steps li::before { content:counter(step); position:absolute; left:0; top:14px; display:grid; place-items:center; width:27px; height:27px; border-radius:50%; background:var(--sage); font:13px Georgia,serif; }
.steps b,.steps span { display:block; }
.steps b { font-size:14px; }
.steps span { color:var(--muted); font-size:13px; }
.downloads { display:grid; grid-template-columns:1.3fr repeat(2,1fr); gap:1px; margin-top:70px; background:#355449; border:1px solid #355449; }
.downloads h3,.downloads a { margin:0; padding:17px 20px; background:var(--green); color:white; }
.downloads h3 { font-size:25px; }
.downloads a { display:flex; justify-content:space-between; gap:15px; text-decoration:none; font-size:12px; }
.downloads a:hover span { color:#f2ae91; }
.downloads a b { color:#f2ae91; font-size:9px; letter-spacing:.1em; }
.source-note { margin-top:14px; color:var(--muted); font-size:11px; }
.two-photos { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.two-photos img { aspect-ratio:4/3; object-fit:cover; }
.room-questions .questions-grid article { min-height:170px; }

footer { display:grid; grid-template-columns:auto 1fr auto; gap:30px; align-items:start; max-width:1320px; margin:auto; padding:45px 34px 60px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; }
footer strong,footer span { display:block; }
footer nav { display:flex; flex-wrap:wrap; justify-content:center; gap:8px 18px; }
footer nav a,footer>a { text-decoration:none; }
footer a:hover { color:var(--coral); }

@media (max-width:900px) {
  .site-header nav>a:nth-of-type(2),.site-header nav>a:nth-of-type(4) { display:none; }
  .hero,.room-hero { grid-template-columns:1fr .58fr; gap:45px; }
  .plan-layout,.water-layout,.appliance-grid { grid-template-columns:1fr; }
  .floor-plan-image { width:min(100%,480px); }
  .gallery { grid-template-columns:repeat(2,1fr); }
  .access-reference { grid-template-columns:1fr 1fr; }
  .access-reference>div { grid-column:1/-1; }
  .questions-grid { grid-template-columns:repeat(2,1fr); }
  .downloads { grid-template-columns:repeat(2,1fr); }
  .downloads h3 { grid-column:1/-1; }
}

@media (max-width:640px) {
  html { scroll-behavior:auto; }
  .site-header { padding:15px 18px; }
  .brand>span { width:40px; height:40px; }
  .brand strong { font-size:17px; }
  .site-header nav>a { display:none; }
  .room-menu-panel { position:fixed; left:12px; right:12px; top:70px; width:auto; grid-template-columns:repeat(2,1fr); }
  .hero { display:block; padding:72px 18px; }
  .hero h1 { font-size:clamp(48px,14vw,68px); }
  .lede { font-size:20px; }
  .hero aside { margin-top:45px; padding:30px; border-radius:110px 110px 16px 16px; }
  .section,.plan-section,.water-section,.questions-section,.room-content,.appliance-section,.room-questions { padding:70px 18px; }
  .section-heading { gap:12px; margin-bottom:38px; }
  .section-heading>span { min-width:27px; }
  .section-heading h2 { font-size:43px; }
  .plan-layout { gap:45px; }
  .room-hotspot { padding:4px 6px; font-size:8px; border-width:1px; }
  .room-index a { grid-template-columns:1fr auto; }
  .room-index small { display:none; }
  .gallery,.questions-grid,.facts,.two-photos { grid-template-columns:1fr; }
  .access-reference { grid-template-columns:1fr; }
  .access-reference>div { grid-column:auto; }
  .questions-lede { margin:-15px 0 35px 39px; font-size:17px; }
  .questions-grid article { min-height:190px; }
  .room-hero { display:grid; grid-template-columns:1fr; padding:55px 18px 70px; }
  .room-hero .floor-plan { display:none; }
  .back-link { margin-bottom:45px; }
  .room-hero h1 { font-size:51px; }
  .downloads { grid-template-columns:1fr; }
  .downloads h3 { grid-column:auto; }
  footer { grid-template-columns:1fr; padding:38px 18px; }
  footer nav { justify-content:flex-start; }
}

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media print {
  .site-header nav,.skip-link,.room-hotspot { display:none; }
  .section,.hero,.room-hero { max-width:none; padding-left:18mm; padding-right:18mm; }
  .section { break-before:page; }
  .photo img { box-shadow:none; }
}
