:root {
  --navy:#0b1b2c; --night:#081624; --ink:#10273b; --muted:#465b6d;
  --paper:#f5f7f7; --white:#fff; --line:#d8e2e7; --soft:#e9f4fa;
  --blue:#005e83; --sky:#8dd8f8; --orange:#ffab75; --dark-line:#2b4155;
  --sans:"Avenir Next", "Segoe UI", system-ui, sans-serif;
  --mono:"SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --gutter:clamp(20px,5.6vw,88px); --max:1264px; --head:83px;
}
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:var(--sans); font-size:16px; line-height:1.58; }
img,svg { display:block; }
a { color:inherit; }
button,input,textarea { font:inherit; }
button { cursor:pointer; }
h1,h2,h3,p,ul { margin:0; }
h1,h2,h3 { line-height:1.08; text-wrap:balance; }
h2 { font-weight:650; font-size:clamp(38px,5vw,69px); letter-spacing:-.065em; }
h3 { font-weight:650; letter-spacing:-.026em; }
[hidden] { display:none !important; }
.sprite { position:absolute; width:0; height:0; overflow:hidden; }
:focus-visible { outline:3px solid #0087ba; outline-offset:4px; }
.dark :focus-visible { outline-color:var(--sky); }
.wrap { width:min(calc(100% - 2 * var(--gutter)),var(--max)); margin-inline:auto; }
.section { padding-block:clamp(64px,8vw,112px); }
section[id] { scroll-margin-top:calc(var(--head) + 12px); }
.icon { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.kicker { display:flex; align-items:center; gap:10px; margin-bottom:18px; color:var(--blue); font:700 11px/1.4 var(--mono); letter-spacing:.14em; text-transform:uppercase; }
.kicker::before { content:""; width:7px; height:7px; flex:none; border-radius:50%; background:#d56820; }
.dark { color:#f3f8fc; background:var(--navy); }
.dark .kicker { color:#a9cde3; }
.dark .kicker::before { background:var(--orange); }
.button { display:inline-flex; min-height:49px; width:fit-content; align-items:center; justify-content:center; gap:14px; border-radius:5px; border:1px solid transparent; padding:11px 18px; text-decoration:none; font-size:14px; font-weight:700; line-height:1.35; transition:background .2s,border-color .2s,color .2s; }
.button .icon { width:16px; height:16px; }
.button-dark { background:var(--ink); color:white; }
.button-dark:hover { background:#16445e; }
.button-sky { background:#a7e2f9; color:#0b2539; }
.button-sky:hover { background:#d2f1fd; }
.button-outline { border-color:#637c91; color:#f3f8fc; background:#0b1b2c4d; }
.button-outline:hover { border-color:var(--sky); background:#17334c; }
.text-link { display:inline-flex; align-items:center; gap:8px; width:fit-content; text-underline-offset:4px; font-size:14px; font-weight:700; color:var(--blue); }
.text-link .icon { width:16px; height:16px; transition:transform .2s; }
.text-link:hover .icon { transform:translate(2px,2px); }
.skip { position:fixed; top:12px; left:12px; z-index:10; background:white; padding:8px 14px; transform:translateY(-150%); }
.skip:focus { transform:translateY(0); }
.site-head { position:sticky; top:0; z-index:5; background:var(--white); border-bottom:1px solid #e4ebef; }
.head-inner { height:calc(var(--head) - 1px); display:flex; align-items:center; justify-content:space-between; gap:28px; }
.logo img { width:139px; height:auto; }
.nav { display:flex; align-items:center; gap:clamp(15px,2.5vw,37px); }
.nav > a:not(.button) { text-decoration:none; color:#293e51; font-size:14px; font-weight:650; }
.nav > a:not(.button):hover { color:var(--blue); text-decoration:underline; text-underline-offset:6px; }
.nav .button { min-height:41px; padding:8px 14px; }
.nav .social { display:grid; place-items:center; width:38px; height:38px; border:1px solid var(--line); border-radius:5px; }
.nav .social .icon { width:17px; height:17px; }
.nav-toggle { display:none; }
.hero { isolation:isolate; position:relative; overflow:hidden; background:radial-gradient(ellipse at 75% 49%,#173955 0%,#0d2135 36%,#091827 74%); }
.hero::after { position:absolute; z-index:-1; content:""; inset:0; opacity:.24; background-image:linear-gradient(90deg,#6a9abb24 1px,transparent 1px),linear-gradient(#6a9abb24 1px,transparent 1px); background-size:80px 80px; mask-image:linear-gradient(90deg,transparent 24%,black 100%); }
.hero-inner { min-height:clamp(510px,47vw,670px); display:grid; grid-template-columns:1.06fr .94fr; align-items:center; position:relative; padding-block:62px 78px; }
.hero-copy { position:relative; z-index:1; }
.hero .kicker { margin-bottom:25px; }
.hero h1 { font-weight:630; font-size:clamp(50px,6.8vw,104px); letter-spacing:-.08em; line-height:.99; text-wrap:initial; }
.hero h1 .intro { display:block; color:#f4f8fa; font-size:.57em; letter-spacing:-.063em; margin-bottom:.14em; }
.hero h1 .subject { display:block; color:#a3e1fb; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:33px; }
.hero-art { position:absolute; width:65%; max-width:855px; right:-8.6%; top:50%; transform:translateY(-48%); z-index:0; pointer-events:none; }
.hero-art svg { width:100%; height:auto; overflow:visible; }
.hero-index { position:absolute; bottom:23px; right:0; color:#88a8c0; display:flex; align-items:center; gap:9px; font:600 10px/1.2 var(--mono); letter-spacing:.14em; text-decoration:none; text-transform:uppercase; }
.hero-index:hover { color:#d9f0ff; }
.hero-index .icon { width:15px; height:15px; }
.difference { background:var(--paper); }
.difference-head { display:grid; grid-template-columns:1fr auto; align-items:end; gap:24px; margin-bottom:32px; }
.difference-head h2 { font-size:clamp(35px,4.4vw,59px); }
.difference-head .kicker { margin-bottom:12px; }
.rule-mark { display:flex; gap:4px; align-items:center; padding-bottom:8px; }
.rule-mark i { width:18px; height:2px; background:#beced7; }
.rule-mark i:first-child { width:30px; background:#bb5b25; }
.values { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-block:1px solid var(--line); }
.value { position:relative; padding:28px clamp(20px,3vw,40px) 30px; border-right:1px solid var(--line); }
.value:first-child { padding-left:0; }
.value:last-child { border-right:0; }
.value-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:23px; }
.value-top .icon { color:var(--blue); width:29px; height:29px; }
.num { font:600 11px/1 var(--mono); color:#4d687b; letter-spacing:.12em; }
.value h3 { font-size:clamp(20px,2.05vw,28px); margin-bottom:12px; }
.value p,.service p,.service li { color:var(--muted); }
.services .section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:31px; }
.section-head h2 { max-width:780px; }
.service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }
.service { border:1px solid var(--line); background:#fbfcfc; border-radius:8px; padding:clamp(19px,2.6vw,33px); display:flex; flex-direction:column; align-items:flex-start; min-height:286px; }
.service.featured { background:#eaf5fa; border-color:#c5e0eb; }
.service .tile-icon { display:grid; place-items:center; width:46px; height:46px; border-radius:5px; border:1px solid #cbdde6; color:var(--blue); margin-bottom:26px; }
.service h3 { font-size:clamp(25px,3vw,38px); margin-bottom:13px; }
.service ul { list-style:none; padding:0; }
.service li { display:grid; grid-template-columns:8px 1fr; gap:8px; }
.service li + li { margin-top:9px; }
.service li::before { content:""; width:4px; height:4px; background:#0075a0; border-radius:50%; margin-top:.66em; }
.service p { margin-bottom:18px; }
.service .text-link { margin-top:auto; }
.formats { margin-top:15px; border:1px solid var(--line); border-radius:7px; display:grid; grid-template-columns:minmax(160px,.8fr) 3fr; align-items:center; padding:18px clamp(19px,2.6vw,33px); gap:22px; }
.formats h3 { font:700 11px/1.4 var(--mono); letter-spacing:.1em; color:var(--blue); text-transform:uppercase; }
.formats ul { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; padding:0; }
.formats li { padding-left:16px; border-left:1px solid var(--line); font-weight:600; font-size:14px; }
.about { background:var(--paper); }
.about-inner { display:grid; grid-template-columns:.93fr 1.07fr; align-items:center; gap:clamp(32px,7vw,107px); }
.about-art { aspect-ratio:1.14; background:#0e253b; border-radius:8px; overflow:hidden; }
.about-art svg { width:100%; height:100%; }
.about-copy h2 { margin-bottom:23px; }
.about-copy p { color:var(--muted); }
.about-copy .lead { color:var(--ink); font-size:clamp(18px,2vw,22px); font-weight:600; line-height:1.45; }
.about-copy p + p { margin-top:13px; }
.about-copy .button { margin-top:26px; }
.derivatives { background:radial-gradient(ellipse at 9% 95%,#153650 0%,#0b1b2c 57%); }
.derivatives-inner { display:grid; grid-template-columns:.78fr 1.22fr; gap:clamp(35px,7vw,104px); align-items:start; }
.derivatives h2 { margin-bottom:20px; }
.derivatives .intro { color:#c1d8e8; max-width:28rem; font-size:clamp(16px,2vw,21px); font-weight:550; }
.solutions { border-top:1px solid var(--dark-line); }
.solutions details { border-bottom:1px solid var(--dark-line); }
.solutions details[open] { background:#17324a53; }
.solutions summary { cursor:pointer; list-style:none; display:grid; grid-template-columns:32px minmax(0,1fr) 31px; gap:14px; align-items:center; min-height:72px; padding:11px 14px; }
.solutions summary::-webkit-details-marker { display:none; }
.solutions summary:hover { background:#1a374f; }
.solutions summary .num { color:#a0cce4; }
.solutions summary strong { font-size:clamp(17px,2vw,23px); line-height:1.18; letter-spacing:-.025em; font-weight:620; }
.solutions summary .toggle { border:1px solid #51728b; border-radius:4px; width:31px; height:31px; display:grid; place-items:center; color:#b6e2f7; }
.solutions summary .icon { width:16px; height:16px; }
.solutions details[open] .v-line { opacity:0; }
.solutions details p { color:#c4d8e7; padding:0 20px 22px 60px; font-size:15px; }
.contact { background:#edf5f8; }
.contact-inner { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(30px,6vw,92px); align-items:start; }
.contact-copy h2 { margin-bottom:19px; }
.contact-copy > p:not(.kicker) { max-width:32ch; color:var(--muted); font-size:19px; }
.contact-channels { margin-top:28px; display:grid; gap:8px; max-width:285px; }
.contact-channels > p { margin-top:10px; font-size:13px; color:var(--muted); }
.contact-channels a { display:flex; align-items:center; gap:10px; color:var(--blue); text-decoration:none; font-weight:650; font-size:15px; }
.contact-channels a:hover { text-decoration:underline; text-underline-offset:4px; }
.form { display:grid; grid-template-columns:1fr 1fr; gap:17px; background:white; border:1px solid #cfdee7; border-radius:8px; padding:clamp(20px,3.3vw,40px); }
.field { display:grid; gap:5px; }
.field label { font-size:14px; font-weight:650; }
.field :is(input,textarea) { background:#f8fafb; border:1px solid #ccdbe3; border-radius:4px; min-width:0; width:100%; min-height:44px; color:var(--ink); padding:9px 11px; }
.field :is(input,textarea):focus { background:white; }
.field textarea { resize:vertical; min-height:106px; }
.full { grid-column:1 / -1; }
.form-action { display:flex; flex-wrap:wrap; gap:12px 16px; align-items:center; }
.form-action .button { min-width:112px; }
.form-note { max-width:39ch; font-size:12px; line-height:1.45; color:var(--muted); }
.form-result { border-left:3px solid #0085b6; padding:8px 11px; background:var(--soft); font-size:14px; }
.form-result a { font-weight:700; color:var(--blue); }
.footer { background:var(--night); }
.footer-main { display:flex; align-items:center; justify-content:space-between; gap:28px; padding-block:28px; border-bottom:1px solid var(--dark-line); }
.footer-mark { display:flex; align-items:center; gap:11px; text-decoration:none; }
.footer-mark svg { width:37px; height:37px; }
.footer-mark strong { display:block; color:#e8f5ff; font-size:23px; line-height:1.02; letter-spacing:-.06em; }
.footer-mark small { display:block; color:#b3ccdf; font-size:11px; }
.footer-address { font-size:14px; color:#c0d6e5; font-style:normal; }
.footer-address strong { display:block; color:#f3f8fc; }
.footer-bottom { color:#b0c7d8; display:flex; flex-wrap:wrap; gap:8px 22px; justify-content:space-between; padding-block:17px; font-size:12px; }
.chat { position:fixed; z-index:4; right:clamp(14px,2.7vw,37px); bottom:clamp(14px,2.7vw,32px); display:grid; justify-items:end; gap:10px; }
.chat-toggle { display:grid; place-items:center; width:51px; height:51px; border:1px solid #b3e8f9; border-radius:50%; background:#0b3248; color:white; box-shadow:0 5px 24px #0a24342e; }
.chat-toggle:hover { background:#14506e; }
.chat-toggle .icon { width:25px; height:25px; }
.chat-box { width:min(280px,calc(100vw - 35px)); background:white; color:var(--ink); border:1px solid var(--line); padding:18px; border-radius:8px; box-shadow:0 7px 30px #0a243426; }
.chat-box strong { display:block; }
.chat-box .button { margin-top:13px; }
.not-found { min-height:100vh; display:grid; align-items:center; padding-block:64px; }
.not-found-text { color:#c1d8e8; max-width:32ch; margin-top:22px; font-size:clamp(17px,2vw,21px); }
@media (max-width:940px) {
  :root { --gutter:clamp(20px,4.8vw,52px); --head:73px; }
  .hero-inner { min-height:510px; }
  .hero-art { width:70%; right:-11%; }
  .service-grid { gap:10px; }
}
@media (max-width:700px) {
  :root { --head:68px; }
  .head-inner { gap:12px; }
  .logo img { width:120px; }
  .nav-toggle { display:grid; place-items:center; border:1px solid var(--line); border-radius:5px; background:white; color:var(--ink); width:42px; height:42px; }
  .nav { display:none; position:absolute; inset:100% 0 auto; background:white; border-bottom:1px solid var(--line); padding:13px var(--gutter) 19px; align-items:stretch; flex-direction:column; gap:0; }
  .nav.is-open { display:flex; }
  .nav > a:not(.button):not(.social) { padding:11px 0; border-bottom:1px solid var(--line); }
  .nav .button,.nav .social { margin-top:11px; }
  .hero-inner { display:flex; flex-direction:column; align-items:stretch; min-height:0; padding-block:45px 20px; }
  .hero h1 { font-size:clamp(55px,12.6vw,84px); }
  .hero .kicker { margin-bottom:18px; }
  .hero-actions { margin-top:25px; gap:9px; }
  .hero-art { position:relative; width:116%; transform:none; top:auto; right:auto; margin:-24px -8% -19px; }
  .hero-index { display:none; }
  .difference-head { margin-bottom:23px; }
  .values,.service-grid,.about-inner,.derivatives-inner,.contact-inner { grid-template-columns:1fr; }
  .value,.value:first-child { padding:20px 0 22px; border-right:0; }
  .value + .value { border-top:1px solid var(--line); }
  .value-top { margin-bottom:12px; }
  .services .section-head { align-items:flex-start; flex-direction:column; margin-bottom:22px; }
  .service { min-height:0; }
  .service .tile-icon { margin-bottom:15px; }
  .formats { grid-template-columns:1fr; gap:12px; }
  .formats ul { grid-template-columns:1fr; gap:8px; }
  .about-art { max-height:330px; }
  .about-copy { grid-row:1; }
  .footer-main { align-items:flex-start; flex-direction:column; gap:18px; }
  .footer-bottom { display:grid; padding-right:58px; }
}
@media (max-width:410px) {
  .hero .button { padding-inline:12px; gap:8px; }
  .hero h1 { font-size:clamp(48px,13vw,55px); }
  .rule-mark { display:none; }
  .form { grid-template-columns:1fr; }
  .solutions summary { grid-template-columns:24px minmax(0,1fr) 31px; gap:9px; padding-inline:8px; }
  .solutions details p { padding-left:41px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; transition:none !important; }
}
