/* Valiant REI — page-level styles layered on the Industry design system (ds.css). */
:root{
  --edge: clamp(20px, 5vw, 72px);
  --sec: clamp(60px, 8vw, 128px);
  --gold: #D9AA2F;
  --gold-deep: #B8893F;
  --gold-pale: #F5E9A0;
  --gold-text: #7f6116;
  --field: #1d2d3d;
  --field-text: #f2f2f3;
  --field-dim: #b5d9fd;
  --small-accent: var(--color-accent-700);
  --ink-2: color-mix(in srgb, var(--color-text) 84%, transparent);
  --ink-3: color-mix(in srgb, var(--color-text) 70%, transparent);
  --hair: color-mix(in srgb, var(--color-text) 14%, transparent);
  color-scheme: light;
}
[data-theme="dark"]{
  --color-bg: #121517;
  --color-surface: #1b1f22;
  --color-text: #e9ecee;
  --color-divider: color-mix(in srgb, #e9ecee 22%, transparent);
  --color-accent: #94bce3;
  --gold-text: #e3c161;
  --field: #0c1114;
  --small-accent: var(--color-accent-300);
  --ink-2: color-mix(in srgb, var(--color-text) 88%, transparent);
  --ink-3: color-mix(in srgb, var(--color-text) 74%, transparent);
  --hair: color-mix(in srgb, var(--color-text) 20%, transparent);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.5);
  --shadow-md: 0 3px 12px rgba(0,0,0,.55);
  --shadow-lg: 0 14px 40px rgba(0,0,0,.6);
  color-scheme: dark;
}

html{ scroll-behavior: smooth; }
body{ margin:0; text-wrap: pretty; -webkit-font-smoothing: antialiased; font-weight:500; line-height:1.62; min-height:100vh; overflow-x:hidden; }
p, dd, li, td, figcaption, address, label, .input, input, textarea, blockquote{ font-weight:500; }
dt, th, caption, strong, b, .field label{ font-weight:700; }
a{ font-weight:500; color: var(--small-accent); text-underline-offset: 3px; }
a:hover{ color: var(--gold-text); }
img{ display:block; max-width:100%; background: color-mix(in srgb, var(--color-text) 7%, transparent); }
img.logo{ background: transparent; }
button{ font-family: inherit; }

.wrap{ max-width:1240px; margin:0 auto; padding:0 var(--edge); }
.grid4{ display:grid; gap:1px; grid-template-columns: repeat(2, minmax(0,1fr)); }
.grid3{ display:grid; gap:1px; grid-template-columns: minmax(0,1fr); }
@media (max-width: 540px){ .grid4{ grid-template-columns: minmax(0,1fr); } }
@media (min-width: 1080px){ .grid4{ grid-template-columns: repeat(4, minmax(0,1fr)); } }
@media (min-width: 760px){ .grid3{ grid-template-columns: repeat(3, minmax(0,1fr)); } }
.split{ display:grid; gap: clamp(28px,4vw,56px); grid-template-columns: minmax(0,1fr); }
@media (min-width: 900px){ .split{ grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items:center; } .split-contact{ grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); align-items:start; } .split-thesis{ grid-template-columns: minmax(0,.8fr) minmax(0,1.4fr); align-items:start; } }

/* — boot / reveal — */
html.preload body{ opacity:0; }
body{ transition: opacity .55s ease; }
html.preload .hero, html.preload .kb{ animation-play-state: paused; }
@keyframes heroIn{ from{ opacity:0; } to{ opacity:1; } }
.hero{ animation: heroIn .9s ease both; }
.boot{ transition: none !important; }
.rv, .rv-l, .rv-r, .rv-c{ opacity:0; transform: translateY(14px); }
.rv.in, .rv-l.in, .rv-r.in, .rv-c.in{ opacity:1; transform:none; transition: opacity .7s cubic-bezier(.33,.9,.4,1), transform .7s cubic-bezier(.33,.9,.4,1); }
.rv-s{ opacity:0; }
.rv-s.in{ opacity:1; transition: opacity .7s cubic-bezier(.33,.9,.4,1); }
.px{ will-change: transform; }
@keyframes kb{ from{ transform: scale(1.06);} to{ transform: scale(1.16) translate3d(-1.6%,-1.4%,0);} }
.kb{ animation: kb 28s ease-in-out infinite alternate; will-change: transform; }
.zoom img{ transition: transform .7s cubic-bezier(.22,.61,.36,1), filter .7s ease; }
.zoom:hover img{ transform: scale(1.07); }

/* — header — */
.skip{ position:absolute; left:-9999px; top:0; z-index:200; background: var(--color-accent); color: var(--color-bg); padding: 10px 16px; font-family: var(--font-heading); font-size:15.5px; letter-spacing:.06em; text-transform:uppercase; text-decoration:none; }
.skip:focus{ left:8px; top:8px; }
.hdr{ position: sticky; top: 0; z-index: 60; background: color-mix(in srgb, var(--color-bg) 92%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--hair); padding: 18px 0; transition: padding .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s ease, background-color .3s ease; }
.hdr.compact{ padding: 7px 0; box-shadow: 0 1px 0 var(--hair), var(--shadow-sm); }
.hdr-in{ display:flex; align-items:center; gap: clamp(16px,3vw,40px); }
.prog{ position:absolute; left:0; bottom:-1px; height:2px; width:100%; transform: scaleX(0); transform-origin:left; background: linear-gradient(90deg, var(--gold-deep), var(--gold) 45%, var(--gold-pale)); }
.brand{ display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; text-align:left; }
.brand:hover{ color:inherit; }
.brand img{ width:40px; height:40px; object-fit:cover; }
.brand-name{ display:block; font-family: var(--font-heading); font-weight:600; font-size:21px; line-height:1; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.brand-est{ display:block; font-family: var(--font-heading); font-size:10px; line-height:1.4; letter-spacing:.22em; text-transform:uppercase; color: var(--gold-text); margin-top:3px; }
.nav-desk{ margin-left:auto; display:flex; align-items:center; gap: clamp(10px,1.6vw,22px); }
.nav-group{ display:flex; align-items:center; gap: clamp(10px,1.6vw,22px); }
.nav-sep{ width:1px; height:22px; background: var(--hair); }
.navlink{ background:none; border:0; padding:5px 0; cursor:pointer; font-family:var(--font-heading); font-weight:600; font-size:15px; letter-spacing:.11em; text-transform:uppercase; color:inherit; text-decoration:none; transition:color .25s ease; }
.navlink:hover{ color: var(--gold-text); }
.navlink[aria-current="page"]{ color: var(--gold-text); }
.sweep{ position:relative; }
.sweep::after{ content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .36s cubic-bezier(.22,.61,.36,1); }
.sweep:hover::after, .navlink[aria-current="page"]::after{ transform: scaleX(1); }
.util{ font-size:13.5px; letter-spacing:.04em; color: var(--ink-3); text-decoration:none; }
.util:hover{ color: var(--color-text); }
.theme-btn{ width:34px; height:34px; display:grid; place-items:center; background:none; border:1px solid var(--hair); cursor:pointer; color: var(--ink-2); }
.theme-btn:hover{ color: var(--color-text); border-color: var(--color-text); }
.theme-btn .ic-moon, [data-theme="dark"] .theme-btn .ic-sun{ display:none; }
[data-theme="dark"] .theme-btn .ic-moon{ display:block; }
.burger{ display:none; margin-left:auto; width:42px; height:42px; place-items:center; background:none; border:1px solid var(--hair); cursor:pointer; color: var(--color-text); }
@media (max-width: 1079px){ .nav-desk{ display:none; } .burger{ display:grid; } }

/* — buttons — */
.btn-gold{ display:inline-flex; align-items:center; gap:10px; font-family: var(--font-heading); font-weight:600; font-size:16.5px; letter-spacing:.1em; text-transform:uppercase; color:#17130a; background: linear-gradient(100deg, var(--gold-deep), var(--gold) 45%, var(--gold-pale)); border:0; padding:16px 26px; min-height:52px; cursor:pointer; text-decoration:none; }
.btn-gold:hover{ filter: brightness(1.07); color:#17130a; }
.btn-gold.sm{ font-size:15px; padding:11px 18px; min-height:0; gap:8px; box-shadow: var(--shadow-sm); }
.btn-gold.md{ font-size:16px; padding:15px 24px; min-height:50px; }
.btn-gold:disabled{ opacity:.6; cursor:progress; filter:none; }
.btn-line{ display:inline-flex; align-items:center; gap:10px; font-family: var(--font-heading); font-weight:600; font-size:16.5px; letter-spacing:.1em; text-transform:uppercase; color:#fff; background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.5); padding:16px 26px; min-height:52px; cursor:pointer; text-decoration:none; }
.btn-line:hover{ background: rgba(255,255,255,.16); border-color:#fff; color:#fff; }
.btn-line.md{ font-size:16px; padding:15px 24px; min-height:50px; border-color: rgba(255,255,255,.45); }
.link-cta{ display:inline-flex; align-items:center; gap:9px; background:none; border:0; padding:6px 0; cursor:pointer; font-family: var(--font-heading); font-weight:600; font-size:16px; letter-spacing:.1em; text-transform:uppercase; color: var(--small-accent); text-decoration:none; }
.mag{ transition: transform .28s cubic-bezier(.22,.61,.36,1), filter .28s ease; }

/* — sections — */
.kicker{ margin:0 0 12px; font-family: var(--font-heading); font-size:14.5px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; color: var(--small-accent); }
.rule{ height:1px; border:0; margin:0 0 22px; background: var(--color-divider); }
.h-page{ margin:0; font-family: var(--font-heading); font-weight:600; font-size: clamp(34px,5.6vw,76px); line-height:1.03; letter-spacing:.008em; text-transform:uppercase; max-width:22ch; }
.h-sec{ margin:0; font-family: var(--font-heading); font-weight:600; font-size: clamp(28px,3.8vw,48px); line-height:1.05; text-transform:uppercase; }
.lede{ margin:22px 0 0; font-size: clamp(17px,1.5vw,21px); line-height:1.62; color: var(--ink-2); max-width:62ch; }
.pagehead{ border-bottom:1px solid var(--hair); background: var(--color-surface); }
.pagehead .wrap{ padding-top: clamp(48px,7vw,104px); padding-bottom: clamp(36px,5vw,64px); }
.sec{ padding: var(--sec) 0; }
.tierrow{ text-align:left; background: var(--color-bg); border:0; padding: clamp(20px,2.6vw,30px); cursor:pointer; color:inherit; text-decoration:none; display:block; transition: background-color .3s ease, transform .3s cubic-bezier(.22,.61,.36,1); }
.tierrow:hover{ background: var(--color-surface); transform: translateY(-5px); color:inherit; }
.lift{ transition: transform .34s cubic-bezier(.22,.61,.36,1), border-color .34s ease, box-shadow .34s ease; }
.lift:hover{ transform: translateY(-6px); border-color: var(--gold); box-shadow: var(--shadow-md); }
.lift:hover .corner{ color: var(--gold); }
.stat{ background: var(--color-surface); padding: clamp(14px,2vw,22px) clamp(14px,2.4vw,28px); }
.stat-n{ margin:0; font-family: var(--font-heading); font-weight:600; font-size: clamp(34px,4.4vw,52px); line-height:1; letter-spacing:-.01em; color: var(--gold-text); font-feature-settings:'tnum' 1; }
.stat-l{ margin:8px 0 0; font-family: var(--font-heading); font-size:13.5px; letter-spacing:.16em; text-transform:uppercase; color: var(--ink-2); }
.spec dt{ font-size:13.5px; letter-spacing:.06em; text-transform:uppercase; color: var(--ink-3); flex:none; }
.spec dd{ margin:0; font-size:15.5px; line-height:1.55; text-align:right; color: var(--color-text); }
.spec > div{ display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-top:1px solid var(--hair); }
.spec > div:last-child{ border-bottom:1px solid var(--hair); }
.more{ margin-top:auto; padding-top:18px; display:inline-flex; align-items:center; gap:8px; background:none; border:0; cursor:pointer; color: var(--small-accent); font-family: var(--font-heading); font-weight:600; font-size:14.5px; letter-spacing:.1em; text-transform:uppercase; align-self:flex-start; min-height:44px; }
.more svg{ transition: transform .3s ease; }
.more[aria-expanded="true"] svg{ transform: rotate(180deg); }
.detail{ margin:16px 0 0; font-size:15.5px; line-height:1.6; color: var(--ink-2); border-left:2px solid var(--gold); padding-left:14px; }
.faq-q{ width:100%; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:20px; background:none; border:0; padding:20px 0; min-height:60px; cursor:pointer; color:inherit; font-family: var(--font-heading); font-weight:600; font-size: clamp(17px,1.7vw,21px); text-transform:uppercase; }
.faq-q .pm{ flex:none; color: var(--gold-text); font-size:22px; line-height:1; width:1em; text-align:center; }
.faq-q .pm::before{ content:"+"; }
.faq-q[aria-expanded="true"] .pm::before{ content:"−"; }
.faq-a{ margin:0 0 22px; font-size:17px; line-height:1.65; color: var(--ink-2); max-width:66ch; }
.faq-item{ border-top:1px solid var(--hair); }
.faq-item:last-child{ border-bottom:1px solid var(--hair); }
.tbl-wrap{ overflow-x:auto; border:1px solid var(--hair); }
.cmp{ width:100%; min-width:760px; border-collapse:collapse; font-size:16px; }
.cmp caption{ text-align:left; padding: 14px 16px; font-family: var(--font-heading); font-size:13.5px; letter-spacing:.14em; text-transform:uppercase; color: var(--ink-3); border-bottom:1px solid var(--hair); }
.cmp thead th{ text-align:left; padding:16px; border-bottom:1px solid var(--color-divider); }
.cmp thead th.attr{ font-family: var(--font-heading); font-size:13.5px; letter-spacing:.14em; text-transform:uppercase; color: var(--ink-3); width:20%; }
.cmp thead .n{ display:block; font-family: var(--font-heading); font-size:12.5px; letter-spacing:.14em; color: var(--gold-text); font-feature-settings:'tnum' 1; }
.cmp thead .t{ display:block; font-family: var(--font-heading); font-weight:600; font-size:20px; text-transform:uppercase; }
.cmp tbody th{ text-align:left; padding:14px 16px; font-weight:500; font-size:14px; letter-spacing:.06em; text-transform:uppercase; color: var(--ink-2); border-bottom:1px solid var(--hair); vertical-align:top; }
.cmp tbody td{ padding:14px 16px; border-bottom:1px solid var(--hair); vertical-align:top; }
.cmp tbody tr:last-child th, .cmp tbody tr:last-child td{ border-bottom:0; }

/* — footer — */
.ft{ background: var(--field); color: var(--field-text); border-top:1px solid var(--hair); }
.ft-grid{ padding-top: clamp(44px,6vw,80px); padding-bottom: clamp(28px,3vw,40px); display:grid; gap: clamp(28px,4vw,56px); grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); }
.ft-brand{ grid-column: span 2; min-width:0; }
@media (max-width: 540px){ .ft-brand{ grid-column: span 1; } }
.ft h2{ margin:0 0 14px; font-family: var(--font-heading); font-size:13px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color: var(--gold-pale); }
.ft-links{ display:flex; flex-direction:column; gap:10px; align-items:flex-start; }
.ftlink{ color: var(--field-dim); font-size:16px; text-decoration:none; background:none; border:0; padding:0; cursor:pointer; font: inherit; font-size:16px; }
.ftlink:hover{ color:#fff; }
.ft address{ font-style:normal; font-size:16px; line-height:1.7; color: var(--field-dim); }
.ft address a{ color: inherit; text-decoration:none; }
.ft address a:hover{ color:#fff; }
.ft-legal{ margin:0; padding-top:24px; border-top:1px solid rgba(255,255,255,.18); font-size:14px; line-height:1.7; color: var(--field-dim); max-width:96ch; }
.ft-bottom{ padding-top:22px; padding-bottom: clamp(28px,3vw,40px); display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px 24px; }
.ft-bottom p, .ft-bottom a{ margin:0; font-size:14.5px; letter-spacing:.04em; color: var(--field-dim); text-decoration:none; }
.ft-bottom a:hover{ color:#fff; }

/* — mobile menu — */
.menu{ position:fixed; inset:0; z-index:90; background: var(--color-bg); display:flex; flex-direction:column; padding: 18px var(--edge) 32px; overflow:auto; }
.menu-top{ display:flex; align-items:center; justify-content:space-between; }
.menu-x{ width:42px; height:42px; display:grid; place-items:center; background:none; border:1px solid var(--hair); cursor:pointer; color: var(--color-text); }
.menu-links{ display:flex; flex-direction:column; gap:2px; margin-top:38px; }
.menu-links a{ text-align:left; background:none; border:0; border-bottom:1px solid var(--hair); padding:18px 0; color:inherit; font-family: var(--font-heading); font-weight:600; font-size:30px; letter-spacing:.02em; text-transform:uppercase; min-height:56px; text-decoration:none; }
.menu-links a.gold{ color: var(--gold-text); }
.menu-foot{ margin-top:auto; display:flex; flex-direction:column; gap:14px; padding-top:32px; }
.menu-foot a{ font-size:16.5px; min-height:44px; display:flex; align-items:center; }
.menu-theme{ align-self:flex-start; background:none; border:1px solid var(--hair); padding:12px 16px; min-height:44px; cursor:pointer; color: var(--ink-2); font-family: var(--font-heading); font-size:14.5px; letter-spacing:.1em; text-transform:uppercase; }
body.menu-open{ overflow:hidden; }

/* — contact form — */
.form-note{ margin:20px 0 0; font-size:14px; line-height:1.6; color: var(--ink-3); max-width:60ch; }
.form-msg{ margin:18px 0 0; padding:12px 14px; font-size:15px; line-height:1.55; border:1px solid var(--hair); }
.form-msg.err{ border-color: #b3261e; color: #b3261e; }
[data-theme="dark"] .form-msg.err{ border-color:#ff8a80; color:#ff8a80; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.turnstile-slot{ margin-top:22px; min-height:65px; }
.legal-body{ max-width:74ch; font-size:17px; line-height:1.7; color: var(--ink-2); }
.legal-body h2{ margin:38px 0 12px; font-family: var(--font-heading); font-weight:600; font-size:26px; text-transform:uppercase; color: var(--color-text); }
.legal-body p{ margin:0 0 16px; }
.legal-body ul{ margin:0 0 16px; padding-left:22px; }

/* — reduced motion: no movement (slides, parallax, zoom, lifts), but the
   opacity-only fades for page load, hero and scroll reveals stay — */
html[data-motion="off"], html[data-motion="off"] *{ scroll-behavior:auto; }
html[data-motion="off"] .rv, html[data-motion="off"] .rv-l, html[data-motion="off"] .rv-r, html[data-motion="off"] .rv-s, html[data-motion="off"] .rv-c{ transform:none; }
html[data-motion="off"] .kb{ animation: none; }
html[data-motion="off"] .prog{ display:none; }
html[data-motion="off"] .px{ transform:none !important; }
html[data-motion="off"] .zoom:hover img, html[data-motion="off"] .lift:hover, html[data-motion="off"] .tierrow:hover{ transform:none; }
html[data-motion="off"] *{ transition-duration: .01ms !important; animation-duration: .01ms !important; }
html[data-motion="off"] body{ transition-duration: .55s !important; }
html[data-motion="off"] .hero{ animation-duration: .9s !important; }
html[data-motion="off"] :is(.rv, .rv-l, .rv-r, .rv-s, .rv-c).in:not(.boot){ transition-property: opacity !important; transition-duration: .7s !important; }
