/* OneForce website design 2 - the GitBook look end to end (DSG-00009 v2 measurements + v1 palette),
   carrying the current OneForce copy. Light, dark and system themes (the reference has no dark theme; the dark palette is ours).
   States and motion are additions, not measurements. */
:root{
  color-scheme:light;
  --ink:#1C1917; --ink-2:#57534D; --muted:#6B645E; --page:#FFFFFF; --soft:#FAFAF9; --soft-2:#F4F3F2; --pill:#EFEEED;
  --line:#E7E5E4; --accent:#001FEA; --accent-ink:#0018B8;
  --f-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --f-mono:'Geist Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --s4:4px;--s6:6px;--s8:8px;--s10:10px;--s12:12px;--s14:14px;--s16:16px;--s20:20px;--s24:24px;--s40:40px;--s64:64px;--s112:112px;
  --r-tiny:4px;--r-small:8px;--r-card:16px;--r-input:99px;--r-pill:999px;
  --container:1160px;--narrow:766px;--wide:1345px;--gutter:20px;--gap:112px;
  --nav-bg:rgba(255,255,255,.88);--chip:#fff;--btn-dark-hover:#3b3532;--btn-light-hover:#E4E2E0;--card-hover:#D6D3D1;--input-line:#D6D3D1;--input-line-hover:#A8A29E;--placeholder:#8A837D;--on-ink:#fff;--shadow:rgba(28,25,23,.06);--focus-ring:rgba(28,25,23,.14);--glow-a:rgba(0,31,234,.16);--glow-b:rgba(0,31,234,.09);--glow-c:rgba(28,25,23,.05);--glow-d:rgba(0,31,234,.12);--err:#C9403B;--err-bg:#FEF3F2;--ok:#05603A;--ok-bg:#ECFDF3;--logo-filter:none;--nav-link:#656973;
  --t:200ms;--ease:cubic-bezier(.2,0,0,1);
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  color-scheme:dark;
  --ink:#F5F4F2; --ink-2:#B8C7D6; --muted:#8FA3B7; --page:#18324B; --soft:#21425F; --soft-2:#2A4E6E; --pill:#2F5578;
  --line:#2C4A68; --accent:#001FEA; --accent-ink:#8FA2FF;
  --nav-bg:rgba(24,50,75,.88);--chip:#21425F;--btn-dark-hover:#FFFFFF;--btn-light-hover:#35312E;--card-hover:#4A4541;--input-line:#4A4541;--input-line-hover:#6B645E;--placeholder:#8A837D;--on-ink:#18324B;--shadow:rgba(0,0,0,.45);--focus-ring:rgba(245,244,242,.25);--glow-a:rgba(0,31,234,.22);--glow-b:rgba(0,31,234,.12);--glow-c:rgba(245,244,242,.05);--glow-d:rgba(0,31,234,.16);--err:#F97066;--err-bg:#3A1B18;--ok:#47CD89;--ok-bg:#12261C;--logo-filter:invert(1) brightness(.92);--nav-link:#A8A29E;
}}
:root[data-theme=dark]{
  color-scheme:dark;
  --ink:#F5F4F2; --ink-2:#B8C7D6; --muted:#8FA3B7; --page:#18324B; --soft:#21425F; --soft-2:#2A4E6E; --pill:#2F5578;
  --line:#2C4A68; --accent:#001FEA; --accent-ink:#8FA2FF;
  --nav-bg:rgba(24,50,75,.88);--chip:#21425F;--btn-dark-hover:#FFFFFF;--btn-light-hover:#35312E;--card-hover:#4A4541;--input-line:#4A4541;--input-line-hover:#6B645E;--placeholder:#8A837D;--on-ink:#18324B;--shadow:rgba(0,0,0,.45);--focus-ring:rgba(245,244,242,.25);--glow-a:rgba(0,31,234,.22);--glow-b:rgba(0,31,234,.12);--glow-c:rgba(245,244,242,.05);--glow-d:rgba(0,31,234,.16);--err:#F97066;--err-bg:#3A1B18;--ok:#47CD89;--ok-bg:#12261C;--logo-filter:invert(1) brightness(.92);--nav-link:#A8A29E;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--page);color:var(--ink);font-family:var(--f-sans);font-size:14px;line-height:21px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4,h5{margin:0;font-weight:700;color:var(--ink)}
h1{font-size:29px;line-height:1;letter-spacing:-.58px}
h2{font-size:26px;line-height:1.2;letter-spacing:-.52px}
h3{font-size:17px;line-height:20.4px;letter-spacing:-.34px}
p{margin:0}
.lede{font-size:17px;line-height:25px;color:var(--ink-2);letter-spacing:-.1px}
.skip{position:fixed;left:16px;top:-80px;z-index:400;padding:12px 20px;border-radius:var(--r-pill);background:var(--ink);color:var(--on-ink);font-weight:500;text-decoration:none;transition:top 120ms var(--ease)}
.skip:focus{top:16px}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:var(--r-small)}
.wrap{width:100%;max-width:calc(var(--container) + 2*var(--gutter));margin:0 auto;padding:0 var(--gutter)}
.narrow{max-width:calc(var(--narrow) + 2*var(--gutter))}
.band{padding-top:var(--gap)}
.center{text-align:center}

/* theme switch: light / dark / system */
.theme{flex:none;display:inline-flex;gap:2px;padding:3px;border-radius:var(--r-pill);background:var(--soft-2);border:1px solid var(--line)}
.theme button{all:unset;box-sizing:border-box;width:30px;height:28px;border-radius:var(--r-pill);display:grid;place-items:center;cursor:pointer;color:var(--muted);transition:background var(--t) var(--ease),color var(--t) var(--ease)}
.theme button:hover{color:var(--ink)}
.theme button[aria-pressed=true]{background:var(--page);color:var(--ink);box-shadow:0 1px 2px var(--shadow)}
.theme button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.theme svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* top nav */
.nav{position:sticky;top:0;z-index:100;background:var(--nav-bg);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid transparent}
.nav .wrap{display:flex;align-items:center;gap:var(--s24);height:64px}
.brand{font-weight:700;font-size:17px;letter-spacing:-.34px;text-decoration:none;margin-right:auto;display:flex;align-items:center;gap:var(--s8)}
.brand i{width:20px;height:20px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='30 35 475 475'%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='0'%3E%3Cstop offset='0' stop-color='%238E7CF0'/%3E%3Cstop offset='1' stop-color='%23D96C9E'/%3E%3C/linearGradient%3E%3Cpath fill='url(%23g)' d='M35 235 L486 44 Q502 38 502 56 L502 458 L35 503 Z'/%3E%3C/svg%3E") center/contain no-repeat;display:inline-block}
.nav a.l{color:var(--nav-link);font-weight:500;letter-spacing:-.28px;text-decoration:none;padding:8px 4px;display:none;transition:color var(--t) var(--ease)}
.nav a.l:hover{color:var(--ink)}
.nav a.l[aria-current=page]{color:var(--ink)}

/* buttons: pill, 14/500 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s8);padding:var(--s10) var(--s20);border-radius:var(--r-pill);font:500 14px/14px var(--f-sans);letter-spacing:-.28px;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background var(--t) var(--ease),transform 120ms var(--ease)}
.btn:active{transform:translateY(1px)}
.btn-dark{background:var(--ink);color:var(--on-ink)}
.btn-dark:hover{background:var(--btn-dark-hover)}
.btn-light{background:var(--pill);color:var(--ink)}
.btn-light:hover{background:var(--btn-light-hover)}
.btn[disabled]{opacity:.6;cursor:default}

/* eyebrow badge */
.eyebrow{display:inline-flex;align-items:center;gap:var(--s8);padding:var(--s4) var(--s12) var(--s4) var(--s4);border-radius:var(--r-pill);background:var(--soft-2);font:500 12px/16px var(--f-mono);color:var(--ink-2);letter-spacing:0}
.eyebrow b{background:var(--accent);color:#fff;border-radius:var(--r-pill);padding:var(--s4) var(--s10);font-weight:500}
.tag{font:500 12px/16px var(--f-mono);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}

/* hero */
.hero{position:relative;padding-top:var(--s64);text-align:center;isolation:isolate}
.hero::before{content:"";position:absolute;top:0;left:50%;width:100vw;transform:translateX(-50%);height:640px;z-index:-1;background:
 radial-gradient(520px 320px at 18% 20%,var(--glow-a),transparent 70%),
 radial-gradient(520px 340px at 84% 10%,var(--glow-b),transparent 70%),
 radial-gradient(700px 300px at 50% 0,var(--glow-c),transparent 70%)}
.hero h1{margin:var(--s24) auto var(--s20);max-width:700px}
.hero .lede{max-width:560px;margin:0 auto}
.actions{display:flex;gap:var(--s12);justify-content:center;flex-wrap:wrap;margin-top:var(--s24)}

/* logo strip (integration strip) */
.strip{border:1px solid var(--line);border-radius:var(--r-card);background:var(--soft);padding:var(--s24) var(--s24) var(--s40);text-align:center}
.strip p.tag{margin-bottom:var(--s24)}
.logos{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s12)}
.logo-chip{background:var(--chip);border:1px solid var(--line);border-radius:var(--r-small);height:64px;width:calc(50% - 6px);display:flex;align-items:center;justify-content:center}
.logo-item{display:flex;align-items:center;justify-content:center;gap:10px;height:64px;width:calc(50% - 6px);font-weight:600;font-size:19px;color:var(--ink,inherit)}
.band .strip:has(.logo-item){border:0;background:transparent;padding-top:var(--s16);padding-bottom:var(--s16)}
.logo-item svg{height:28px;width:28px;flex:none}
.logo-chip img{height:26px;width:auto;max-width:96px;opacity:.9;filter:var(--logo-filter)}

/* quote */
.quote h2{font-size:26px;line-height:1.2}
.quote h2 em{font-style:normal;color:var(--ink-2)}
.quote .tag{display:block;margin-bottom:var(--s20)}

/* feature split */
.split{display:grid;gap:var(--s40);align-items:center}
.split h2{margin:var(--s12) 0 var(--s16)}
.split ul{list-style:none;margin:var(--s20) 0 0;padding:0;display:grid;gap:var(--s10)}
.split li{display:flex;gap:var(--s10);color:var(--ink)}
.split li::before{content:"";flex:none;width:6px;height:6px;margin-top:8px;border-radius:99px;background:var(--accent)}
.frame{border-radius:var(--r-card);overflow:hidden;background:#0b0d12;border:1px solid var(--line)}
.frame img{width:100%;height:auto}

/* cards */
.cards{display:grid;gap:var(--s16);margin-top:var(--s40)}
.card{border:1px solid var(--line);border-radius:var(--r-card);background:var(--page);padding:var(--s24);display:flex;flex-direction:column;gap:var(--s12);transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.card:hover{border-color:var(--card-hover);box-shadow:0 8px 24px var(--shadow);transform:translateY(-2px)}
.card .ico{width:36px;height:36px;border-radius:var(--r-small);background:var(--soft-2);display:grid;place-items:center;font:500 13px/1 var(--f-mono);color:var(--ink)}
.card p{color:var(--ink-2)}
.card .tag{margin-top:auto;padding-top:var(--s12)}

/* stats */
.stats{display:grid;gap:var(--s24);margin-top:var(--s40)}
.stat{border-top:1px solid var(--ink);padding-top:var(--s16)}
.stat .n{font-size:45px;line-height:45px;letter-spacing:-.9px;font-weight:700}
.stat p{margin-top:var(--s10);color:var(--ink-2)}

/* wide quote band (leadership) */
.wideband{max-width:calc(var(--wide) + 2*var(--gutter));margin:var(--gap) auto 0;padding:0 var(--gutter)}
.leader{background:var(--soft);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s40) var(--s24);display:grid;gap:var(--s24)}
.leader p.big{font-size:20px;line-height:26px;letter-spacing:-.4px;font-weight:600;color:var(--ink)}
.leader .logos{justify-content:flex-start;margin-top:var(--s8)}

/* closing */
.closing{position:relative;text-align:center;isolation:isolate;padding:var(--s112) 0 var(--s64);margin-top:var(--gap);background:var(--soft)}
.closing::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(600px 260px at 50% 0,var(--glow-d),transparent 70%)}
.closing h2{max-width:560px;margin:var(--s20) auto var(--s12)}
.contact-row{display:flex;gap:var(--s24);justify-content:center;flex-wrap:wrap;margin-top:var(--s40);color:var(--ink-2)}
.contact-row a{font-weight:500;text-decoration:underline;text-underline-offset:3px}

/* footer */
.foot{background:var(--soft);border-top:1px solid var(--line);padding:var(--s40) 0;color:var(--muted)}
.foot .wrap{display:flex;flex-wrap:wrap;gap:var(--s16) var(--s40);justify-content:space-between}
.foot a{text-decoration:none;color:var(--ink-2)}
.foot a:hover{color:var(--ink)}
.foot nav{display:flex;gap:var(--s24)}

/* reveal (addition) */
.rv{opacity:0;transform:translateY(12px);transition:opacity 400ms var(--ease),transform 400ms var(--ease)}
.rv.in{opacity:1;transform:none}

/* contact page */
.page-hero{padding-top:var(--s64);text-align:center}
.page-hero h1{margin:var(--s24) auto var(--s16);max-width:640px}
.contact-grid{display:grid;gap:var(--s24);margin-top:var(--s40)}
.panel{border:1px solid var(--line);border-radius:var(--r-card);background:var(--page);padding:var(--s24)}
.panel.soft{background:var(--soft)}
.form-field{margin-bottom:var(--s16)}
.form-field label{display:block;font-weight:500;letter-spacing:-.28px;margin-bottom:var(--s6)}
.form-field label span{color:var(--muted);font-weight:400}
input,textarea{width:100%;font:400 14px/21px var(--f-sans);color:var(--ink);background:var(--page);border:1px solid var(--input-line);border-radius:var(--r-small);padding:var(--s10) var(--s14);transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease)}
textarea{min-height:128px;resize:vertical}
input::placeholder,textarea::placeholder{color:var(--placeholder)}
input:hover,textarea:hover{border-color:var(--input-line-hover)}
input:focus-visible,textarea:focus-visible{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px var(--focus-ring)}
.form-error{display:none;color:var(--err);font-size:13px;margin-top:var(--s6)}
.form-field.invalid input,.form-field.invalid textarea{border-color:var(--err)}
.form-field.invalid .form-error{display:block}
.form-note{margin-top:var(--s12);color:var(--muted)}
.form-status{display:none;margin-top:var(--s12);padding:var(--s12) var(--s14);border-radius:var(--r-small);background:var(--err-bg);color:var(--err)}
.form-status.show{display:block}
.form-status.ok{background:var(--ok-bg);color:var(--ok)}
.info h3{margin-bottom:var(--s10)}
.info .row{display:flex;justify-content:space-between;gap:var(--s16);padding:var(--s10) 0;border-top:1px solid var(--line)}
.info .k{color:var(--muted)}
.info .note{margin-top:var(--s16);padding-top:var(--s16);border-top:1px solid var(--line);color:var(--ink-2)}
.info a{text-decoration:underline;text-underline-offset:3px}
.faq{margin-top:var(--s40);border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line);padding:var(--s16) 0}
summary{cursor:pointer;font-weight:600;font-size:17px;line-height:22px;letter-spacing:-.34px;list-style:none;display:flex;justify-content:space-between;gap:var(--s16)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-weight:400;font-size:20px;line-height:20px;color:var(--muted)}
details[open] summary::after{content:"–"}
details p{margin-top:var(--s10);color:var(--ink-2)}

/* >= 810 tablet */
@media (min-width:810px){
  :root{--gutter:40px}
  h1{font-size:45px;letter-spacing:-.9px}
  h2{font-size:32px;line-height:38.4px;letter-spacing:-.64px}
  .quote h2{font-size:32px}
  .nav a.l{display:inline-block}
  .hero{padding-top:112px}
  .logo-chip,.logo-item{width:calc(33.333% - 8px)}
  .split{grid-template-columns:1fr 1fr;gap:64px}
  .split.rev .copy{order:2}
  .cards{grid-template-columns:repeat(3,1fr)}
  .stats{grid-template-columns:repeat(3,1fr)}
  .leader{padding:var(--s64) var(--s64)}
  .contact-grid{grid-template-columns:1.4fr 1fr}
}
@media (min-width:1200px){ .logo-chip,.logo-item{width:calc(16.666% - 10px)} .leader .logos{gap:var(--s12)} }
@media (min-width:1600px){ :root{--container:1240px} }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} .rv{opacity:1;transform:none;transition:none} .card,.btn{transition:none} .card:hover{transform:none} }

/* hero background: drawn dot field carried over from design-4 (animation only) */
#field{position:absolute;top:0;left:50%;transform:translateX(-50%);width:100vw;height:100%;z-index:-1;pointer-events:none}
.hero{overflow:visible}
.hero>*:not(#field){position:relative}

/* hero tall enough for the whole ring, centred around the text */
.hero{min-height:600px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:var(--s64);padding-bottom:var(--s64)}
.hero .actions{justify-content:center}
@media (max-width:700px){.hero{min-height:620px}}
.leader .strip{margin-top:var(--s24);padding-left:0;padding-right:0}

/* design-7: the colours of the hero ring carried through the page.
   gold, coral, violet, pink, teal = the five bands of the ring. Light and dark each get a tuned set (text-safe on white, bright on navy). */
:root{--c1:#B7791F;--c2:#E2552F;--c3:#6B4FE0;--c4:#C93E7C;--c5:#0E8F78;
  --c1-bg:rgba(244,196,94,.28);--c2-bg:rgba(255,127,92,.20);--c3-bg:rgba(157,140,255,.22);--c4-bg:rgba(232,104,154,.18);--c5-bg:rgba(79,199,176,.22);
  --c1-f:#F4C45E;--c2-f:#FF7F5C;--c3-f:#9D8CFF;--c4-f:#E8689A;--c5-f:#4FC7B0}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--c1:#F4C45E;--c2:#FF7F5C;--c3:#B3A6FF;--c4:#F08AB3;--c5:#4FC7B0;
  --c1-bg:rgba(244,196,94,.18);--c2-bg:rgba(255,127,92,.18);--c3-bg:rgba(157,140,255,.22);--c4-bg:rgba(232,104,154,.18);--c5-bg:rgba(79,199,176,.18)}}
:root[data-theme=dark]{--c1:#F4C45E;--c2:#FF7F5C;--c3:#B3A6FF;--c4:#F08AB3;--c5:#4FC7B0;
  --c1-bg:rgba(244,196,94,.18);--c2-bg:rgba(255,127,92,.18);--c3-bg:rgba(157,140,255,.22);--c4-bg:rgba(232,104,154,.18);--c5-bg:rgba(79,199,176,.18)}

/* hero: glows in ring colours, a ring-colour rule under the headline word block */
.hero::before{background:
 radial-gradient(520px 320px at 16% 22%,var(--c3-bg),transparent 70%),
 radial-gradient(480px 320px at 86% 14%,var(--c2-bg),transparent 70%),
 radial-gradient(520px 300px at 70% 90%,var(--c5-bg),transparent 70%),
 radial-gradient(420px 260px at 30% 95%,var(--c1-bg),transparent 70%)}
.eyebrow b{background:linear-gradient(90deg,#8E7CF0,#D96C9E)}
.btn-dark{background:var(--ink)}
.hero .btn-light{box-shadow:inset 0 0 0 1.5px var(--c3)}

/* section tags: one ring colour each, with a small dot */
.tag{display:inline-flex;align-items:center;gap:8px}
.tag::before{content:"";width:8px;height:8px;border-radius:99px;background:var(--tc,var(--c3))}
main>section:nth-of-type(2) .tag{--tc:var(--c1)}
main>section:nth-of-type(3) .tag{--tc:var(--c2)}
main>section:nth-of-type(4) .tag{--tc:var(--c3)}
main>section:nth-of-type(5) .tag{--tc:var(--c4)}
main>section:nth-of-type(6) .tag{--tc:var(--c5)}
.card .tag,.leader .tag#lead-h{--tc:inherit}
.card .tag::before{display:none}
.quote h2 em{background:linear-gradient(90deg,var(--c2),var(--c4),var(--c3));-webkit-background-clip:text;background-clip:text;color:transparent}

/* cards: icon chip + top edge + tag in each colour */
.cards .card{border-top:3px solid var(--cc)}
.cards .card:nth-child(1){--cc:var(--c1)}.cards .card:nth-child(2){--cc:var(--c2)}.cards .card:nth-child(3){--cc:var(--c5)}
.cards .card:nth-child(1) .ico{background:var(--c1-bg)}.cards .card:nth-child(2) .ico{background:var(--c2-bg)}.cards .card:nth-child(3) .ico{background:var(--c5-bg)}
.cards .card .ico{color:var(--cc)}
.cards .card .tag{color:var(--cc)}

/* feature lists and frames */
.split.rev li::before{background:var(--c4)}
.split:not(.rev) li::before{background:var(--c5)}

/* stats: each figure in a ring colour */
.stat:nth-child(1){--sc:var(--c1)}.stat:nth-child(2){--sc:var(--c2)}.stat:nth-child(3){--sc:var(--c5)}
.stat{border-top:3px solid var(--sc)}
.stat .n{color:var(--sc)}

/* leadership and closing */
.leader{border-top:3px solid var(--c3);background:linear-gradient(180deg,var(--c3-bg),transparent 55%),var(--soft)}
.closing::before{background:
 radial-gradient(520px 240px at 25% 0,var(--c1-bg),transparent 70%),
 radial-gradient(520px 240px at 50% 0,var(--c4-bg),transparent 70%),
 radial-gradient(520px 240px at 75% 0,var(--c5-bg),transparent 70%)}
.foot{border-top:3px solid transparent;border-image:linear-gradient(90deg,var(--c1-f),var(--c2-f),var(--c4-f),var(--c3-f),var(--c5-f)) 1}
.brand i{filter:none}
.quote .tag{display:inline-flex;margin-bottom:var(--s20)}

/* design-7: red C9403B (UT02) as the error/alert red; logo mark carries the ring colours */

/* design-7 mobile: items 1-5 and 7 of the mobile recommendation */
.menu-btn,.mnav{display:none}
.menu-btn{all:unset;box-sizing:border-box;width:44px;height:44px;border-radius:var(--r-pill);place-items:center;cursor:pointer;color:var(--ink);background:var(--soft-2);border:1px solid var(--line)}
@media (min-width:810px){.menu-btn,.mnav{display:none}}
.menu-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.menu-btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.hero .eyebrow{flex-wrap:wrap;max-width:100%;justify-content:center}
.hero{max-width:100%}
.foot{padding-bottom:calc(var(--s40) + env(safe-area-inset-bottom))}
@media (max-width:809px){
  body{font-size:16px;line-height:24px}
  input,textarea{font-size:16px}
  .nav .wrap{gap:var(--s12)}
  .nav .wrap>.theme{display:none}
  .menu-btn{display:grid}
  .mnav{display:none;border-top:1px solid var(--line);background:var(--page);padding:var(--s8) var(--gutter) var(--s16)}
  .mnav.open{display:block}
  .mnav a.l{display:flex;align-items:center;min-height:48px;padding:0 4px;border-bottom:1px solid var(--line);font-weight:500;text-decoration:none;color:var(--ink)}
  .mnav .theme{margin-top:var(--s16)}
  .mnav .theme button{width:44px;height:44px}
  .btn{min-height:44px;padding:var(--s14) var(--s20)}
  .hero .actions{flex-direction:column;align-items:stretch;width:100%}
  .foot a{display:inline-flex;align-items:center;min-height:44px}
  .foot nav{flex-wrap:wrap;gap:var(--s4) var(--s24)}
  summary{min-height:44px;align-items:center}
  .contact-row a{display:inline-flex;align-items:center;min-height:44px}
}
@media (hover:none){.card:hover{transform:none;box-shadow:none;border-color:var(--line)}}
form .btn[type=submit]{scroll-margin-bottom:120px}

/* hero glow: from under the nav band, full width, at least the viewport height below the nav, fading into the next section */
.hero::before{height:calc(100vh - 64px + 200px);height:calc(100svh - 64px + 200px);min-height:640px;
 -webkit-mask-image:linear-gradient(#000 0,#000 calc(100% - 260px),transparent 100%);mask-image:linear-gradient(#000 0,#000 calc(100% - 260px),transparent 100%);
 background:
 radial-gradient(60% 45% at 14% 24%,var(--c3-bg),transparent 72%),
 radial-gradient(55% 42% at 88% 16%,var(--c2-bg),transparent 72%),
 radial-gradient(60% 40% at 72% 78%,var(--c5-bg),transparent 72%),
 radial-gradient(55% 38% at 24% 84%,var(--c1-bg),transparent 72%),
 radial-gradient(70% 35% at 50% 0,var(--c4-bg),transparent 72%)}
/* mobile: the ring gets its own band above the text; it may run off the sides but never sits behind text or buttons */
@media (max-width:700px){
  .hero{min-height:0;justify-content:flex-start;padding-top:300px;padding-bottom:var(--s48,48px)}
  #field{top:0;height:290px}
  .hero .actions{margin-top:var(--s32,32px)}
}

/* market intelligence: one image per theme */
.mi-frame{background:#fff}.mi-frame .mi-dark{display:none}
:root[data-theme=dark] .mi-frame{background:#18324B}:root[data-theme=dark] .mi-frame .mi-light{display:none}:root[data-theme=dark] .mi-frame .mi-dark{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .mi-frame{background:#18324B}:root:not([data-theme=light]) .mi-frame .mi-light{display:none}:root:not([data-theme=light]) .mi-frame .mi-dark{display:block}}

.frame picture{display:block}.frame img{display:block;max-width:100%}
@font-face{font-family:"Axiforma";src:url(assets/axiforma-semibold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
.brand{font-family:Axiforma,Inter,-apple-system,sans-serif;font-weight:600;font-size:20px;letter-spacing:-.2px;gap:5px}
.brand .mark{height:28px;width:auto;flex:none;display:block}

.info .li-link{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--line);border-radius:var(--r-small);color:var(--ink);text-decoration:none;margin-bottom:var(--s16)}
.info .li-link:hover{border-color:var(--card-hover)}
.info .city{display:block;width:100%;height:auto;border-radius:var(--r-small);border:1px solid var(--line)}
