:root { --ink:#00222d; --ocean:#035d6b; --cream:#f6f1e7; --coral:#fc4000; --teal:#2997a7; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:"Rethink Sans", "Avenir Next", Avenir, system-ui, sans-serif; -webkit-font-smoothing:antialiased; }
.hero { position:relative; min-height:100svh; display:flex; align-items:center; overflow:hidden; color:var(--cream); isolation:isolate; }
.hero__image, .hero__veil { position:absolute; inset:0; }
.hero__image { background:url("/images/hero-bay-mediterranean.jpg") center 45% / cover no-repeat; z-index:-2; transform:scale(1.015); }
.hero__veil { z-index:-1; background:linear-gradient(180deg, rgba(0,34,45,.7) 0%, rgba(0,34,45,.11) 35%, rgba(0,34,45,.35) 60%, rgba(0,34,45,.94) 100%); }
.nav { position:absolute; top:0; left:50%; width:min(100%, 1280px); transform:translateX(-50%); display:flex; align-items:center; justify-content:space-between; padding:28px 32px; }
.nav__logo { width:108px; height:auto; }
.nav__link, .scroll-link { color:inherit; text-decoration:none; font-size:13px; font-weight:600; letter-spacing:.01em; }
.nav__link { padding:10px 16px; border:1px solid rgba(246,241,231,.45); border-radius:999px; transition:background .2s ease; }
.nav__link:hover { background:rgba(246,241,231,.14); }
.hero__content { width:min(100% - 48px, 930px); margin:96px auto 0; text-align:center; animation:rise .8s ease both; }
.eyebrow { margin:0 0 18px; color:#d9ece8; font-size:11px; font-weight:700; letter-spacing:.17em; text-transform:uppercase; }
h1, h2 { margin:0; font-weight:600; letter-spacing:-.065em; line-height:.94; }
h1 { font-size:clamp(58px, 10vw, 136px); text-shadow:0 3px 20px rgba(0,34,45,.2); }
h1 em, h2 em { color:var(--coral); font-style:italic; font-weight:500; }
.hero__lead { max-width:475px; margin:30px auto; font-size:clamp(17px, 2vw, 20px); line-height:1.5; color:rgba(246,241,231,.9); }
.scroll-link { display:inline-flex; gap:10px; align-items:center; padding:13px 21px; border-radius:999px; background:var(--coral); transition:transform .2s ease, background .2s ease; }
.scroll-link:hover { background:#dc3500; transform:translateY(-2px); }
.hero__location { position:absolute; bottom:30px; left:50%; transform:translateX(-50%); margin:0; color:rgba(246,241,231,.8); font-size:11px; letter-spacing:.13em; text-transform:uppercase; white-space:nowrap; }
.hero__location span { color:var(--coral); margin:0 7px; }
.section { padding:clamp(82px, 12vw, 160px) max(24px, calc((100vw - 1152px) / 2)); }
.intro__grid { display:grid; grid-template-columns:1.15fr .85fr; gap:80px; align-items:end; }
h2 { font-size:clamp(45px, 6.3vw, 88px); }
.intro h2 em { color:var(--ocean); }
.intro__grid > p, .promise__card--copy > p:not(.eyebrow), .closing__content > p:not(.eyebrow) { margin:0; color:rgba(0,34,45,.72); font-size:17px; line-height:1.65; }
.eyebrow--dark { color:var(--coral); }
.promise { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding-top:0; }
.promise__card { min-height:440px; overflow:hidden; border-radius:24px; }
.promise__card--image { grid-row:span 2; background:var(--ocean); }
.promise__card--image img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.promise__card--copy { padding:clamp(38px, 5vw, 66px); background:var(--ocean); color:var(--cream); display:flex; flex-direction:column; justify-content:center; }
.promise__card--copy h2 { margin-bottom:28px; font-size:clamp(40px, 5vw, 68px); }
.promise__card--copy > p:not(.eyebrow) { color:rgba(246,241,231,.8); max-width:430px; }
.eyebrow--light { color:#b8d8d7; }
.promise__card--quote { position:relative; padding:42px; display:flex; flex-direction:column; justify-content:space-between; background:#d9ece8; }
.quote-mark { color:var(--coral); font-family:Georgia, serif; font-size:82px; line-height:.55; }
.promise__card--quote p { max-width:470px; margin:20px 0; font-size:clamp(25px, 3vw, 38px); line-height:1.12; letter-spacing:-.045em; }
.wave { color:var(--ocean); font-size:22px; letter-spacing:4px; }
.closing { position:relative; min-height:min(760px, 90svh); display:grid; place-items:center; color:var(--cream); isolation:isolate; overflow:hidden; }
.closing__image, .closing__overlay { position:absolute; inset:0; width:100%; height:100%; }
.closing__image { object-fit:cover; object-position:center; z-index:-2; }
.closing__overlay { z-index:-1; background:linear-gradient(90deg, rgba(0,34,45,.84), rgba(0,34,45,.28)); }
.closing__content { width:min(100% - 48px, 1152px); margin:auto; }
.closing__content h2 { font-size:clamp(55px, 8vw, 110px); margin-bottom:24px; }
.closing__content > p:not(.eyebrow) { max-width:400px; color:rgba(246,241,231,.9); }
.footer { min-height:138px; padding:30px max(24px, calc((100vw - 1152px) / 2)); display:flex; justify-content:space-between; align-items:center; gap:24px; }
.footer img { width:103px; }
.footer p { margin:0; color:rgba(0,34,45,.55); font-size:12px; }
@keyframes rise { from { opacity:0; transform:translateY(25px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:700px) { .nav { padding:20px 20px; } .nav__logo { width:95px; } .nav__link { padding:8px 11px; font-size:11px; } .hero__content { width:min(100% - 36px, 600px); } .hero__lead { margin:25px auto; font-size:16px; } .section { padding:88px 24px; } .intro__grid, .promise { grid-template-columns:1fr; gap:16px; } .intro__grid { gap:30px; } .promise { padding-top:0; } .promise__card { min-height:360px; } .promise__card--image { grid-row:auto; min-height:440px; } .promise__card--copy { min-height:390px; } .promise__card--quote { min-height:330px; } .closing { min-height:600px; } .closing__overlay { background:linear-gradient(180deg, rgba(0,34,45,.5), rgba(0,34,45,.82)); } .footer { min-height:160px; align-items:flex-start; justify-content:center; flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .hero__content { animation:none; } }