:root { --ink:#101414; --plaster:#f4efe6; --blue:#12a8c8; --brass:#b08a4a; --palm:#243e32; --coral:#c85f45; --line:rgba(244,239,230,.22); --pad:clamp(1.25rem,4vw,4.5rem); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--ink); }
body { margin:0; color:var(--plaster); background:var(--ink); font-family:"Manrope",sans-serif; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; }
button,a { -webkit-tap-highlight-color:transparent; }
.grain { position:fixed; inset:0; z-index:20; pointer-events:none; opacity:.065; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E"); }
.nav { position:fixed; inset:0 0 auto; height:6rem; padding:0 var(--pad); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:2rem; z-index:10; border-bottom:1px solid transparent; transition:background .45s ease,border-color .45s ease,transform .45s ease; }
.nav.is-scrolled { background:rgba(16,20,20,.86); border-color:var(--line); backdrop-filter:blur(16px); }
.wordmark { width:max-content; font-size:1.05rem; line-height:.82; letter-spacing:.34em; font-weight:600; }
.wordmark span { display:block; margin-top:.45rem; color:var(--blue); font:300 .48rem/1 "DM Mono",monospace; letter-spacing:.46em; }
.nav nav { display:grid; grid-auto-flow:column; gap:2.4rem; font-size:.72rem; }
.nav nav a,.nav-cta { opacity:.78; transition:opacity .25s ease; }
.nav nav a:hover,.nav-cta:hover { opacity:1; }
.nav-cta { justify-self:end; font-size:.72rem; padding-bottom:.25rem; border-bottom:1px solid currentColor; }
.hero { position:relative; min-height:100dvh; overflow:hidden; display:grid; align-items:end; }
.hero-media { position:absolute; inset:0; height:100%; object-fit:cover; object-position:center; transform:scale(1.07); animation:heroZoom 2.4s cubic-bezier(.16,1,.3,1) forwards; }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(8,12,12,.91) 0%,rgba(8,12,12,.58) 37%,rgba(8,12,12,.08) 72%),linear-gradient(0deg,rgba(8,12,12,.65),transparent 50%); }
.hero-copy { position:relative; z-index:1; width:min(49rem,88vw); padding:10rem var(--pad) 8.5rem; }
.eyebrow,.section-index { margin:0 0 2rem; text-transform:uppercase; font:300 .62rem/1.3 "DM Mono",monospace; letter-spacing:.22em; }
.hero h1,.edit h2,.proof h2,.services h2,.contact h2 { margin:0; font-size:clamp(3.9rem,8.5vw,8.6rem); line-height:.82; letter-spacing:0; font-weight:500; }
em { font-family:"Newsreader",serif; font-weight:300; }
.hero-intro { max-width:34rem; margin:2.5rem 0 2rem; font-size:clamp(.92rem,1.25vw,1.1rem); line-height:1.7; color:rgba(244,239,230,.78); }
.text-link { display:inline-grid; grid-auto-flow:column; gap:2.6rem; align-items:center; border-bottom:1px solid rgba(244,239,230,.5); padding:.65rem 0; font-size:.78rem; transition:gap .4s cubic-bezier(.16,1,.3,1),border-color .3s; }
.text-link:hover { gap:3.4rem; border-color:var(--blue); }
.hero-foot { position:absolute; z-index:1; bottom:2rem; left:var(--pad); right:var(--pad); display:grid; grid-template-columns:1fr 1fr; font:300 .55rem/1 "DM Mono",monospace; letter-spacing:.16em; color:rgba(244,239,230,.65); }
.hero-foot span:last-child { justify-self:end; }
.hero-reveal { opacity:0; transform:translateY(24px); animation:rise .9s cubic-bezier(.16,1,.3,1) forwards; }
.hero-reveal:nth-child(2) { animation-delay:.12s; }.hero-reveal:nth-child(3) { animation-delay:.24s; }.hero-reveal:nth-child(4) { animation-delay:.36s; }
.service-rail { overflow:hidden; background:var(--blue); color:var(--ink); padding:1rem 0; }
.rail-track { width:max-content; display:grid; grid-auto-flow:column; align-items:center; gap:1.4rem; animation:rail 28s linear infinite; text-transform:uppercase; font:400 .58rem/1 "DM Mono",monospace; letter-spacing:.2em; }
.rail-track i { width:3px; height:3px; border-radius:50%; background:currentColor; }
.manifesto { min-height:86dvh; padding:clamp(7rem,12vw,12rem) var(--pad); display:grid; grid-template-columns:1fr 4fr; grid-template-rows:auto 1fr auto; gap:3rem; background:var(--plaster); color:var(--ink); }
.manifesto .section-index { grid-column:1; }
.manifesto-kicker { grid-column:1; grid-row:2; align-self:start; margin:1rem 0; font-family:"Newsreader",serif; font-style:italic; font-size:1.2rem; }
.manifesto h2 { grid-column:2; grid-row:2; margin:0; max-width:67rem; font-size:clamp(3rem,6vw,6.8rem); font-weight:500; line-height:.98; letter-spacing:0; }
.manifesto-note { grid-column:2; grid-row:3; justify-self:end; width:min(30rem,100%); display:grid; grid-template-columns:5rem 1fr; gap:1.5rem; align-items:start; }
.manifesto-note p { margin:0; font-size:.88rem; line-height:1.7; }
.route-line { display:block; margin-top:.5rem; height:1px; background:var(--blue); }
.scene-reveal { opacity:0; transform:translateY(50px); transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1); }
.scene-reveal.is-visible { opacity:1; transform:none; }
.edit { padding:clamp(7rem,10vw,10rem) var(--pad); background:var(--ink); }
.edit-heading { display:grid; grid-template-columns:1fr 2fr 1fr; gap:2rem; align-items:end; margin-bottom:4rem; }
.edit-heading h2 { font-size:clamp(4rem,7.6vw,7.5rem); }
.edit-heading p { margin:0 0 .5rem; max-width:22rem; color:rgba(244,239,230,.64); font-size:.85rem; line-height:1.7; }
.panels { min-height:72dvh; display:flex; gap:.7rem; }
.panel { position:relative; overflow:hidden; flex:1; min-width:0; cursor:pointer; isolation:isolate; transition:flex 1s cubic-bezier(.16,1,.3,1); }
.panel.is-active { flex:3.7; }
.panel img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(.72) brightness(.68); transform:scale(1.04); transition:filter .9s ease,transform 1.2s cubic-bezier(.16,1,.3,1); }
.panel.is-active img { filter:saturate(.92) brightness(.83); transform:scale(1); }
.panel-overlay { position:absolute; inset:0; background:linear-gradient(0deg,rgba(8,12,12,.9),transparent 68%); }
.panel-top { position:absolute; inset:1.3rem 1.3rem auto; display:grid; grid-template-columns:1fr auto; gap:1rem; font:300 .5rem/1 "DM Mono",monospace; letter-spacing:.14em; }
.panel-copy { position:absolute; inset:auto 1.5rem 1.8rem; width:min(28rem,calc(100% - 3rem)); }
.panel-copy p { margin:0 0 .7rem; color:var(--blue); text-transform:uppercase; font:400 .55rem/1 "DM Mono",monospace; letter-spacing:.2em; }
.panel-copy h3 { margin:0 0 1rem; font:300 clamp(2.2rem,3.6vw,4.4rem)/.95 "Newsreader",serif; min-width:25rem; opacity:0; transform:translateY(18px); transition:opacity .45s ease .15s,transform .6s cubic-bezier(.16,1,.3,1) .15s; }
.panel-copy span { display:block; min-width:24rem; opacity:0; font:300 .5rem/1.4 "DM Mono",monospace; letter-spacing:.12em; transition:opacity .45s ease .25s; }
.panel.is-active .panel-copy h3,.panel.is-active .panel-copy span { opacity:1; transform:none; }
.proof { padding:clamp(7rem,12vw,12rem) var(--pad); display:grid; grid-template-columns:1.2fr 1fr; gap:clamp(3rem,9vw,10rem); align-items:center; background:var(--plaster); color:var(--ink); }
.proof-image-wrap { position:relative; margin-left:4vw; }
.proof-image-wrap img { aspect-ratio:4/5; object-fit:cover; filter:saturate(.82); }
.image-stamp { position:absolute; left:-3rem; bottom:3rem; width:7rem; aspect-ratio:1; display:grid; place-content:center; gap:.35rem; border:1px solid var(--blue); border-radius:50%; color:var(--ink); background:rgba(244,239,230,.84); backdrop-filter:blur(8px); text-align:center; font:400 .48rem/1 "DM Mono",monospace; letter-spacing:.16em; transform:rotate(-10deg); }
.proof-copy h2 { font-size:clamp(3.8rem,6.2vw,7rem); }
.proof-copy > p { max-width:31rem; margin:2.4rem 0 3.5rem; line-height:1.8; font-size:.9rem; color:rgba(16,20,20,.7); }
.proof dl { margin:0; border-top:1px solid rgba(16,20,20,.25); }
.proof dl div { display:grid; grid-template-columns:1fr 2fr; gap:2rem; padding:1.2rem 0; border-bottom:1px solid rgba(16,20,20,.25); }
.proof dt { font-family:"Newsreader",serif; font-size:1.2rem; }.proof dd { margin:0; font-size:.74rem; line-height:1.6; color:rgba(16,20,20,.64); }
.services { position:relative; min-height:100dvh; padding:clamp(7rem,11vw,11rem) var(--pad); overflow:hidden; background:var(--palm); display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(4rem,8vw,9rem); }
.services-intro { align-self:start; position:sticky; top:9rem; }
.services-intro h2 { max-width:48rem; font-size:clamp(3.5rem,5.6vw,6.6rem); }
.services-intro > p { max-width:29rem; margin:2rem 0; color:rgba(244,239,230,.62); line-height:1.8; font-size:.86rem; }
.service-list { border-top:1px solid var(--line); align-self:center; }
.service-row { display:grid; grid-template-columns:3rem 1.2fr 1fr; gap:1rem; padding:1.8rem 0; border-bottom:1px solid var(--line); align-items:start; }
.service-row > span { color:var(--blue); font:300 .5rem/1 "DM Mono",monospace; }.service-row h3 { margin:0; font:300 1.7rem/1 "Newsreader",serif; }.service-row p { margin:0; color:rgba(244,239,230,.55); font-size:.69rem; line-height:1.6; }
.itinerary-mark { position:absolute; left:var(--pad); bottom:3rem; display:grid; grid-template-columns:auto auto; grid-template-rows:auto auto; column-gap:.8rem; align-items:end; opacity:.28; }
.itinerary-mark span { font:400 .55rem/1 "DM Mono",monospace; letter-spacing:.3em; }.itinerary-mark b { grid-row:1/3; grid-column:2; font:300 5rem/.7 "Newsreader",serif; }.itinerary-mark small { font:300 .42rem/1.4 "DM Mono",monospace; letter-spacing:.12em; }
.contact { position:relative; min-height:100dvh; display:grid; align-items:center; overflow:hidden; }
.contact > img { position:absolute; inset:0; height:100%; object-fit:cover; }
.contact-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(9,13,13,.9),rgba(9,13,13,.3)),linear-gradient(0deg,rgba(9,13,13,.82),transparent 55%); }
.contact-copy { position:relative; z-index:1; padding:8rem var(--pad) 10rem; }
.contact-copy h2 { max-width:70rem; font-size:clamp(4rem,8vw,8.8rem); }
.contact-button { margin-top:3.5rem; width:min(37rem,100%); display:grid; grid-template-columns:1fr auto; align-items:center; border:1px solid rgba(244,239,230,.55); padding:1.5rem; font-size:.76rem; background:rgba(16,20,20,.14); backdrop-filter:blur(10px); transition:background .4s,color .4s,transform .4s cubic-bezier(.16,1,.3,1); }
.contact-button b { display:grid; place-items:center; width:3rem; aspect-ratio:1; border-radius:50%; background:var(--blue); color:var(--ink); font-weight:400; }
.contact-button:hover { background:var(--plaster); color:var(--ink); transform:translateY(-3px); }
.contact footer { position:absolute; z-index:1; left:var(--pad); right:var(--pad); bottom:1.5rem; display:grid; grid-template-columns:1fr auto 1fr; align-items:end; border-top:1px solid var(--line); padding-top:1.5rem; }
.contact footer p { margin:0; font:300 .5rem/1 "DM Mono",monospace; letter-spacing:.12em; color:rgba(244,239,230,.6); }.contact footer p:last-child { justify-self:end; }
@keyframes rise { to { opacity:1; transform:none; } }
@keyframes heroZoom { to { transform:scale(1); } }
@keyframes rail { to { transform:translateX(-50%); } }
@media (max-width:900px) {
  .nav { height:5rem; grid-template-columns:1fr auto; }.nav nav { display:none; }.nav-cta { font-size:.65rem; }
  .hero-copy { padding-bottom:7rem; }.hero h1 { font-size:clamp(3.7rem,17vw,6.4rem); }.hero-shade { background:linear-gradient(0deg,rgba(8,12,12,.88),rgba(8,12,12,.12) 80%),linear-gradient(90deg,rgba(8,12,12,.55),transparent); }.hero-media { object-position:63% center; }
  .manifesto { min-height:auto; grid-template-columns:1fr; grid-template-rows:auto; }.manifesto .section-index,.manifesto-kicker,.manifesto h2,.manifesto-note { grid-column:1; grid-row:auto; }.manifesto-kicker { margin:0; }.manifesto-note { justify-self:start; }
  .edit-heading { grid-template-columns:1fr; }.edit-heading h2 { font-size:clamp(3.8rem,15vw,6rem); }.edit-heading p { max-width:30rem; }
  .panels { min-height:auto; display:grid; grid-template-columns:1fr; gap:1rem; }.panel,.panel.is-active { min-height:68dvh; flex:none; }.panel-copy h3,.panel-copy span { min-width:0; opacity:1; transform:none; }.panel img,.panel.is-active img { filter:saturate(.86) brightness(.75); }
  .proof { grid-template-columns:1fr; }.proof-image-wrap { margin:0 0 0 2rem; max-width:38rem; }.proof-copy { max-width:42rem; }
  .services { min-height:auto; grid-template-columns:1fr; }.services-intro { position:relative; top:auto; }.itinerary-mark { display:none; }
  .contact footer { grid-template-columns:1fr 1fr; gap:1.5rem; }.contact footer p:nth-child(2) { display:none; }
}
@media (max-width:560px) {
  :root { --pad:1.15rem; }.nav { height:4.5rem; }.nav-cta { font-size:0; border:0; padding:0; }.nav-cta span { display:grid; place-items:center; width:2.4rem; aspect-ratio:1; border:1px solid rgba(244,239,230,.5); border-radius:50%; font-size:.8rem; }
  .hero-copy { width:100%; padding-top:8rem; }.hero h1 { font-size:clamp(3.35rem,17vw,5.4rem); }.hero-intro { max-width:29rem; font-size:.84rem; }.hero-foot span:first-child { display:none; }.hero-foot { grid-template-columns:1fr; }.hero-foot span:last-child { justify-self:start; }
  .manifesto h2 { font-size:clamp(2.8rem,13vw,4.7rem); }.manifesto-note { grid-template-columns:3rem 1fr; }
  .edit { padding-left:0; padding-right:0; }.edit-heading { padding:0 var(--pad); }.panels { gap:.5rem; }.panel,.panel.is-active { min-height:76dvh; }.panel-copy h3 { font-size:3.2rem; }
  .proof { padding-left:var(--pad); }.image-stamp { left:-1.8rem; width:6rem; }.proof dl div { grid-template-columns:1fr; gap:.4rem; }
  .service-row { grid-template-columns:2rem 1fr; }.service-row p { grid-column:2; }.services-intro h2 { font-size:3.5rem; }
  .contact-copy { padding-top:7rem; }.contact-copy h2 { font-size:clamp(3.4rem,16vw,5.4rem); }.contact footer .wordmark { font-size:.8rem; }.contact footer p { font-size:.43rem; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } .scene-reveal,.hero-reveal { opacity:1; transform:none; } }
