:root{--ink:#17211d;--muted:#5f6f67;--paper:#f7faf8;--white:#fff;--line:#d5e0da;--green:#176b52;--green-dark:#104535;--green-light:#e4f1eb;--coral:#d95f45;--yellow:#f2c14f;--max:980px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.5;margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}.demo-header{align-items:center;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);display:flex;height:62px;justify-content:space-between;padding:0 max(20px,calc((100vw - var(--max))/2));position:sticky;top:0;z-index:20}.demo-brand{align-items:center;color:var(--ink);display:flex;font-size:15px;font-weight:700;gap:9px;text-decoration:none}.demo-brand span{align-items:center;background:var(--green);border-radius:5px;color:#fff;display:flex;font-size:10px;height:28px;justify-content:center;width:28px}.demo-header>strong{background:var(--green-light);border:1px solid #bdd8ca;border-radius:4px;color:var(--green-dark);font-size:10px;padding:5px 8px;text-transform:uppercase}.property-hero{color:#fff;height:440px;overflow:hidden;position:relative}.property-photo{background-image:url('assets/harbor-house-hero.png');background-position:center;background-size:cover;inset:0;position:absolute}.property-hero:after{background:rgba(11,29,21,.46);content:"";inset:0;position:absolute}.property-heading{bottom:46px;left:max(20px,calc((100vw - var(--max))/2));position:absolute;right:20px;z-index:1}.property-heading p{font-size:12px;font-weight:700;margin:0 0 8px;text-transform:uppercase}.property-heading h1{font-size:48px;letter-spacing:0;line-height:1.02;margin:0 0 12px}.property-heading span{font-size:15px}.quick-answer{background:#fff;border-bottom:1px solid var(--line);display:grid;gap:8px;grid-template-columns:repeat(5,1fr);margin:0 auto;max-width:var(--max);padding:16px 20px;position:sticky;top:62px;z-index:15}.quick-answer button{background:#f3f7f5;border:1px solid transparent;border-radius:5px;color:var(--green-dark);cursor:pointer;font-size:13px;font-weight:700;min-height:46px;padding:9px}.quick-answer button:hover,.quick-answer button:focus-visible{background:var(--green-light);border-color:var(--green)}.quick-answer button span{color:var(--coral);font-size:10px;margin-right:6px}.guide-content{margin:0 auto;max-width:var(--max);padding:72px 20px 130px}.guide-intro{border-bottom:1px solid var(--line);display:grid;gap:24px;grid-template-columns:1fr 1fr;padding-bottom:52px}.eyebrow{color:var(--coral);font-size:11px;font-weight:700;margin:0 0 9px;text-transform:uppercase}.guide-intro h2,.guide-section h2{font-size:34px;letter-spacing:0;line-height:1.12;margin:0}.guide-intro>p{color:var(--muted);margin:28px 0 0}.guide-section{border-bottom:1px solid var(--line);display:grid;gap:28px;grid-template-columns:60px 1fr;padding:64px 0;scroll-margin-top:136px}.section-number{align-items:center;background:var(--green);border-radius:5px;color:#fff;display:flex;font-size:13px;font-weight:700;height:42px;justify-content:center;width:42px}.section-copy>p:not(.eyebrow):not(.small-note){color:var(--muted);font-size:17px;max-width:700px}.instruction-list{display:grid;gap:10px;margin-top:26px}.instruction-list div{background:#fff;border:1px solid var(--line);border-radius:6px;display:grid;gap:14px;grid-template-columns:150px 1fr;padding:16px}.instruction-list span{color:var(--muted)}.visual-note{align-items:center;background:var(--green-dark);border-radius:6px;color:#fff;display:grid;gap:24px;grid-template-columns:130px 1fr;margin-top:24px;padding:24px}.visual-note>span{border:2px solid var(--yellow);font-size:20px;font-weight:700;padding:18px;text-align:center}.visual-note p{margin:0}.wifi-card{background:#fff;border:1px solid var(--line);border-radius:6px;display:grid;gap:12px;margin-top:24px;padding:22px}.wifi-card div{display:grid;gap:4px}.wifi-card span{color:var(--muted);font-size:11px;text-transform:uppercase}.wifi-card strong{font-size:20px}.wifi-card button{background:var(--coral);border:0;border-radius:5px;color:#fff;cursor:pointer;font-weight:700;min-height:44px}.small-note{color:var(--muted);font-size:12px}.checkout-list{display:grid;gap:10px;list-style:none;margin:24px 0 0;padding:0}.checkout-list li{align-items:center;background:#fff;border:1px solid var(--line);border-radius:6px;display:grid;gap:14px;grid-template-columns:34px 1fr;padding:14px}.checkout-list span{align-items:center;background:var(--green-light);border-radius:50%;color:var(--green-dark);display:flex;font-size:12px;font-weight:700;height:30px;justify-content:center;width:30px}.demo-note{align-items:center;background:var(--green-dark);bottom:0;color:#fff;display:flex;gap:18px;justify-content:center;left:0;padding:13px 20px;position:fixed;right:0;z-index:25}.demo-note span{background:var(--coral);border-radius:4px;font-size:10px;font-weight:700;padding:5px 7px;text-transform:uppercase}.demo-note p{font-size:12px;margin:0}.demo-note a{color:#fff;font-size:12px;font-weight:700;margin-left:12px}button:focus-visible,a:focus-visible{outline:3px solid rgba(242,193,79,.8);outline-offset:2px}@media(max-width:650px){.property-hero{height:360px}.property-heading h1{font-size:38px}.quick-answer{gap:6px;grid-template-columns:repeat(5,minmax(74px,1fr));overflow-x:auto;padding:12px}.quick-answer button{font-size:11px}.guide-content{padding:54px 16px 150px}.guide-intro{gap:10px;grid-template-columns:1fr}.guide-intro>p{margin-top:0}.guide-section{gap:14px;grid-template-columns:42px 1fr;padding:50px 0}.guide-section h2{font-size:29px}.instruction-list div{gap:5px;grid-template-columns:1fr}.visual-note{grid-template-columns:1fr}.demo-note{align-items:flex-start;flex-direction:column;gap:3px}.demo-note a{margin:4px 0 0}}