/* =========================================================
   DMR Freight and Logistics — "Crimson Ledger" identity
   Oxblood · crimson · blush · concrete · graphite
   ========================================================= */
:root {
  --concrete: #e7e7e4;
  --paper: #f6f6f3;
  --ox: #5a0b19;
  --ox-2: #6e1122;
  --crimson: #c1121f;
  --blush: #f2d7d3;
  --graphite: #1d1e22;
  --steel: #737b86;
  --rule: rgba(29, 30, 34, .14);

  --serif: "Gloock", "Georgia", "Times New Roman", serif;
  --sans: "Manrope", "Helvetica Neue", Arial, sans-serif;

  --gx: clamp(16px, 4vw, 60px);
  --max: 1380px;
  --ease: cubic-bezier(.19, 1, .22, 1);
  --snap: cubic-bezier(.77, 0, .175, 1);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; overflow-x: clip; }
body { font-family: var(--sans); font-size: 1.05rem; line-height: 1.65; color: var(--graphite); background: var(--concrete); overflow-x: clip; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--crimson); color: #fff; }
:focus-visible { outline: 2px solid var(--crimson); outline-offset: 4px; }
.shell { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 var(--gx); }
.skip { position: absolute; left: -999px; top: 8px; z-index: 999; background: var(--crimson); color: #fff; padding: 10px 14px; }
.skip:focus { left: 8px; }

/* ---------- Type ---------- */
h1, h2, h3, .serif { font-family: var(--serif); font-weight: 400; letter-spacing: -.02em; line-height: 1.02; }
h1 { font-size: clamp(2.8rem, 7vw, 7.2rem); }
h2 { font-size: clamp(2.1rem, 4.6vw, 4.6rem); }
h3 { font-size: clamp(1.4rem, 2vw, 1.9rem); line-height: 1.12; }
.lead-in { font-size: clamp(1.1rem, 1.35vw, 1.28rem); line-height: 1.6; color: #4b4f57; max-width: 31em; }
.ox .lead-in { color: #e5c3bf; }
.ox { background: var(--ox); color: var(--paper); }
.sect { padding: clamp(90px, 12vw, 180px) 0; }
.eyenote { display: inline-flex; align-items: center; gap: 12px; font-weight: 700; font-size: .95rem; }
.eyenote::before { content: ""; width: 10px; height: 10px; background: var(--crimson); transform: rotate(45deg); }
.ox .eyenote::before { background: var(--blush); }

/* ink-fill heading reveal */
[data-ink] { position: relative; }
[data-ink] .ink-o { color: transparent; -webkit-text-stroke: 1px currentColor; opacity: .35; }
[data-ink] .ink-f { position: absolute; inset: 0; clip-path: inset(0 100% 0 0); transition: clip-path 1.6s var(--ease); }
[data-ink].seen .ink-f { clip-path: inset(0 0 0 0); }

[data-up] { opacity: 0; transform: translateY(34px); transition: opacity 1.1s var(--ease), transform 1.1s var(--ease); }
[data-up].seen { opacity: 1; transform: none; }
[data-wipe] { clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); transition: clip-path 1.5s var(--snap); }
[data-wipe].seen { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }

/* ---------- Buttons ---------- */
.btn { position: relative; display: inline-flex; align-items: center; gap: 14px; padding: 18px 28px; background: var(--crimson); color: #fff; font-weight: 700; font-size: 1rem; overflow: hidden; isolation: isolate; border-radius: 2px; }
.btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--graphite); transform: translateY(101%); transition: transform .55s var(--ease); }
.btn:hover::before { transform: none; }
.btn svg { width: 18px; height: 18px; transition: transform .5s var(--ease); }
.btn:hover svg { transform: translateX(5px); }
.btn--ghost { background: transparent; color: inherit; box-shadow: inset 0 0 0 1.5px currentColor; }
.btn--ghost::before { background: var(--crimson); }
.btn--ghost:hover { color: #fff; box-shadow: inset 0 0 0 1.5px var(--crimson); }
.btn--light { background: var(--paper); color: var(--ox); }
.btn--light::before { background: var(--blush); }
.under { font-weight: 700; display: inline-flex; gap: 10px; align-items: center; position: relative; padding-bottom: 4px; }
.under::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1.5px; background: currentColor; transform-origin: right; transition: transform .5s var(--ease); }
.under:hover::after { transform: scaleX(0); }
.under svg { width: 16px; height: 16px; }

/* ---------- Header ---------- */
.mast { position: fixed; top: 0; left: 0; right: 0; z-index: 70; transition: background .4s, box-shadow .4s, color .4s; }
.mast .shell { display: flex; align-items: center; justify-content: space-between; gap: 20px; height: 84px; }
.mast.scrolled { background: rgba(246,246,243,.86); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 1px 0 var(--rule); }
.on-ox-top .mast:not(.scrolled) { color: var(--paper); }
.logo { display: flex; align-items: center; gap: 12px; }
.logo svg { width: 46px; height: 46px; flex-shrink: 0; }
.logo span { font-family: var(--serif); font-size: 1.32rem; line-height: 1; letter-spacing: -.02em; }
.logo small { display: block; font-family: var(--sans); font-size: .74rem; font-weight: 600; opacity: .65; margin-top: 3px; letter-spacing: 0; }
.links { display: flex; gap: 30px; list-style: none; }
.links a { position: relative; font-weight: 600; font-size: .98rem; padding: 6px 0; }
.links a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background: var(--crimson); transform: scaleX(0); transform-origin: right; transition: transform .5s var(--ease); }
.links a:hover::after, .links a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
.mast .btn { padding: 13px 20px; }
.burger { display: none; width: 48px; height: 48px; background: var(--crimson); position: relative; border-radius: 2px; }
.burger i { position: absolute; left: 13px; right: 13px; height: 2px; background: #fff; transition: transform .5s var(--ease), opacity .3s; }
.burger i:nth-child(1) { top: 17px; } .burger i:nth-child(2) { top: 23px; } .burger i:nth-child(3) { top: 29px; }
.open-nav .burger i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.open-nav .burger i:nth-child(2) { opacity: 0; }
.open-nav .burger i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.sheet { position: fixed; inset: 0; z-index: 65; background: var(--ox); color: var(--paper); padding: 110px var(--gx) 40px; display: flex; flex-direction: column; justify-content: space-between; transform: translateX(100%); transition: transform .8s var(--snap); }
.open-nav .sheet { transform: none; }
.sheet nav a { display: block; font-family: var(--serif); font-size: clamp(2.4rem, 10vw, 3.4rem); line-height: 1.2; }
.sheet nav a[aria-current="page"] { color: var(--blush); font-style: italic; }
.sheet .meta { color: #e5c3bf; display: grid; gap: 4px; }
.open-nav .mast { color: var(--paper); background: transparent; box-shadow: none; backdrop-filter: none; }

/* ---------- Transition slab ---------- */
.slab { position: fixed; inset: 0 -30vw; z-index: 300; pointer-events: none; background: var(--crimson); transform: translateX(-130%) skewX(-18deg); display: grid; place-items: center; }
.slab::after { content: ""; position: absolute; inset: 0 40vw; background: var(--ox); transform: translateX(-60%); transition: transform .8s var(--snap) .05s; }
.slab svg { position: relative; z-index: 2; width: 84px; height: 84px; transform: skewX(18deg); opacity: 0; transition: opacity .3s .3s; }
.slab.cover { transform: translateX(0) skewX(-18deg); transition: transform .75s var(--snap); }
.slab.cover::after { transform: none; }
.slab.cover svg { opacity: 1; }
.slab.leave { transform: translateX(130%) skewX(-18deg); transition: transform .8s var(--snap); }
html.incoming .slab { transform: translateX(0) skewX(-18deg); transition: none; }
html.incoming .slab::after { transform: none; transition: none; }
html.incoming .slab svg { opacity: 1; }

/* ---------- Photo frames ---------- */
.ph { position: relative; overflow: hidden; background: linear-gradient(140deg, #8e1b2c, #3b0710 60%, #1d1e22); }
.ph::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, transparent 1px 34px), repeating-linear-gradient(0deg, rgba(255,255,255,.05) 0 1px, transparent 1px 34px); }
.ph img { position: relative; width: 100%; height: 100%; object-fit: cover; }

/* ============================================================
   HOME
   ============================================================ */
.hero { position: relative; min-height: 100svh; padding: 130px 0 60px; display: flex; align-items: center; overflow: hidden; }
.hero::before { content: ""; position: absolute; right: -10vw; top: -10vw; width: 60vw; height: 60vw; border-radius: 50%; background: radial-gradient(closest-side, rgba(193,18,31,.12), transparent); }
.hero__grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(30px, 5vw, 80px); align-items: center; width: 100%; }
.hero h1 { margin: 22px 0 28px; }
.hero__acts { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 38px; }
.orbit { position: relative; height: clamp(440px, 46vw, 640px); perspective: 1200px; transform-style: preserve-3d; display: grid; place-items: center; }
.arch { position: relative; width: min(64%, 380px); aspect-ratio: 3/4.3; border-radius: 999px 999px 6px 6px; overflow: hidden; transform-style: preserve-3d; transition: transform .8s var(--ease); box-shadow: 0 60px 100px -50px rgba(90,11,25,.7); }
.arch .ph { position: absolute; inset: 0; }
.arch::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(90,11,25,.55)); }
.arch__cap { position: absolute; z-index: 2; left: 0; right: 0; bottom: 24px; text-align: center; color: #fff; font-weight: 700; font-size: .92rem; }
.ring { position: absolute; left: 50%; top: 50%; width: 0; height: 0; transform-style: preserve-3d; animation: ringspin 26s linear infinite; }
.ring-wrap { position: absolute; left: 50%; top: 50%; width: 0; height: 0; transform-style: preserve-3d; transform: rotateX(-14deg) rotateZ(-8deg); pointer-events: none; }
.ring b { position: absolute; left: 0; top: 0; width: 46px; margin-left: -23px; margin-top: -32px; text-align: center; font-family: var(--serif); font-weight: 400; font-size: 52px; line-height: 64px; color: var(--crimson); backface-visibility: hidden; text-shadow: 0 0 1px rgba(193,18,31,.3); }
@keyframes ringspin { to { transform: rotateY(-360deg); } }
.stamp { position: absolute; right: 4%; top: 8%; width: 120px; height: 120px; border-radius: 50%; background: var(--graphite); color: var(--paper); display: grid; place-items: center; text-align: center; font-size: .78rem; font-weight: 700; line-height: 1.3; z-index: 3; transform: rotate(-10deg); }
.stamp strong { display: block; font-family: var(--serif); font-weight: 400; font-size: 1.6rem; color: var(--blush); }

.ledger { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); background: var(--paper); }
.ledger .shell { display: grid; grid-template-columns: repeat(4, 1fr); }
.ledger .shell > div { padding: 28px 24px; border-left: 1px solid var(--rule); }
.ledger .shell > div:first-child { border-left: 0; padding-left: 0; }
.ledger small { display: block; color: var(--steel); font-weight: 600; font-size: .85rem; }
.ledger b { font-family: var(--serif); font-weight: 400; font-size: clamp(1.4rem, 2vw, 1.9rem); letter-spacing: -.01em; }

.statement { background: var(--paper); }
.statement__grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: end; }
.statement h2 { grid-column: 1 / span 9; font-size: clamp(2.2rem, 5.2vw, 5.2rem); }
.statement .ph { grid-column: 1 / span 5; aspect-ratio: 4/5; margin-top: 60px; }
.statement .copy { grid-column: 7 / span 5; padding-bottom: 20px; }
.statement .copy p { color: #4b4f57; margin-bottom: 18px; }

.reasons { background: var(--concrete); position: relative; }
.reasons__head { display: flex; justify-content: space-between; align-items: end; flex-wrap: wrap; gap: 24px; margin-bottom: 50px; }
.rows { border-top: 1px solid var(--graphite); }
.row { position: relative; display: grid; grid-template-columns: 1.3fr 1fr auto; gap: 30px; align-items: center; padding: 34px 0; border-bottom: 1px solid var(--rule); transition: padding .5s var(--ease); }
.row h3 { font-size: clamp(1.8rem, 3.8vw, 3.6rem); letter-spacing: -.03em; transition: color .4s, transform .6s var(--ease); }
.row p { color: #4b4f57; max-width: 30em; }
.row .arrow { width: 54px; height: 54px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--graphite); display: grid; place-items: center; transition: background .4s, color .4s, transform .5s var(--ease); }
.row .arrow svg { width: 20px; height: 20px; }
.row:hover h3 { color: var(--crimson); transform: translateX(16px); }
.row:hover .arrow { background: var(--crimson); color: #fff; box-shadow: none; transform: rotate(-45deg); }
.follow { position: fixed; left: 0; top: 0; z-index: 20; width: 300px; height: 380px; pointer-events: none; overflow: hidden; border-radius: 160px 160px 4px 4px; opacity: 0; transform: translate(-50%, -50%) scale(.6) rotate(-6deg); transition: opacity .35s, transform .5s var(--ease); }
.follow.on { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-4deg); }
.follow .ph { position: absolute; inset: 0; opacity: 0; transition: opacity .3s; }
.follow .ph.on { opacity: 1; }

.callout { position: relative; overflow: hidden; }
.callout .shell { display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; align-items: end; }
.callout h2 { font-size: clamp(2.6rem, 6.4vw, 6.4rem); }
.callout .tel { font-family: var(--serif); font-size: clamp(2rem, 4.4vw, 3.8rem); line-height: 1; display: block; margin-bottom: 26px; color: var(--blush); }
.callout .lines { position: absolute; inset: 0; opacity: .14; background: repeating-linear-gradient(-55deg, var(--paper) 0 1px, transparent 1px 26px); mask-image: linear-gradient(90deg, transparent, #000 70%); pointer-events: none; }

/* ============================================================
   SERVICES
   ============================================================ */
.sv-hero { padding: 140px 0 40px; }
.sv-hero__top { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: end; margin-bottom: 44px; }
.accordion { display: flex; gap: 10px; height: clamp(460px, 62vh, 640px); }
.acc { position: relative; flex: 1; min-width: 0; overflow: hidden; border-radius: 2px; color: #fff; transition: flex 1s var(--ease); cursor: pointer; outline: none; }
.acc.active { flex: 3.2; }
.acc .ph { position: absolute; inset: 0; }
.acc .ph img { transition: transform 1.4s var(--ease); transform: scale(1.12); }
.acc.active .ph img { transform: scale(1); }
.acc::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(29,30,34,.1), rgba(90,11,25,.88)); }
.acc__title { position: absolute; z-index: 2; left: 24px; bottom: 24px; right: 24px; }
.acc__title h3 { font-size: clamp(1.4rem, 2.4vw, 2.4rem); }
.acc__more { max-height: 0; opacity: 0; overflow: hidden; transition: max-height .8s var(--ease), opacity .6s; }
.acc.active .acc__more { max-height: 260px; opacity: 1; transition-delay: .25s; }
.acc__more p { color: #f0d6d2; margin: 12px 0 14px; max-width: 30em; }
.acc__more ul { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.acc__more li { padding: 6px 12px; border: 1px solid rgba(255,255,255,.35); font-size: .88rem; font-weight: 600; }
.acc__vert { position: absolute; z-index: 2; top: 24px; left: 24px; writing-mode: vertical-rl; transform: rotate(180deg); font-family: var(--serif); font-size: 1.4rem; transition: opacity .4s; }
.acc.active .acc__vert { opacity: 0; }
.acc:not(.active) .acc__title h3 { opacity: 0; }

.flow { background: var(--paper); }
.flow__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(30px, 7vw, 120px); }
.counter { position: sticky; top: 120px; align-self: start; }
.counter .num { font-family: var(--serif); font-size: clamp(9rem, 20vw, 18rem); line-height: 1; color: var(--crimson); height: 1em; overflow: hidden; letter-spacing: -.04em; }
.counter .num span { display: block; transition: transform .8s var(--ease); }
.counter .num i { display: block; height: 1em; font-style: normal; }
.counter p { margin-top: 20px; color: var(--steel); font-weight: 600; }
.fstep { min-height: 58vh; display: flex; flex-direction: column; justify-content: center; border-top: 1px solid var(--rule); opacity: .3; transition: opacity .6s; }
.fstep.on { opacity: 1; }
.fstep h3 { font-size: clamp(2rem, 3.6vw, 3.4rem); letter-spacing: -.03em; }
.fstep p { color: #4b4f57; margin-top: 16px; max-width: 30em; font-size: 1.1rem; }

/* ============================================================
   COVERAGE
   ============================================================ */
.cv-hero { padding: 130px 0 90px; overflow: hidden; }
.cv-hero__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(30px, 5vw, 80px); align-items: center; }
.radar { position: relative; width: 100%; max-width: 640px; aspect-ratio: 1; margin: 0 auto; }
.radar svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.radar .rg { fill: none; stroke: rgba(242,215,211,.18); }
.radar .ax { stroke: rgba(242,215,211,.12); }
.radar .rl { fill: rgba(242,215,211,.45); font-size: 11px; font-family: var(--sans); font-weight: 600; }
.sweep { position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(from 0deg, rgba(193,18,31,0) 0deg, rgba(193,18,31,0) 290deg, rgba(255,90,100,.42) 360deg); animation: sweep 6s linear infinite; mask-image: radial-gradient(closest-side, #000 99%, transparent 100%); -webkit-mask-image: radial-gradient(closest-side, #000 99%, transparent 100%); }
@keyframes sweep { to { transform: rotate(360deg); } }
.radar .city circle { fill: var(--blush); }
.radar .city text { fill: var(--paper); font-family: var(--sans); font-size: 13px; font-weight: 700; }
.radar .city .halo { fill: none; stroke: var(--blush); opacity: 0; }
.radar .city.ping .halo { animation: halo 1.4s var(--ease); }
@keyframes halo { 0% { opacity: .9; r: 4; } 100% { opacity: 0; r: 22; } }
.radar .home circle.core { fill: var(--crimson); stroke: var(--paper); stroke-width: 3; }
.radar .home text { fill: var(--paper); font-family: var(--serif); font-size: 18px; }

.distances { background: var(--paper); }
.dist-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(30px, 6vw, 100px); }
.dist-table { width: 100%; border-collapse: collapse; }
.dist-table th { text-align: left; font-size: .85rem; color: var(--steel); font-weight: 700; padding: 0 0 12px; border-bottom: 1px solid var(--graphite); }
.dist-table th:last-child, .dist-table td:last-child { text-align: right; }
.dist-table td { padding: 18px 0; border-bottom: 1px solid var(--rule); font-size: 1.08rem; }
.dist-table td:first-child { font-family: var(--serif); font-size: 1.5rem; }
.dist-table tr { transition: background .3s; }
.dist-table tbody tr:hover { background: var(--blush); }
.dist-table .bar { display: block; height: 4px; background: var(--crimson); transform-origin: left; transform: scaleX(0); transition: transform 1.4s var(--ease); margin-top: 6px; }
.seen .dist-table .bar, .dist-table.seen .bar { transform: scaleX(var(--w)); }

.corridor { position: relative; overflow: hidden; }
.corridor__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 6vw, 100px); align-items: center; }
.shield { width: clamp(170px, 18vw, 230px); }
.shields { display: flex; gap: 20px; flex-wrap: wrap; }
.corridor .ph { aspect-ratio: 5/4; }

/* ============================================================
   ABOUT
   ============================================================ */
.ab-hero { padding: 150px 0 0; background: var(--paper); }
.ab-hero h1 { font-size: clamp(3rem, 9vw, 9.6rem); letter-spacing: -.035em; line-height: .95; max-width: 11em; }
.ab-hero__band { margin-top: 60px; height: clamp(280px, 46vw, 600px); }
.ab-hero__band .ph { height: 100%; }
.ab-hero__band .ph img { height: 125%; }

.pull { background: var(--paper); }
.pull blockquote { font-family: var(--serif); font-size: clamp(1.8rem, 3.6vw, 3.4rem); line-height: 1.14; letter-spacing: -.02em; max-width: 22em; }
.pull blockquote::before { content: "\201C"; display: block; font-size: 2.4em; line-height: .6; color: var(--crimson); }
.pull__cols { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; margin-top: 60px; }
.pull__cols p { grid-column: span 4; color: #4b4f57; }
.pull__cols p:first-child { grid-column: 5 / span 4; }

.founder .shell { display: grid; grid-template-columns: auto 1fr; gap: clamp(30px, 6vw, 100px); align-items: center; }
.mono { position: relative; width: clamp(220px, 26vw, 360px); aspect-ratio: 3/4; border-radius: 999px 999px 4px 4px; background: var(--ox-2); display: grid; place-items: center; overflow: hidden; }
.mono span { font-family: var(--serif); font-size: clamp(5rem, 9vw, 8rem); color: var(--blush); letter-spacing: -.04em; position: relative; }
.mono::before { content: ""; position: absolute; inset: 14px; border-radius: 999px 999px 2px 2px; border: 1px solid rgba(242,215,211,.3); }
.founder h2 { font-size: clamp(2.4rem, 5vw, 4.6rem); }
.founder .role { color: var(--blush); font-weight: 700; margin: 12px 0 20px; }

.manifest { background: var(--concrete); }
.manifest__grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(30px, 6vw, 100px); }
.mf { border-top: 2px solid var(--graphite); }
.mf div { display: grid; grid-template-columns: 1fr 1.4fr; gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--rule); }
.mf dt { color: var(--steel); font-weight: 600; }
.mf dd { font-weight: 700; font-size: 1.08rem; }
.mf dd.serif { font-family: var(--serif); font-weight: 400; font-size: 1.5rem; }

.values { background: var(--paper); }
.values__grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--graphite); margin-top: 50px; }
.value { padding: 36px 30px 40px 0; border-right: 1px solid var(--rule); }
.value + .value { padding-left: 30px; }
.value:last-child { border-right: 0; }
.value .ic { display: block; width: 48px; height: 48px; color: var(--crimson); margin-bottom: 40px; }
.value .ic svg { width: 48px; height: 48px; }
.value h3 { margin-bottom: 12px; }
.value p { color: #4b4f57; }

/* ============================================================
   CONTACT
   ============================================================ */
.ct { display: grid; grid-template-columns: .85fr 1.15fr; min-height: 100svh; }
.ct__side { background: var(--ox); color: var(--paper); padding: 140px clamp(24px, 4vw, 64px) 60px; display: flex; flex-direction: column; justify-content: space-between; gap: 50px; position: relative; overflow: hidden; }
.ct__side h1 { font-size: clamp(2.8rem, 5.6vw, 5.6rem); }
.ct__side .big { font-family: var(--serif); font-size: clamp(2rem, 3.6vw, 3.2rem); line-height: 1; display: block; color: var(--blush); }
.ct__list { display: grid; gap: 22px; }
.ct__list small { display: block; color: #e5c3bf; font-weight: 600; font-size: .85rem; }
.ct__list b, .ct__list a { font-weight: 700; word-break: break-word; }
.ct__side .lines { position: absolute; inset: 0; opacity: .1; background: repeating-linear-gradient(-55deg, var(--paper) 0 1px, transparent 1px 26px); pointer-events: none; }
.ct__side > * { position: relative; }
.ct__form { background: var(--paper); padding: 140px clamp(24px, 5vw, 80px) 60px; display: flex; flex-direction: column; justify-content: center; }
.madlib { font-family: var(--serif); font-size: clamp(1.6rem, 2.9vw, 2.7rem); line-height: 1.75; letter-spacing: -.015em; }
.madlib .blank { display: inline-block; position: relative; vertical-align: baseline; }
.madlib input, .madlib select { font-family: var(--serif); font-size: inherit; color: var(--crimson); background: transparent; border: 0; border-bottom: 2px solid var(--graphite); outline: 0; padding: 0 4px; min-width: 4ch; width: var(--w, 9ch); max-width: 100%; transition: border-color .3s; border-radius: 0; appearance: none; -webkit-appearance: none; }
.madlib select { cursor: pointer; padding-right: 22px; background-image: linear-gradient(45deg, transparent 50%, var(--crimson) 50%), linear-gradient(-45deg, transparent 50%, var(--crimson) 50%); background-size: 7px 7px; background-position: calc(100% - 12px) 58%, calc(100% - 5px) 58%; background-repeat: no-repeat; }
.madlib select { width: auto; }
.madlib .acts, .madlib .formerr, .madlib .btn { font-family: var(--sans); letter-spacing: 0; line-height: 1.5; }
.solid-mast .mast { background: rgba(246,246,243,.92); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 1px 0 var(--rule); }
.madlib input::placeholder { color: #b9b4ae; }
.madlib input:focus, .madlib select:focus { border-color: var(--crimson); }
.madlib .err input { border-color: var(--crimson); background: rgba(193,18,31,.07); }
.madlib textarea { display: block; width: 100%; margin-top: 10px; font-family: var(--sans); font-size: 1.05rem; line-height: 1.6; padding: 16px; border: 1.5px solid var(--rule); background: #fff; outline: 0; resize: vertical; min-height: 110px; }
.madlib textarea:focus { border-color: var(--crimson); }
.ct__form .acts { margin-top: 34px; display: flex; flex-wrap: wrap; align-items: center; gap: 20px; }
.ct__form .hint { color: var(--steel); font-size: .92rem; max-width: 26em; }
.formerr { color: var(--crimson); font-weight: 700; margin-top: 16px; min-height: 1.6em; }
.done { display: none; }
.done.show { display: block; animation: rise 1s var(--ease); }
@keyframes rise { from { opacity: 0; transform: translateY(30px); } }
.done h2 { margin-bottom: 18px; }
.done p { color: #4b4f57; max-width: 30em; }
.done .seal { width: 110px; height: 110px; margin-bottom: 30px; color: var(--crimson); }
.done .seal circle, .done .seal path { stroke-dasharray: 400; stroke-dashoffset: 400; animation: drawseal 1.6s var(--ease) forwards; }
.done .seal path { animation-delay: .5s; }
@keyframes drawseal { to { stroke-dashoffset: 0; } }

/* ---------- Footer ---------- */
.foot { background: var(--graphite); color: #cfd2d6; padding: clamp(70px, 9vw, 120px) 0 30px; }
.foot__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 36px; padding-bottom: 60px; border-bottom: 1px solid rgba(255,255,255,.1); }
.foot .logo { color: var(--paper); }
.foot p.tag { margin-top: 18px; max-width: 22em; }
.foot h4 { font-size: .9rem; font-weight: 700; color: var(--blush); margin-bottom: 16px; }
.foot ul { list-style: none; display: grid; gap: 8px; }
.foot a:hover { color: #fff; }
.foot__mono { display: flex; justify-content: space-between; align-items: end; gap: 20px; padding: 40px 0 26px; }
.foot__mono .serif { font-size: clamp(3.4rem, 12vw, 11rem); line-height: .8; color: var(--paper); letter-spacing: -.04em; }
.foot__mono .serif em { font-style: normal; color: var(--crimson); }
.foot__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; font-size: .86rem; color: #8f949b; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.1); }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 1080px) {
  .links, .mast .btn { display: none; }
  .burger { display: block; }
  .foot__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 960px) {
  .hero__grid, .sv-hero__top, .flow__grid, .cv-hero__grid, .dist-grid, .corridor__grid, .manifest__grid, .callout .shell, .ct { grid-template-columns: 1fr; }
  .orbit { height: 480px; }
  .ledger .shell { grid-template-columns: 1fr 1fr; }
  .ledger .shell > div:nth-child(3) { border-left: 0; padding-left: 0; }
  .ledger .shell > div:nth-child(n+3) { border-top: 1px solid var(--rule); }
  .statement h2, .statement .ph, .statement .copy { grid-column: 1 / -1; }
  .row { grid-template-columns: 1fr auto; }
  .row p { grid-column: 1 / -1; grid-row: 2; }
  .follow { display: none; }
  .accordion { flex-direction: column; height: auto; }
  .acc { flex: none; height: 110px; transition: height .9s var(--ease); }
  .acc.active { flex: none; height: 460px; }
  .acc__vert { writing-mode: horizontal-tb; transform: none; top: auto; bottom: 30px; }
  .counter { position: static; }
  .counter .num { font-size: 8rem; }
  .fstep { min-height: 0; padding: 40px 0; opacity: 1; }
  .pull__cols p, .pull__cols p:first-child { grid-column: 1 / -1; }
  .founder .shell { grid-template-columns: 1fr; }
  .values__grid { grid-template-columns: 1fr; }
  .value, .value + .value { padding: 30px 0; border-right: 0; border-bottom: 1px solid var(--rule); }
  .ct__side { padding-top: 120px; }
  .ct__form { padding-top: 60px; }
}
@media (max-width: 640px) {
  body { font-size: 1rem; }
  .ledger .shell { grid-template-columns: 1fr; }
  .ledger .shell > div { border-left: 0 !important; padding-left: 0; border-top: 1px solid var(--rule); }
  .ledger .shell > div:first-child { border-top: 0; }
  .orbit { height: 400px; }
  .ring b { font-size: 36px; line-height: 44px; margin-top: -22px; width: 32px; margin-left: -16px; }
  .stamp { width: 96px; height: 96px; font-size: .68rem; }
  .stamp strong { font-size: 1.2rem; }
  .foot__grid { grid-template-columns: 1fr; }
  .logo small { display: none; }
  .mf div { grid-template-columns: 1fr; gap: 2px; }
  .dist-table td:first-child { font-size: 1.2rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-up], [data-wipe] { opacity: 1; transform: none; clip-path: none; }
  [data-ink] .ink-f { clip-path: none; }
}
