:root { --nav-h: 92px; }
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
.skip-link { position:absolute; left:16px; top:-80px; z-index:1000; background:var(--navy-deep); color:var(--white); padding:10px 14px; border-radius:var(--radius-pill); }
.skip-link:focus { top:16px; }
.site-nav { position: fixed; top:0; left:0; right:0; z-index:50; display:flex; align-items:center; justify-content:space-between; padding: 12px clamp(18px, 5vw, 56px); transition: background var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out); border-bottom:1px solid transparent; }
.site-nav.is-scrolled { background: rgba(253,251,248,.91); backdrop-filter: blur(12px); border-color: var(--border-hairline); }
.brand img { width:76px; height:76px; filter: brightness(0) invert(1) drop-shadow(0 1px 8px rgba(8,30,52,.45)); transition: filter var(--dur-base) var(--ease-out), width var(--dur-base) var(--ease-out), height var(--dur-base) var(--ease-out); }
.site-nav.is-scrolled .brand img { filter:none; width:64px; height:64px; }
.site-nav nav { display:flex; align-items:center; gap: clamp(14px, 3vw, 38px); }
.site-nav nav a, .nav-cta { color:var(--white); text-shadow:0 1px 10px rgba(8,30,52,.55); font: 600 var(--text-sm)/1 var(--font-ui); letter-spacing: var(--tracking-ui); background:none; border:0; cursor:pointer; }
.site-nav.is-scrolled nav a, .site-nav.is-scrolled .nav-cta { color:var(--navy); text-shadow:none; }
.nav-cta { padding: 13px 17px; border-radius: var(--radius-sm); background: var(--nantucket-red); color: var(--white) !important; }
.hero { position:relative; min-height: min(94vh, 820px); display:flex; align-items:flex-end; overflow:hidden; }
.hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-scrim { position:absolute; inset:0; background: linear-gradient(105deg, rgba(8,30,52,.84), rgba(8,30,52,.46) 40%, rgba(8,30,52,.06) 74%), linear-gradient(to top, rgba(8,30,52,.72), transparent 58%); }
.hero-content { position:relative; max-width: 1010px; padding: calc(var(--nav-h) + 70px) clamp(22px,6vw,80px) clamp(46px,7vw,86px); }
.hero h1 { max-width: 13.5ch; margin-bottom:24px; color:var(--white); font-size: var(--display-hero); line-height: .91; font-weight: var(--weight-medium); letter-spacing: -0.045em; text-shadow: 0 2px 28px rgba(8,30,52,.55); }
.hero-lede { max-width: 40rem; color:rgba(255,255,255,.96); font: 400 var(--text-2xl)/1.45 var(--font-body); letter-spacing: -0.01em; text-shadow: 0 1px 14px rgba(8,30,52,.5); }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin: 32px 0 22px; }
.hero-proof { color:rgba(255,255,255,.92); font: 500 var(--text-sm)/1.45 var(--font-ui); letter-spacing: .015em; margin:0; }
.btn { display:inline-flex; justify-content:center; align-items:center; min-height:48px; padding: 14px 19px; border-radius: var(--radius-sm); border:1px solid transparent; font:600 var(--text-sm)/1 var(--font-ui); letter-spacing:var(--tracking-ui); cursor:pointer; transition: transform var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out); text-decoration:none; }
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(1px); }
.btn-primary { background:var(--navy); color:var(--white); }
.btn-primary:hover { background:var(--navy-deep); color:var(--white); }
.btn-accent { background:var(--nantucket-red); color:var(--white); }
.btn-accent:hover { background:var(--crimson); color:var(--white); }
.btn-outline-light { color:var(--white); border-color:rgba(255,255,255,.55); background:rgba(255,255,255,.06); }
.btn-soft { background: var(--paper); color: var(--navy-deep); }
.editorial-intro { padding: clamp(64px, 10vw, 130px) clamp(22px,5vw,56px); }
.measure { max-width: var(--measure); margin-inline:auto; }
.editorial-intro h2 { font-size: var(--display-md); line-height:1.16; font-weight:var(--weight-medium); letter-spacing:-0.03em; }
.editorial-intro p:not(.ct-caption) { font-size: var(--text-lg); line-height: var(--leading-relaxed); }
.wide { max-width: var(--container-wide); margin-inline:auto; padding-inline: clamp(22px,5vw,56px); }
.work-band { padding: clamp(54px,8vw,96px) 0; background:var(--surface-band); }
.section-heading { max-width: 46rem; margin-bottom: clamp(32px, 5vw, 56px); }
.section-heading h2 { font-size: var(--display-xl); line-height:.98; font-weight:var(--weight-medium); }
.section-heading p:not(.ct-eyebrow) { font-size:var(--text-lg); color:var(--text-muted); }
.work-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:24px; }
.work-card { background:var(--surface-card); border:1px solid var(--border-hairline); border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-sm); transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); }
.work-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.work-card img { width:100%; aspect-ratio: 3 / 2; object-fit:cover; }
.work-card div { padding:24px 24px 26px; }
.work-card span { display:inline-flex; margin-bottom:12px; padding:6px 10px; border-radius:var(--radius-pill); background:rgba(135,155,132,.15); color:var(--sage-deep); font-family:var(--font-ui); font-weight:var(--weight-bold); font-size:var(--text-2xs); letter-spacing:var(--tracking-wider); text-transform:uppercase; }
.work-card h3 { margin-bottom: 7px; font-size: clamp(1.45rem, 2vw, 1.9rem); }
.process { padding: clamp(60px, 9vw, 120px) 0; }
.process-grid { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: clamp(24px,4vw,48px); }
.process-card img { aspect-ratio: 3 / 2; width:100%; object-fit:cover; border-radius:var(--radius-md); box-shadow:var(--shadow-sm); margin-bottom:22px; }
.step { margin:0 0 8px; font-family:var(--font-ui); font-weight:var(--weight-bold); font-size:var(--text-2xs); letter-spacing:var(--tracking-wider); color:var(--nantucket-red); }
.process-card h3 { font-size: clamp(1.45rem, 2vw, 1.9rem); }
.process-card p:last-child { color:var(--text-muted); font-size:var(--text-base); line-height:1.7; }
.availability { position:relative; overflow:hidden; padding: clamp(58px, 9vw, 118px) clamp(22px,5vw,56px); background:var(--surface-dark); color:var(--text-on-dark-muted); }
.availability h2 { color:var(--text-on-dark); font-size:var(--display-lg); line-height:.98; }
.availability-inner { max-width:var(--container); margin-inline:auto; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:40px; align-items:center; }
.badge { display:inline-flex; margin-bottom:18px; padding:7px 11px; border-radius:var(--radius-pill); border:1px solid rgba(175,194,180,.35); color:var(--celadon); font-family:var(--font-ui); font-weight:var(--weight-semibold); font-size:var(--text-xs); letter-spacing:var(--tracking-ui); }
.consultation { display:grid; grid-template-columns: .82fr 1.18fr; gap: clamp(28px,5vw,72px); max-width:var(--container); margin-inline:auto; padding: clamp(64px, 10vw, 128px) clamp(22px,5vw,56px); }
.consultation-copy h2 { font-size:var(--display-lg); line-height:1; }
.consultation-copy p:not(.ct-eyebrow):not(.ct-caption) { font-size:var(--text-lg); line-height:1.65; }
.lead-form { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding: clamp(22px,4vw,34px); background:var(--surface-card); border:1px solid var(--border-hairline); border-radius:var(--radius-md); box-shadow:var(--shadow-md); }
.lead-form label { display:grid; gap:8px; font:700 var(--text-sm)/1.3 var(--font-ui); letter-spacing:-0.01em; color:var(--navy-deep); }
.lead-form input, .lead-form select, .lead-form textarea { width:100%; border:1px solid var(--border-hairline); border-radius:var(--radius-sm); background:var(--surface-inset); color:var(--text-body); padding:14px 15px; font:400 var(--text-base)/1.4 var(--font-body); }
.lead-form input:focus, .lead-form select:focus, .lead-form textarea:focus { outline:3px solid var(--focus-ring); border-color:var(--navy); }
.full { grid-column: 1 / -1; }
.form-status { grid-column:1/-1; margin:0; color:var(--sage-deep); }
.footer { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; padding: clamp(42px,6vw,76px) clamp(22px,5vw,56px); background:var(--navy-deep); color:var(--text-on-dark-muted); }
.footer img { width:66px; height:66px; filter:brightness(0) invert(1); margin-bottom:14px; }
.footer p { margin:0; font-size:var(--text-sm); letter-spacing:.01em; }
.footer a { color:var(--text-on-dark); font-weight:var(--weight-semibold); }
.booking-panel { position:fixed; inset:0; z-index:100; display:flex; flex-direction:column; background:var(--paper); }
.booking-panel[hidden] { display:none; }
.panel-top { display:flex; justify-content:space-between; align-items:center; padding:20px clamp(22px,5vw,56px); border-bottom:1px solid var(--border-hairline); }
.panel-top img { width:44px; height:44px; }
.panel-top button { border:0; background:none; color:var(--text-muted); font-family:var(--font-ui); font-weight:var(--weight-bold); letter-spacing:var(--tracking-wider); text-transform:uppercase; cursor:pointer; }
.panel-body { flex:1; display:grid; place-content:center; max-width:34rem; margin:auto; padding:30px; }
.panel-body h2 { font-size:var(--display-md); }
.reveal { opacity:1; transform:none; }
.reveal.is-visible { opacity:1; transform:none; }
@media (max-width: 900px) { .site-nav nav a { display:none; } .work-grid, .process-grid, .consultation, .availability-inner { grid-template-columns:1fr; } .lead-form { grid-template-columns:1fr; } .footer { align-items:flex-start; flex-direction:column; } }
@media (max-width: 560px) { .brand img { width:62px; height:62px; } .site-nav.is-scrolled .brand img { width:54px; height:54px; } .hero { min-height: 88vh; } .hero-content { padding-inline:22px; } .hero h1 { font-size: clamp(3.35rem, 17vw, 4.7rem); } .work-grid { gap:16px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } .reveal { opacity:1; transform:none; transition:none; } }