/* ===========================================================
   Richard IT Services — shared stylesheet
   Dark Syne theme · navy / cyan / violet
   =========================================================== */
:root{
  --ink:#0e1625; --ink-2:#141f33; --panel:#18233a;
  --line:rgba(160,170,210,.16);
  --fog:#8b93b4; --mist:#c4c8e6; --paper:#e8e8fc;
  --signal:#45edf2;          /* primary accent */
  --signal-deep:#49299a;     /* violet */
  --amber:#ffb347;
  --display:"Syne",sans-serif;
  --body:"Hanken Grotesk",sans-serif;
  --mono:"JetBrains Mono",monospace;
  --header-h:76px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth; scroll-padding-top:var(--header-h);} /* FIX: stop sticky header covering section tops */
body{
  font-family:var(--body); color:var(--mist); background:var(--ink);
  line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
/* atmospheric background */
body::before{
  content:""; position:fixed; inset:0; z-index:-2;
  background:
    radial-gradient(1100px 600px at 78% -8%, rgba(69,237,242,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 18%, rgba(73,41,154,.22), transparent 55%),
    var(--ink);
}
body::after{
  content:""; position:fixed; inset:0; z-index:-1; opacity:.5;
  background-image:
    linear-gradient(var(--line) 1px,transparent 1px),
    linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(circle at 50% 30%,#000,transparent 80%);
          mask-image:radial-gradient(circle at 50% 30%,#000,transparent 80%);
}
.wrap{max-width:1140px;margin:0 auto;padding:0 28px}
a{color:inherit;text-decoration:none}
.mono{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--signal)}

/* ---------- header ---------- */
header{position:sticky;top:0;z-index:50;backdrop-filter:blur(10px);
  background:rgba(12,19,32,.72);border-bottom:1px solid var(--line)}
.nav,header nav{display:flex;align-items:center;justify-content:space-between;height:var(--header-h)}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--display);font-weight:600;font-size:1.18rem;color:var(--paper)}
/* logo — slightly larger, vertically centered, with breathing room */
.brandimg{height:40px;width:auto;display:block;object-fit:contain}
nav ul{display:flex;gap:26px;list-style:none;align-items:center}
/* nav links as subtle pill buttons */
nav ul a:not(.btn):not(.btn-ticket){font-size:.88rem;font-weight:500;color:var(--mist);padding:8px 15px;border-radius:9px;
  border:1px solid var(--line);background:rgba(18,28,46,.4);transition:color .2s,border-color .2s,background .2s,transform .15s}
nav ul a:not(.btn):not(.btn-ticket):hover{color:var(--paper);border-color:rgba(69,237,242,.4);background:rgba(22,36,59,.7);transform:translateY(-1px)}
nav ul a.active:not(.btn):not(.btn-ticket){color:var(--paper);border-color:rgba(69,237,242,.5);background:rgba(69,237,242,.08)}
.btn{font-family:var(--body);font-weight:600;font-size:.9rem;padding:11px 20px;border-radius:10px;
  background:linear-gradient(90deg,#45edf2 0%,#3aa7ee 50%,#6f4bd8 100%);color:#0e1625;border:0;cursor:pointer;
  transition:transform .15s,box-shadow .2s;display:inline-block;text-decoration:none;-webkit-appearance:none;appearance:none}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 30px -10px rgba(69,237,242,.55)}
/* keyboard focus only — no stray ring on mouse click */
.btn:focus{outline:none}
.btn:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
.btn.ghost{background:transparent;border-color:var(--line);color:var(--mist)}
.btn.ghost:hover{border-color:var(--signal);color:var(--paper);box-shadow:none}
/* ticket button — distinct amber/coral gradient vs the cyan-violet primary */
.btn-ticket{font-family:var(--body);font-weight:600;font-size:.9rem;padding:11px 20px;border-radius:10px;
  background:linear-gradient(90deg,#ffb347 0%,#ff8c5a 50%,#ff6b9d 100%);color:#1a0f0a;border:0;cursor:pointer;
  transition:transform .15s,box-shadow .2s;display:inline-block;text-decoration:none;-webkit-appearance:none;appearance:none}
.btn-ticket:hover{transform:translateY(-2px);box-shadow:0 10px 30px -10px rgba(255,140,90,.6)}
.btn-ticket:focus{outline:none}
.btn-ticket:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.menu-btn{display:none;background:none;border:1px solid var(--line);border-radius:8px;padding:8px 11px;color:var(--mist);cursor:pointer;font-size:1.1rem;line-height:1}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}

/* ---------- hero ---------- */
.hero{padding:88px 0 70px;position:relative}
/* two-column hero: copy left, frosted-glass emblem right */
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.hero-emblem{display:flex;justify-content:center;align-items:center;perspective:1000px}
.hero-emblem .glass{
  position:relative;width:min(360px,90%);aspect-ratio:1;border-radius:32px;
  display:grid;place-items:center;
  /* frosted translucent panel */
  background:linear-gradient(150deg,rgba(180,210,255,.10),rgba(120,150,220,.04));
  backdrop-filter:blur(14px) saturate(120%);
  -webkit-backdrop-filter:blur(14px) saturate(120%);
  border:1px solid rgba(180,200,255,.18);
  box-shadow:
    0 30px 70px -20px rgba(0,0,0,.65),
    0 10px 30px -10px rgba(69,237,242,.18),
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 0 -20px 40px -20px rgba(73,41,154,.35);
  animation:floaty 7s ease-in-out infinite;
}

.turnstile-slot{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
}

/* soft top-light sheen across the glass */
.hero-emblem .glass::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(120% 80% at 30% 0%,rgba(255,255,255,.16),transparent 55%);
}
.hero-emblem .glass img{
  width:64%;height:auto;display:block;position:relative;z-index:1;
  opacity:.96;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.55)) drop-shadow(0 0 24px rgba(69,237,242,.25));
}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@media(prefers-reduced-motion:reduce){.hero-emblem .glass{animation:none}}
/* two-column hero: copy left, frosted logo right */
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.hero-logo{display:flex;justify-content:center;align-items:center;position:relative}
/* soft glow pooled behind the glass */
.hero-logo::before{content:"";position:absolute;width:78%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(69,237,242,.22),rgba(73,41,154,.18) 55%,transparent 72%);
  filter:blur(28px);z-index:0}
.glass-emblem{position:relative;z-index:1;width:min(78%,340px);aspect-ratio:1;border-radius:32px;
  display:grid;place-items:center;
  background:linear-gradient(155deg,rgba(255,255,255,.10),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);
  box-shadow:0 24px 60px -18px rgba(0,0,0,.65), 0 4px 18px -6px rgba(69,237,242,.25), inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .5s ease, box-shadow .5s ease}
/* a faint frosted sheen across the top */
.glass-emblem::after{content:"";position:absolute;inset:0;border-radius:32px;pointer-events:none;
  background:linear-gradient(150deg,rgba(255,255,255,.20),transparent 42%)}
.glass-emblem img{width:58%;height:auto;display:block;position:relative;z-index:2;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.55)) drop-shadow(0 2px 4px rgba(0,0,0,.4))}
.glass-emblem:hover{transform:translateY(-6px);
  box-shadow:0 32px 70px -16px rgba(0,0,0,.7), 0 6px 24px -6px rgba(69,237,242,.35), inset 0 1px 0 rgba(255,255,255,.28)}
.hero .eyebrow{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:30px;padding:7px 14px;background:rgba(22,36,59,.5)}
.hero .eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 4px rgba(69,237,242,.18);animation:pulse 2.4s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px rgba(69,237,242,.18)}50%{box-shadow:0 0 0 8px rgba(69,237,242,0)}}
.hero h1{font-family:var(--display);font-weight:500;color:var(--paper);
  font-size:clamp(2.5rem,6vw,4.6rem);line-height:1.04;letter-spacing:-.02em;margin:26px 0 0;max-width:15ch}
.hero h1 em{font-style:normal;background:linear-gradient(90deg,#45edf2,#8a6cf0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero p.lead{font-size:clamp(1.05rem,2vw,1.3rem);color:var(--fog);max-width:54ch;margin:24px 0 0}
.hero .cta{display:flex;gap:14px;margin-top:36px;flex-wrap:wrap}
.hero .stats{display:flex;gap:40px;margin-top:54px;flex-wrap:wrap;padding-top:30px;border-top:1px solid var(--line)}
.stat .n{font-family:var(--display);font-size:2rem;color:var(--paper);line-height:1}
.stat .l{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fog);margin-top:8px}

/* ---------- sections ---------- */
section{padding:92px 0}
.sec-head{max-width:62ch;margin-bottom:52px}
.sec-head h2{font-family:var(--display);font-weight:500;color:var(--paper);font-size:clamp(1.9rem,4vw,2.9rem);line-height:1.08;letter-spacing:-.01em;margin:14px 0 0}
.sec-head p{color:var(--fog);margin-top:16px;font-size:1.06rem}
h1,h2,h3,.card h3,.bitem h4,.why h4,.step h4{font-family:var(--display)}

/* ---------- services cards ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{position:relative;border:1px solid var(--line);border-radius:18px;padding:30px 26px 32px;
  background:linear-gradient(180deg,rgba(22,36,59,.7),rgba(18,28,46,.4));overflow:hidden;transition:transform .25s,border-color .25s}
.card:hover{transform:translateY(-6px);border-color:rgba(69,237,242,.4)}
.card .num{font-family:var(--mono);font-size:.72rem;color:var(--fog);letter-spacing:.12em}
.card .ic{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;margin:18px 0 18px;
  background:rgba(69,237,242,.1);border:1px solid rgba(69,237,242,.28)}
.card .ic svg{width:24px;height:24px;stroke:var(--signal);fill:none;stroke-width:1.6}
.card h3{font-family:var(--display);font-weight:500;color:var(--paper);font-size:1.42rem;letter-spacing:-.01em}
.card p{color:var(--fog);margin-top:12px;font-size:.97rem}
.card ul{list-style:none;margin-top:18px;display:flex;flex-direction:column;gap:9px}
.card li{display:flex;gap:10px;font-size:.9rem;color:var(--mist)}
.card li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--signal);margin-top:8px;flex:none}
.card .glow{position:absolute;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(69,237,242,.18),transparent 70%);top:-80px;right:-60px;opacity:0;transition:opacity .3s}
.card:hover .glow{opacity:1}

/* ---------- benefits ---------- */
.benefits-sec{padding-top:0}
.bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bitem{border:1px solid var(--line);border-radius:14px;padding:20px 18px;background:linear-gradient(180deg,rgba(27,35,48,.6),rgba(22,27,34,.3))}
.bitem .bic{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:rgba(69,237,242,.10);border:1px solid rgba(69,237,242,.28);margin-bottom:12px}
.bitem .bic svg{width:21px;height:21px;stroke:var(--signal);fill:none;stroke-width:1.6}
.bitem h4{font-family:var(--display);font-weight:500;color:var(--paper);font-size:1.02rem;line-height:1.25;letter-spacing:-.01em}

/* ---------- why / split ---------- */
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
.why-list{display:flex;flex-direction:column;gap:26px;margin-top:8px}
.why{display:flex;gap:18px}
.why .k{font-family:var(--mono);color:var(--signal);font-size:.85rem;padding-top:3px;flex:none;width:34px}
.why h4{font-family:var(--display);font-weight:500;color:var(--paper);font-size:1.18rem}
.why p{color:var(--fog);font-size:.96rem;margin-top:5px}
.panel{border:1px solid var(--line);border-radius:20px;padding:34px;background:linear-gradient(160deg,rgba(22,36,59,.8),rgba(12,19,32,.6));position:relative}
.panel .mono{margin-bottom:18px;display:block}
.panel .row{display:flex;justify-content:space-between;padding:15px 0;border-bottom:1px solid var(--line);font-size:.95rem}
.panel .row:last-child{border-bottom:none}
.panel .row span:first-child{color:var(--fog)}
.panel .row span:last-child{color:var(--paper);font-family:var(--mono);font-size:.85rem}
.panel .ok{color:var(--signal)!important}

/* ---------- industries ---------- */
.inds{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}
.ind{border:1px solid var(--line);border-radius:30px;padding:10px 18px;font-size:.92rem;color:var(--mist);background:rgba(18,28,46,.5)}

/* ---------- process ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:s}
.step{border-top:2px solid var(--line);padding-top:22px;position:relative}
.step::before{counter-increment:s;content:"0" counter(s);font-family:var(--display);font-size:2.4rem;color:var(--signal);line-height:1}
.step h4{font-family:var(--display);font-weight:500;color:var(--paper);font-size:1.25rem;margin-top:12px}
.step p{color:var(--fog);font-size:.95rem;margin-top:8px}

/* ---------- team ---------- */
.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.tcard{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:linear-gradient(160deg,rgba(22,36,59,.8),rgba(12,19,32,.6));transition:transform .25s,border-color .25s}
.tcard:hover{transform:translateY(-6px);border-color:rgba(69,237,242,.4)}
/* uniform photo placeholders — identical aspect ratio for both */
.tphoto{aspect-ratio:4/3;width:100%;display:grid;place-items:center;position:relative;overflow:hidden;
  background:linear-gradient(135deg,rgba(69,237,242,.10),rgba(73,41,154,.22));border-bottom:1px solid var(--line)}
.tphoto img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;transform:scale(1.15) translateY(-6%);transform-origin:center top}.tphoto .ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--fog);width:100%;height:100%}
.tphoto .ph svg{width:54px;height:54px;stroke:var(--signal);fill:none;stroke-width:1.3;opacity:.7}
.tphoto .ph span{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase}
.tphoto .initials{font-family:var(--display);font-size:3.4rem;font-weight:600;color:var(--paper);opacity:.9;letter-spacing:.04em}
.tbody{padding:26px 28px 30px}
.tbody .role{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--signal)}
.tbody h3{font-family:var(--display);font-weight:500;color:var(--paper);font-size:1.55rem;margin:8px 0 2px;letter-spacing:-.01em}
.tbody p.bio{color:var(--fog);font-size:.97rem;margin-top:14px}
.tbody .creds{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}
.cred{font-family:var(--mono);font-size:.74rem;color:var(--mist);border:1px solid var(--line);border-radius:8px;padding:7px 12px;background:rgba(12,19,32,.5)}
.cred b{color:var(--signal)}
.cred.gold {
    border-color: #D4AF37;
    color: #D4AF37;
    box-shadow: 0 0 10px rgba(212, 175, 55, 0.25);
}
.cred.ai {
    border-color: #8B5CF6;
    color: #B794F4;
    box-shadow: 0 0 12px rgba(139, 92, 246, 0.35);
}
.tcontact{display:flex;flex-direction:column;gap:10px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.tcontact a{display:flex;gap:10px;align-items:center;color:var(--mist);font-size:.94rem;transition:color .2s}
.tcontact a:hover{color:var(--paper)}
.tcontact svg{width:18px;height:18px;stroke:var(--signal);fill:none;stroke-width:1.6;flex:none}

/* ---------- client helpdesk band ---------- */
.helpdesk-band{position:relative;overflow:hidden;border:1px solid rgba(69,237,242,.28);border-radius:24px;
  background:linear-gradient(150deg,rgba(22,36,59,.92),rgba(18,28,46,.7));
  padding:48px 52px;display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:center}
.hd-glow{position:absolute;width:420px;height:420px;border-radius:50%;top:-180px;right:-120px;
  background:radial-gradient(circle,rgba(69,237,242,.16),transparent 70%);pointer-events:none}
.hd-left{position:relative;z-index:1}
.hd-left h2{font-family:var(--display);font-weight:500;color:var(--paper);font-size:clamp(1.7rem,3.2vw,2.4rem);line-height:1.1;letter-spacing:-.01em;margin:12px 0 0}
.hd-left p{color:var(--fog);margin-top:16px;font-size:1.02rem;max-width:48ch}
.hd-actions{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap}
.hd-right{position:relative;z-index:1}
.hd-ticket{border:1px solid var(--line);border-radius:16px;background:rgba(12,19,32,.66);padding:22px 24px;backdrop-filter:blur(4px)}
.hd-ticket-head{display:flex;align-items:center;gap:10px;padding-bottom:16px;margin-bottom:8px;border-bottom:1px solid var(--line)}
.hd-dot{width:8px;height:8px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 4px rgba(69,237,242,.18);animation:pulse 2.4s infinite}
.hd-line{display:flex;justify-content:space-between;align-items:center;padding:11px 0;font-size:.92rem;color:var(--fog);border-bottom:1px solid var(--line)}
.hd-line:last-child{border-bottom:none}
.hd-val{font-family:var(--mono);font-size:.82rem;color:var(--mist)}
.hd-pri{color:var(--amber)}
.hd-ok{color:var(--signal)}
@media(max-width:900px){
  .helpdesk-band{grid-template-columns:1fr;gap:30px;padding:34px 26px}
}
.contact{border:1px solid var(--line);border-radius:24px;
  background:linear-gradient(150deg,rgba(22,36,59,.85),rgba(12,19,32,.6));padding:54px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.contact h2{font-family:var(--display);font-weight:500;color:var(--paper);font-size:clamp(1.8rem,3.5vw,2.6rem);line-height:1.08}
.contact .lead{color:var(--fog);margin-top:16px}
.ci{display:flex;gap:14px;align-items:center;margin-top:22px}
.ci svg{width:20px;height:20px;stroke:var(--signal);fill:none;stroke-width:1.6;flex:none}
.ci a,.ci span{color:var(--mist);font-size:1rem}
form{display:flex;flex-direction:column;gap:22px}
form > div{display:flex;flex-direction:column;gap:8px}
label{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fog);display:block}
input,textarea,select{font-family:var(--body);background:rgba(12,19,32,.7);border:1px solid var(--line);border-radius:10px;
  padding:13px 15px;color:var(--paper);font-size:.96rem;transition:border-color .2s;width:100%}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--signal)}
textarea{resize:vertical;min-height:110px}
.form-note{font-size:.8rem;color:var(--fog);margin-top:2px}
.sent{display:none;background:rgba(69,237,242,.1);border:1px solid rgba(69,237,242,.4);color:var(--signal);border-radius:10px;padding:13px;font-size:.92rem}

/* ---------- page hero (subpages) ---------- */
.page-hero{padding:74px 0 10px}
.page-hero h1{font-family:var(--display);font-weight:500;color:var(--paper);font-size:clamp(2.1rem,5vw,3.6rem);line-height:1.06;letter-spacing:-.02em;margin-top:18px;max-width:18ch}
.page-hero h1 em{font-style:normal;background:linear-gradient(90deg,#45edf2,#8a6cf0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.page-hero p{color:var(--fog);font-size:clamp(1.02rem,2vw,1.22rem);max-width:56ch;margin-top:20px}

/* ---------- coming soon / construction overlay ---------- */
.form-wip{position:relative}
/* dim + disable the form underneath */
.form-wip .wip-form{filter:blur(2px) grayscale(.3);opacity:.5;pointer-events:none;user-select:none}
/* hazard tape strips */
.wip-tape{position:absolute;left:-8%;width:116%;height:46px;z-index:5;
  background:repeating-linear-gradient(45deg,#e23b3b 0 22px,#f5f5f5 22px 44px);
  box-shadow:0 4px 18px rgba(0,0,0,.45);border-top:2px solid rgba(0,0,0,.25);border-bottom:2px solid rgba(0,0,0,.25)}
.wip-tape.t1{top:30%;transform:rotate(-7deg)}
.wip-tape.t2{top:62%;transform:rotate(5deg)}
/* center stamp */
.wip-stamp{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-5deg);z-index:6;
  background:rgba(12,19,32,.92);border:3px solid #e23b3b;border-radius:14px;padding:18px 30px;text-align:center;
  box-shadow:0 12px 40px rgba(0,0,0,.55)}
.wip-stamp .big{font-family:var(--display);font-weight:700;color:#fff;font-size:1.5rem;letter-spacing:.04em;line-height:1}
.wip-stamp .sub{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:#ff9b9b;margin-top:8px}
@media(max-width:560px){
  .wip-tape{height:38px}
  .wip-stamp{padding:14px 22px}
  .wip-stamp .big{font-size:1.2rem}
}
footer{border-top:1px solid var(--line);padding:48px 0 40px;margin-top:30px}
.foot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-start}
.foot p{color:var(--fog);font-size:.88rem;max-width:42ch;margin-top:14px}
.foot .mono{color:var(--fog)}
.foot a:hover{color:var(--paper)}
.legal{font-size:.8rem;color:var(--fog);margin-top:30px;padding-top:20px;border-top:1px solid var(--line)}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .cards,.steps,.team-grid{grid-template-columns:1fr}
  .split,.contact{grid-template-columns:1fr;gap:34px}
  .hero-grid{grid-template-columns:1fr;gap:30px}
  .hero-emblem{order:-1;margin-bottom:6px}
  .hero-emblem .glass{width:min(56%,240px);border-radius:26px}
  .bgrid{grid-template-columns:1fr 1fr}
  nav ul{display:none}
  .menu-btn{display:block}
  nav.open ul{display:flex;position:absolute;top:var(--header-h);left:0;right:0;flex-direction:column;background:var(--ink-2);
    padding:18px 28px;gap:18px;border-bottom:1px solid var(--line)}
  .contact{padding:34px 26px}
  .hero .stats{gap:28px}
}
@media(max-width:560px){
  .bgrid{grid-template-columns:1fr}
  .hero-logo{display:none}
}


/* ===== top-bar / nav overflow fix ===== */
nav ul{gap:16px;flex-wrap:nowrap}
nav ul li{flex:0 0 auto}
nav ul a{white-space:nowrap}
nav ul a:not(.btn):not(.btn-ticket){padding:8px 13px}

@media(max-width:1080px){
  nav ul{display:none}
  .menu-btn{display:block}
  nav.open ul{display:flex;position:absolute;top:var(--header-h);left:0;right:0;
    flex-direction:column;background:var(--ink-2);padding:18px 28px;gap:14px;
    border-bottom:1px solid var(--line);z-index:60}
}

/* form submit error message */
.form-error{margin-top:12px;padding:11px 14px;border-radius:10px;font-size:.9rem;
  color:#ffd9d9;background:rgba(226,59,59,.12);border:1px solid rgba(226,59,59,.4)}

/* assessment form: two-up field rows */
.frow{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.frow > div{display:flex;flex-direction:column;gap:8px}
@media(max-width:560px){ .frow{grid-template-columns:1fr} }