:root { --ink:#1c2928; --paper:#f3efe5; --coral:#dd644c; --lime:#c9db88; --line:rgba(28,41,40,.18); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--ink); font-family:"DM Sans",sans-serif; } a { color:inherit; text-decoration:none; }
.site-header { height:100px; padding:21px 4.5vw; display:flex; justify-content:space-between; align-items:center; position:absolute; inset:0 0 auto; z-index:2; color:#fff; }
.wordmark { font:bold 20px/14px "DM Sans",sans-serif; letter-spacing:-1.3px; text-transform:lowercase; } .wordmark i { font:500 22px/14px "Playfair Display",serif; letter-spacing:-1.6px; }
nav { display:flex; gap:31px; font:500 12px "DM Mono",monospace; text-transform:uppercase; letter-spacing:.06em; } nav a { opacity:.92; } nav a:hover,.socials a:hover { opacity:.5; }
.menu-button { display:none; background:none; border:0; color:inherit; font:500 12px "DM Mono",monospace; text-transform:uppercase; }
.hero { min-height:760px; height:100vh; position:relative; overflow:hidden; background:#394944; color:#fff; } .hero img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; } .hero::after { content:""; position:absolute; inset:0; z-index:0; background:linear-gradient(90deg,rgba(16,30,28,.58),rgba(16,30,28,.05) 63%); }
.hero-copy { position:absolute; z-index:1; left:9vw; top:50%; transform:translateY(-33%); } .eyebrow { font:500 11px "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; margin:0 0 23px; } h1,h2 { font:500 clamp(48px,6.5vw,96px)/.95 "Playfair Display",serif; letter-spacing:-.065em; margin:0; } em { color:var(--coral); font-style:italic; } .hero h1 em { color:var(--lime); }
.circle-link { display:flex; align-items:center; gap:18px; margin-top:46px; font-size:14px; } .circle-link span { display:grid; place-items:center; width:40px; height:40px; border:1px solid rgba(255,255,255,.6); border-radius:50%; font-size:18px; transition:transform .2s; } .circle-link:hover span { transform:rotate(45deg); }
.hero-caption { position:absolute; right:5vw; bottom:34px; z-index:1; margin:0; font:12px/1.4 "DM Mono",monospace; text-align:right; }
.section-pad { padding:145px 9vw; } .intro { display:grid; grid-template-columns:30% 1fr; gap:6%; }.intro h2 { font-size:clamp(42px,5.3vw,76px); }.body-copy { max-width:470px; margin:40px 0 0 9vw; font-size:18px; line-height:1.62; color:#485452; }
.gallery { display:grid; grid-template-columns:1.2fr .8fr 1fr; height:530px; background:#cad790; } .tile { position:relative; background-size:cover; background-position:center; min-height:260px; } .tile::after { content:""; position:absolute; inset:0; background:linear-gradient(transparent,rgba(20,28,27,.38)); }.tile span { position:absolute; z-index:1; bottom:24px; left:26px; color:#fff; font:500 12px "DM Mono",monospace; text-transform:uppercase; letter-spacing:.06em; }
.tile-stay { background-image:linear-gradient(120deg,rgba(25,57,53,.2),rgba(25,57,53,.2)),url('https://images.unsplash.com/photo-1501117716987-c8e1ecb21074?auto=format&fit=crop&w=1200&q=85'); }.tile-taste { background-image:url('https://images.unsplash.com/photo-1547592180-85f173990554?auto=format&fit=crop&w=1000&q=85'); }.tile-wander { background-image:url('https://images.unsplash.com/photo-1500534623283-312aade485b7?auto=format&fit=crop&w=1200&q=85'); }
.services { background:var(--ink); color:var(--paper); display:grid; grid-template-columns:45% 1fr; gap:10%; }.services h2 { font-size:clamp(42px,5vw,74px); }.services h2 em { color:var(--lime); }.service-list { border-top:1px solid rgba(255,255,255,.25); }.service-list article { padding:25px 0 27px; border-bottom:1px solid rgba(255,255,255,.25); display:grid; grid-template-columns:50px 1fr; }.service-list span { font:11px "DM Mono",monospace; color:var(--lime); }.service-list h3 { margin:0; font:500 25px "Playfair Display",serif; letter-spacing:-.04em; }.service-list p { grid-column:2; margin:11px 0 0; max-width:380px; line-height:1.5; color:#c5cfcc; font-size:14px; }
.highlights-header { display:flex; justify-content:space-between; align-items:end; margin-bottom:43px; }.highlights h2 { font-size:clamp(42px,5vw,70px); }.text-link { font:500 12px "DM Mono",monospace; text-transform:uppercase; border-bottom:1px solid var(--ink); padding-bottom:6px; }.video-wrap { max-width:1060px; margin:auto; background:var(--ink); padding:12px; box-shadow:18px 18px 0 var(--coral); }.video-wrap iframe { width:100%; display:block; aspect-ratio:16/8.2; border:0; }.video-note { color:#fff; padding:11px 3px 3px; font:10px "DM Mono",monospace; text-transform:uppercase; letter-spacing:.04em; }.pulse { display:inline-block; width:7px; height:7px; background:var(--lime); border-radius:50%; margin-right:7px; }
.contact { background:var(--coral); padding:135px 9vw 125px; color:var(--ink); }.contact h2 { font-size:clamp(53px,7vw,105px); }.contact h2 em { color:var(--paper); }.contact-link { display:inline-flex; gap:25px; margin-top:50px; padding-bottom:9px; border-bottom:1px solid var(--ink); font:500 15px "DM Mono",monospace; text-transform:uppercase; }.contact-link span { font-size:20px; line-height:12px; }
footer { display:grid; grid-template-columns:1fr 1fr 1fr; align-items:end; padding:35px 4.5vw; color:var(--paper); background:var(--ink); } footer p { margin:0; font-size:12px; line-height:1.5; color:#b4c0bb; }.socials { display:flex; gap:20px; justify-content:flex-end; font:11px "DM Mono",monospace; text-transform:uppercase; }
@media (max-width:700px) { .site-header { height:76px; padding:17px 6vw; } nav { display:none; } nav.open { display:flex; position:absolute; top:0; right:0; width:100%; padding:88px 7vw 30px; flex-direction:column; gap:20px; background:var(--ink); } .menu-button { display:block; position:relative; z-index:1; } .hero { min-height:620px; height:88vh; } .hero-copy { left:7vw; top:50%; transform:translateY(-18%); } .hero-caption { display:none; } .section-pad { padding:90px 7vw; } .intro,.services { display:block; }.intro h2 { margin-top:58px; }.body-copy { margin:30px 0 0; font-size:16px; }.gallery { grid-template-columns:1fr 1fr; height:auto; }.tile { height:270px; }.tile-wander { grid-column:span 2; }.services-heading { margin-bottom:60px; }.service-list article { grid-template-columns:38px 1fr; }.highlights-header { display:block; }.highlights-header .text-link { display:inline-block; margin-top:24px; }.video-wrap { box-shadow:10px 10px 0 var(--coral); }.contact { padding:90px 7vw; } footer { grid-template-columns:1fr 1fr; gap:30px; padding:32px 7vw; }.socials { grid-column:span 2; justify-content:flex-start; flex-wrap:wrap; } }

/* Personal story and multi-video highlights */
.personal-note { margin-top:18px; }
.highlights-intro { max-width:620px; margin:-18px 0 46px 30%; color:#56625f; font-size:17px; line-height:1.6; }
.video-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.video-card { overflow:hidden; background:var(--ink); color:var(--paper); box-shadow:9px 9px 0 var(--coral); transition:transform .25s ease; }
.video-card:nth-child(2) { box-shadow:9px 9px 0 var(--lime); }
.video-card:hover { transform:translateY(-5px); }
.video-card iframe { display:block; width:100%; border:0; aspect-ratio:16/9; }
.video-card-copy { min-height:118px; padding:19px 20px 22px; }
.video-card-copy span { color:var(--lime); font:500 10px "DM Mono",monospace; letter-spacing:.06em; text-transform:uppercase; }
.video-card-copy h3 { margin:10px 0 0; font:500 20px/1.2 "Playfair Display",serif; letter-spacing:-.025em; }
.playlist-link { display:inline-flex; align-items:center; margin-top:38px; font:500 11px "DM Mono",monospace; letter-spacing:.04em; text-transform:uppercase; }
.contact-copy { max-width:560px; margin:38px 0 0; font-size:18px; line-height:1.6; }
@media (max-width:900px) { .video-grid { grid-template-columns:1fr; gap:28px; } .video-card-copy { min-height:auto; } .highlights-intro { margin:28px 0 42px; } }