/*
 * SecureEdge Group, the corporate one-pager.
 *
 * The design is the SecureEdge Advisory site's own (Partha, 2026-09-29: "our design is far
 * better, don't change the design"): the same tokens, the same type scale, the same navy card,
 * cards and closing band, copied by value from SecureEdgeAdvisory/src/app/globals.css so the
 * three sites read as one family. If a value changes there, change it here.
 *
 * System fonts only: no font request leaves the page.
 */
:root{
  --bg:#f3f6fb; --surf:#ffffff; --line:#e5eaf2; --line2:#d5deea;
  --ink:#0f2748; --ink2:#42506b; --ink3:#7889a3;
  --acc:#1d4ed8; --acc2:#2563eb; --acc-soft:#eaf1ff; --acc-line:#cfe0ff;
  --navy:#0f2748; --navy2:#16325a;
  --sh:0 1px 2px rgba(15,39,72,.05),0 1px 3px rgba(15,39,72,.04);
  --sh2:0 12px 32px rgba(15,39,72,.14);
  --sans:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",system-ui,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,monospace;
  --r-pill:999px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
a{color:var(--acc);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{margin:0;text-wrap:balance}
p{margin:0}
:focus-visible{outline:3px solid rgba(29,78,216,.35);outline-offset:2px;border-radius:4px}
.wrap{max-width:1240px;margin:0 auto;padding:0 56px}
.skip{position:absolute;left:-9999px;top:8px;background:var(--surf);padding:8px 12px;border-radius:8px;z-index:99}
.skip:focus{left:16px}
.eyebrow{font-family:var(--mono);font-size:11.5px;color:var(--acc);letter-spacing:.02em;font-weight:600}
.sec-h{font-size:12.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--ink3)}

/* ── the group bar: the same strip on all three SecureEdge sites ── */
.gbar{background:var(--navy);color:#8598b8;font-size:12px}
.gbar .wrap{display:flex;align-items:center;gap:4px;height:32px;overflow-x:auto;white-space:nowrap}
.gbar-h{color:#fff;font-weight:650;margin-right:12px}
.gbar-i{padding:2px 8px;border-radius:var(--r-pill);color:#aebfd8}
a.gbar-i:hover{color:#fff;text-decoration:none}
.gbar-i.on{background:rgba(255,255,255,.14);color:#fff}
.gbar-i.soon{color:#6f84a6}

/* ── nav ── */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:26px;height:64px}
.brand{display:flex;align-items:center;gap:11px;font-weight:700;font-size:16px;letter-spacing:-.02em;color:var(--ink)}
.brand:hover{text-decoration:none}
.brand .m{width:30px;height:30px;border-radius:8px;background:var(--navy);display:grid;place-items:center;font-size:11px;font-weight:800;color:#fff}
.brand small{font-size:9px;font-weight:500;color:var(--ink3);letter-spacing:.09em;text-transform:uppercase}
.nav nav{display:flex;gap:22px;margin-left:6px}
.nav nav a{color:var(--ink2);font-size:14px;font-weight:500}
.nav nav a:hover{color:var(--ink);text-decoration:none}
.nav .sp{flex:1}
.btn{display:inline-block;font-size:14px;font-weight:640;padding:12px 20px;border-radius:10px;background:var(--acc);color:#fff;white-space:nowrap}
.btn:hover{background:var(--acc2);text-decoration:none}
.btn.sm{font-size:13px;padding:9px 16px}
.btn.ghost{background:var(--surf);color:var(--ink);border:1px solid var(--line2);font-weight:560}
.btn.ghost:hover{border-color:var(--ink3)}

/* ── hero ── */
.hero{padding:64px 0 24px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:56px;align-items:center}
.hero h1{font-size:clamp(34px,4.6vw,50px);line-height:1.05;font-weight:740;letter-spacing:-.03em;margin:16px 0 0}
.hero p{font-size:17px;line-height:1.62;color:var(--ink2);margin:20px 0 0;max-width:52ch}
.hero .cta{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}
.card-navy{background:var(--navy);border-radius:18px;padding:24px;color:#dce6f5;box-shadow:var(--sh2)}
.card-navy .h{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#7e93b4;margin-bottom:16px}
.card-navy dl{margin:0;display:grid}
.card-navy .row{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:12px 0;border-top:1px solid rgba(255,255,255,.09)}
.card-navy .row:first-child{border-top:0}
.card-navy dt{font-family:var(--mono);font-size:11px;color:#8ba0c0;padding-top:2px}
.card-navy dd{margin:0;font-size:14px;color:#fff;font-weight:600}
.card-navy dd small{display:block;font-size:12px;color:#8ba0c0;font-weight:400;margin-top:2px}

/* ── sections ── */
section{padding:48px 0 0}
.sec-lede{font-size:15px;color:var(--ink2);line-height:1.6;margin:10px 0 0;max-width:68ch}
.sec-title{font-size:26px;font-weight:720;letter-spacing:-.02em;margin:8px 0 0}

.companies{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:24px}
.co{background:var(--surf);border:1px solid var(--line);border-radius:16px;padding:28px;box-shadow:var(--sh);display:flex;flex-direction:column;border-top:3px solid var(--acc)}
.co.adv{border-top-color:var(--navy)}
.co .k{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--acc);letter-spacing:.04em;text-transform:uppercase}
.co.adv .k{color:var(--navy)}
.co h3{font-size:22px;font-weight:720;letter-spacing:-.02em;margin:8px 0 0}
.co .tag{font-size:15px;color:var(--ink);font-weight:600;margin-top:4px}
.co p{font-size:14.5px;color:var(--ink2);line-height:1.6;margin:12px 0 0}
.co ul{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:8px}
.co li{font-size:14px;color:var(--ink);padding-left:20px;position:relative}
.co li::before{content:"";position:absolute;left:4px;top:8px;width:6px;height:6px;border-radius:2px;background:var(--acc);transform:rotate(45deg)}
.co.adv li::before{background:var(--navy)}
.co .co-foot{margin-top:auto;padding-top:24px}
.co .addr{font-family:var(--mono);font-size:13px;font-weight:600}
.co .soon{font-family:var(--mono);font-size:12px;color:var(--ink3)}

.flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:24px}
.flow .step{background:var(--surf);border:1px solid var(--line);padding:24px;position:relative}
.flow .step:first-child{border-radius:14px 0 0 14px}
.flow .step:last-child{border-radius:0 14px 14px 0}
.flow .step:not(:last-child){border-right:0}
.flow .k{font-family:var(--mono);font-size:11px;color:var(--acc);font-weight:600}
.flow h4{font-size:16px;font-weight:660;margin:8px 0 0}
.flow p{font-size:13.5px;color:var(--ink2);line-height:1.55;margin:8px 0 0}
.flow .arr{position:absolute;right:-12px;top:50%;transform:translateY(-50%);width:24px;height:24px;border-radius:50%;background:var(--acc);color:#fff;display:grid;place-items:center;font-size:12px;z-index:2}

.band{background:linear-gradient(180deg,#fff,#f7f9fd);border:1px solid var(--line);border-radius:18px;padding:36px;box-shadow:var(--sh)}
.mv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
.mv>div{background:var(--acc-soft);border:1px solid var(--acc-line);border-radius:12px;padding:20px}
.mv .k{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--acc)}
.mv p{font-size:16px;color:var(--ink);line-height:1.5;margin-top:8px;font-weight:560}
.values{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px}
.val{background:var(--surf);border:1px solid var(--line);border-radius:13px;padding:18px}
.val h4{font-size:14.5px;font-weight:660}
.val p{font-size:13px;color:var(--ink2);line-height:1.55;margin-top:6px}
.promise{margin-top:20px;font-size:15px;color:var(--ink2)}
.promise b{color:var(--ink)}

.trust{margin-top:48px;background:var(--navy);border-radius:18px;padding:32px 36px;color:#dce6f5;display:flex;gap:32px;align-items:center;justify-content:space-between;flex-wrap:wrap;box-shadow:var(--sh2)}
.trust .l{flex:1;min-width:280px}
.trust .k{font-family:var(--mono);font-size:11px;color:#7e93b4;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.trust h3{font-size:23px;font-weight:720;letter-spacing:-.02em;margin:8px 0 0;color:#fff}
.trust p{font-size:14px;color:#a9bcd8;line-height:1.6;margin:12px 0 0;max-width:60ch}
.trust .r{display:flex;gap:12px;flex-wrap:wrap}
.trust .btn.ghost{background:transparent;color:#cfe0ff;border-color:rgba(255,255,255,.22)}

.contact{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}
.mail{background:var(--surf);border:1px solid var(--line);border-radius:14px;padding:20px 24px;box-shadow:var(--sh)}
.mail h4{font-size:15px;font-weight:660}
.mail p{font-size:13.5px;color:var(--ink2);line-height:1.55;margin:6px 0 12px}
.mail a{font-family:var(--mono);font-size:12.5px;font-weight:600;word-break:break-all}

/* ── footer: one row, as on the Advisory site ── */
.foot{margin-top:64px;background:var(--navy)}
.foot .wrap{display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding-top:16px;padding-bottom:16px}
.foot .b{display:flex;align-items:center;gap:8px;color:#fff;font-weight:700;font-size:13px}
.foot .b .m{width:24px;height:24px;border-radius:6px;background:var(--acc);display:grid;place-items:center;color:#fff;font-size:11px;font-weight:800}
.foot .cpy{font-size:12px;color:#8598b8}
.foot nav{display:flex;gap:16px;font-size:12px;flex-wrap:wrap;margin-left:auto}
.foot nav a{color:#aebfd8}
.foot nav a:hover{color:#fff}

/* ── narrower screens ── */
@media (max-width:1100px){.values{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .wrap{padding:0 24px}
  .hero{grid-template-columns:1fr;gap:32px;padding:40px 0 12px}
  .nav nav{display:none}
  .companies,.mv,.contact{grid-template-columns:1fr}
  .flow{grid-template-columns:1fr}
  .flow .step,.flow .step:first-child,.flow .step:last-child{border-radius:14px;border-right:1px solid var(--line)}
  .flow .step:not(:last-child){margin-bottom:12px}
  .flow .arr{display:none}
  .band{padding:24px}
  .trust{padding:24px}
  .foot nav{margin-left:0}
}
@media (max-width:520px){
  .wrap{padding:0 16px}
  .values{grid-template-columns:1fr}
  .card-navy .row{grid-template-columns:1fr;gap:2px}
  .nav .btn{display:none}
}