/* ==========================================================================
   Rovuwa Holdings — shared stylesheet
   ========================================================================== */

:root{
  --ink:#0A1222;
  --ink-soft:#132038;
  --brand-deep:#0F3A65;
  --brand:#1C6FAF;
  --brand-light:#57A9DE;
  --paper:#F3F5F8;
  --surface:rgba(255,255,255,.85);
  --text:#10151E;
  --text-dim:#535A6B;
  --on-ink:#E7EBF2;
  --on-ink-dim:#93A0B8;
  --line:#DFE3E9;
  --line-on-ink:#233252;
  --ok:#1B7A4B;
  --ok-bg:#E8F5EE;
  --warn:#9A5B00;
  --warn-bg:#FDF3E2;
  --err:#B3261E;
  --err-bg:#FCECEB;
  --radius:3px;
  --max:1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:var(--paper);color:var(--text);
  font-family:'Inter',system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
h1,h2,h3,h4,.display{font-family:'Sora',system-ui,sans-serif;font-weight:600;line-height:1.14;margin:0;letter-spacing:-0.01em;}
p{margin:0;}
a{color:inherit;text-decoration:none;}
img,svg{display:block;max-width:100%;}
ul{margin:0;padding:0;list-style:none;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 32px;}
@media (max-width:640px){.wrap{padding:0 20px;}}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--brand);outline-offset:3px;
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;}
}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--brand-deep);color:#fff;padding:12px 18px;z-index:200;}
.skip-link:focus{left:0;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ===== Header ===== */
header{position:sticky;top:0;z-index:50;background:rgba(243,245,248,0.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);}
.nav{display:flex;align-items:center;justify-content:space-between;padding:16px 0;gap:16px;}
.logo{display:flex;align-items:center;gap:12px;font-family:'Sora';font-weight:700;font-size:18px;color:var(--ink);flex:none;}
.logo img{width:38px;height:38px;border-radius:6px;object-fit:cover;}
.logo .word{line-height:1.15;}
.logo .word small{display:block;font-family:'Inter';font-weight:600;font-size:10.5px;letter-spacing:.14em;color:var(--text-dim);margin-top:1px;}
@media (max-width:420px){
  .logo{font-size:15px;gap:9px;}
  .logo img{width:32px;height:32px;}
  .logo .word small{font-size:9px;letter-spacing:.1em;}
}
.nav-links{display:flex;gap:28px;align-items:center;}
.nav-links a{font-size:14.5px;font-weight:500;color:var(--text-dim);transition:color .15s;}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--ink);}
.nav-cta{background:var(--brand-deep);color:#fff !important;padding:10px 20px;border-radius:var(--radius);font-size:14px;font-weight:500;border:1px solid var(--brand-deep);transition:background .15s;}
.nav-cta:hover{background:var(--brand);border-color:var(--brand);}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:6px;}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--ink);margin:5px 0;transition:transform .2s,opacity .2s;}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
@media (max-width:980px){
  .nav-links{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--surface);border-bottom:1px solid var(--line);max-height:0;overflow:hidden;transition:max-height .25s ease;box-shadow:0 14px 26px -18px rgba(0,0,0,.4);}
  .nav-links.open{max-height:520px;overflow-y:auto;}
  .nav-links a,.nav-links .nav-cta{width:100%;padding:16px 20px;border-top:1px solid var(--line);border-radius:0;}
  .nav-toggle{display:block;}
}

/* ===== Buttons ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 24px;border-radius:var(--radius);font-size:15px;font-weight:500;font-family:inherit;border:1px solid transparent;cursor:pointer;transition:background .15s,border-color .15s,color .15s;}
.btn:disabled{opacity:.55;cursor:not-allowed;}
.btn-primary{background:var(--brand-light);color:#04101F;}
.btn-primary:hover:not(:disabled){background:#79bce7;}
.btn-solid{background:var(--brand-deep);color:#fff;}
.btn-solid:hover:not(:disabled){background:var(--brand);}
.btn-ghost{border-color:var(--line-on-ink);color:var(--on-ink);}
.btn-ghost:hover{border-color:var(--on-ink-dim);}
.btn-outline{border-color:var(--line);color:var(--ink);background:var(--surface);}
.btn-outline:hover:not(:disabled){border-color:var(--brand);color:var(--brand);}

/* ===== Section shell ===== */
section{padding:84px 0;}
@media (max-width:640px){section{padding:58px 0;}}
.section-head{max-width:660px;margin-bottom:50px;}
.section-head .eyebrow{color:var(--brand);}
.section-head h2{font-size:clamp(25px,2.8vw,34px);color:var(--ink);}
.section-head p{margin-top:14px;color:var(--text-dim);font-size:16.5px;}
.eyebrow{font-size:13.5px;color:var(--brand-light);font-weight:600;letter-spacing:.02em;margin-bottom:18px;}

/* ===== Hero ===== */
.hero{background:linear-gradient(180deg,var(--ink) 0%,var(--ink-soft) 100%);color:var(--on-ink);padding:88px 0 76px;position:relative;overflow:hidden;}
.hero .wrap{display:grid;grid-template-columns:1.05fr 0.95fr;gap:56px;align-items:center;}
@media (max-width:920px){.hero .wrap{grid-template-columns:1fr;gap:48px;}}
@media (max-width:640px){.hero{padding:56px 0 68px;}}
.hero h1{font-size:clamp(30px,4.2vw,50px);color:#fff;}
.hero h1 em{font-style:normal;color:var(--brand-light);}
.hero p.lede{margin-top:22px;max-width:48ch;font-size:17.5px;color:var(--on-ink-dim);}
@media (max-width:640px){.hero p.lede{font-size:16px;}}
.hero-actions{display:flex;gap:16px;margin-top:32px;flex-wrap:wrap;}
@media (max-width:420px){.hero-actions .btn{width:100%;}}
.hero-facts{display:flex;gap:32px;margin-top:48px;flex-wrap:wrap;}
.hero-facts div{border-left:2px solid var(--line-on-ink);padding-left:14px;max-width:180px;}
.hero-facts strong{display:block;font-family:'Sora';font-size:22px;color:#fff;}
.hero-facts span{font-size:13px;color:var(--on-ink-dim);}
.hero-media{position:relative;}
.hero-frame{border:1px solid var(--line-on-ink);padding:10px;background:rgba(255,255,255,0.03);}
.hero-frame img{width:100%;height:340px;object-fit:cover;}
@media (max-width:640px){.hero-frame img{height:230px;}}
.hero-tag{position:absolute;left:24px;bottom:-18px;background:var(--surface);color:var(--ink);padding:14px 18px;border:1px solid var(--line);font-size:13px;max-width:230px;box-shadow:0 12px 24px -12px rgba(0,0,0,.35);}
.hero-tag strong{display:block;font-family:'Sora';font-size:14px;margin-bottom:3px;}
@media (max-width:640px){.hero-tag{position:static;max-width:none;margin-top:14px;}}

/* ===== Page banner (inner pages) ===== */
.page-banner{background:linear-gradient(180deg,var(--ink) 0%,var(--ink-soft) 100%);color:var(--on-ink);padding:66px 0 58px;}
.page-banner h1{color:#fff;font-size:clamp(27px,3.6vw,42px);max-width:22ch;}
.page-banner p{margin-top:18px;color:var(--on-ink-dim);max-width:62ch;font-size:16.5px;}
.crumb{font-size:13px;color:var(--on-ink-dim);margin-bottom:16px;}
.crumb a:hover{color:#fff;}
.banner-meta{display:flex;gap:26px;flex-wrap:wrap;margin-top:28px;font-size:13px;color:var(--on-ink-dim);}
.banner-meta strong{color:#fff;font-weight:500;}

/* ===== Partner strip ===== */
.partners{background:var(--surface);border-bottom:1px solid var(--line);padding:28px 0;}
.partners .wrap{display:flex;align-items:center;gap:22px;flex-wrap:wrap;justify-content:space-between;}
.partners .label{font-size:12.5px;color:var(--text-dim);font-weight:600;letter-spacing:.03em;flex:none;}
.partner-logos{display:flex;gap:34px;flex-wrap:wrap;align-items:center;}
@media (max-width:640px){.partner-logos{gap:22px;justify-content:space-between;width:100%;}}
.partner-logos img{height:30px;width:auto;max-width:120px;object-fit:contain;}
.partner-logos img.tall{height:40px;}
.partner-logos img.round{height:42px;width:42px;border-radius:6px;}

/* ===== About ===== */
.about{background:var(--surface);border-bottom:1px solid var(--line);}
.about .wrap{display:grid;grid-template-columns:0.9fr 1.1fr;gap:64px;align-items:start;}
@media (max-width:900px){.about .wrap{grid-template-columns:1fr;gap:34px;}}
.about-copy p{color:var(--text-dim);font-size:16px;margin-top:16px;max-width:56ch;}
.about-copy p:first-child{margin-top:0;}
.about-stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:30px;}
@media (max-width:400px){.about-stats{grid-template-columns:1fr;}}
.about-stats div{background:var(--surface);padding:26px 22px;}
.about-stats strong{display:block;font-family:'Sora';font-size:26px;color:var(--brand-deep);}
.about-stats span{font-size:13.5px;color:var(--text-dim);margin-top:4px;display:block;}

/* ===== Services ===== */
.services{background:var(--paper);}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);background:var(--surface);}
@media (max-width:900px){.service-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.service-grid{grid-template-columns:1fr;}}
.service{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:32px 28px;}
.service svg{width:28px;height:28px;margin-bottom:20px;stroke:var(--brand);}
.service h3{font-size:17.5px;color:var(--ink);margin-bottom:9px;}
.service p{font-size:14.5px;color:var(--text-dim);}

/* ===== Process ===== */
.process-list{counter-reset:step;margin-top:8px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);}
@media (max-width:820px){.process-list{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.process-list{grid-template-columns:1fr;}}
.step{padding:26px 26px 26px 0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);}
.step:last-child{border-right:none;}
.step::before{counter-increment:step;content:counter(step,decimal-leading-zero);font-family:'Sora';font-size:14px;color:var(--brand);display:block;margin-bottom:14px;}
.step h3{font-size:16.5px;color:var(--ink);margin-bottom:8px;}
.step p{color:var(--text-dim);font-size:14px;}

/* ===== Sectors ===== */
.sectors{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.chip-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px;}
.chip{border:1px solid var(--line);padding:10px 18px;font-size:14px;color:var(--ink);border-radius:999px;background:var(--paper);}

/* ===== Gallery + lightbox ===== */
.gallery-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px;}
.gallery-filter{border:1px solid var(--line);background:var(--surface);color:var(--text-dim);padding:9px 17px;border-radius:999px;font-family:inherit;font-size:13.5px;cursor:pointer;transition:border-color .15s,color .15s,background .15s;}
.gallery-filter:hover{border-color:var(--brand);color:var(--brand);}
.gallery-filter[aria-pressed="true"]{background:var(--brand-deep);border-color:var(--brand-deep);color:#fff;}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;margin-top:8px;}
@media (max-width:520px){.gallery-grid{grid-template-columns:repeat(2,1fr);gap:10px;}}
.gallery-item{position:relative;aspect-ratio:1/1;overflow:hidden;border:1px solid var(--line);background:var(--ink);padding:0;cursor:zoom-in;display:block;width:100%;font-family:inherit;}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;}
.gallery-item:hover img,.gallery-item:focus-visible img{transform:scale(1.07);}
.gallery-item figcaption{position:absolute;inset:auto 0 0 0;background:linear-gradient(180deg,rgba(10,18,34,0) 0%,rgba(10,18,34,.88) 70%);color:#fff;font-size:12.5px;text-align:left;padding:26px 12px 11px;line-height:1.35;opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s;}
.gallery-item:hover figcaption,.gallery-item:focus-visible figcaption{opacity:1;transform:translateY(0);}
@media (hover:none){.gallery-item figcaption{opacity:1;transform:none;}}
.gallery-item.is-hidden{display:none;}
.gallery-cap{margin-top:18px;font-size:13.5px;color:var(--text-dim);}

.lightbox{position:fixed;inset:0;z-index:120;background:rgba(6,11,20,.93);display:none;align-items:center;justify-content:center;padding:28px;}
.lightbox.open{display:flex;}
.lightbox-figure{max-width:1000px;width:100%;margin:0;}
.lightbox-figure img{width:100%;max-height:74vh;object-fit:contain;margin:0 auto;}
.lightbox-figure figcaption{color:var(--on-ink-dim);font-size:14px;text-align:center;margin-top:18px;}
.lightbox-figure figcaption strong{display:block;color:#fff;font-family:'Sora';font-size:16px;margin-bottom:4px;font-weight:600;}
.lightbox-count{display:block;margin-top:8px;font-size:12.5px;color:var(--on-ink-dim);}
.lb-btn{position:absolute;background:rgba(255,255,255,.08);border:1px solid var(--line-on-ink);color:#fff;width:46px;height:46px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1;transition:background .15s;}
.lb-btn:hover{background:rgba(255,255,255,.2);}
.lb-close{top:20px;right:20px;}
.lb-prev{left:20px;top:50%;transform:translateY(-50%);}
.lb-next{right:20px;top:50%;transform:translateY(-50%);}
@media (max-width:640px){
  .lightbox{padding:16px;}
  .lb-prev{left:10px;}.lb-next{right:10px;}
  .lb-btn{width:40px;height:40px;}
  .lightbox-figure img{max-height:60vh;}
}

/* ===== Dark band ===== */
.band{background:var(--ink);color:var(--on-ink);}
.band .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;}
@media (max-width:860px){.band .wrap{grid-template-columns:1fr;gap:44px;}}
.band h2{color:#fff;font-size:clamp(23px,2.6vw,30px);}
.band-copy p{color:var(--on-ink-dim);margin-top:16px;max-width:52ch;font-size:15.5px;}
.cert-list{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;margin-top:26px;}
@media (max-width:560px){.cert-list{grid-template-columns:1fr;}}
.cert-list li{font-size:14px;color:var(--on-ink-dim);padding:10px 0;border-top:1px solid var(--line-on-ink);}
.cert-list li strong{color:#fff;font-weight:500;}

/* ===== Contact ===== */
.cta{background:var(--paper);}
.cta-box{background:var(--surface);border:1px solid var(--line);padding:54px;display:grid;grid-template-columns:1fr 1fr;gap:48px;}
@media (max-width:900px){.cta-box{grid-template-columns:1fr;padding:34px 26px;gap:38px;}}
@media (max-width:480px){.cta-box{padding:26px 18px;}}
.cta-box h2{font-size:clamp(23px,2.6vw,30px);color:var(--ink);max-width:18ch;}
.cta-box .info > p{margin-top:14px;color:var(--text-dim);font-size:15.5px;}
.contact-list{margin-top:26px;display:flex;flex-direction:column;}
.contact-list div{padding:12px 0;border-top:1px solid var(--line);}
.contact-list div:last-child{border-bottom:1px solid var(--line);}
.contact-list span{display:block;font-size:12px;color:var(--text-dim);margin-bottom:3px;}
.contact-list a,.contact-list p{font-size:14.5px;color:var(--ink);word-break:break-word;}
.contact-list a:hover{color:var(--brand);}
.map-frame{margin-top:22px;border:1px solid var(--line);height:200px;overflow:hidden;background:var(--paper);}
.map-frame iframe{width:100%;height:100%;border:0;}

/* ===== Forms ===== */
form{display:flex;flex-direction:column;gap:18px;}
.field{display:flex;flex-direction:column;}
label,.field-label{font-size:13.5px;color:var(--ink);margin-bottom:7px;display:block;font-weight:500;}
.field-hint{font-size:12.5px;color:var(--text-dim);margin:-2px 0 8px;line-height:1.5;}
.req{color:var(--err);margin-left:2px;}
.optional{color:var(--text-dim);font-weight:400;font-size:12.5px;margin-left:5px;}
input[type=text],input[type=email],input[type=tel],input[type=url],input[type=number],
input[type=date],input[type=month],input[type=password],select,textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line);background:var(--paper);
  font-family:inherit;font-size:15px;color:var(--text);border-radius:var(--radius);
  transition:border-color .15s,background .15s;-webkit-appearance:none;appearance:none;
}
select{background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23535A6B' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:17px;padding-right:38px;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand);background:var(--surface);}
textarea{resize:vertical;min-height:110px;line-height:1.6;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-row-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
@media (max-width:620px){.form-row,.form-row-3{grid-template-columns:1fr;}}
.submit-btn{background:var(--brand-deep);color:#fff;border:none;padding:14px 26px;border-radius:var(--radius);font-family:inherit;font-size:15px;font-weight:500;cursor:pointer;align-self:flex-start;transition:background .15s;}
.submit-btn:hover:not(:disabled){background:var(--brand);}
.submit-btn:disabled{opacity:.6;cursor:not-allowed;}
@media (max-width:480px){.submit-btn{align-self:stretch;width:100%;}}
.form-note{font-size:12.5px;color:var(--text-dim);line-height:1.6;}
.form-note a{color:var(--brand);text-decoration:underline;}

/* validation states */
.field.invalid input,.field.invalid select,.field.invalid textarea,
.field.invalid .choice-grid,.field.invalid .dropzone{border-color:var(--err);}
.field.valid input,.field.valid select,.field.valid textarea{border-color:#9FC9AF;}
.field-error{display:none;font-size:12.5px;color:var(--err);margin-top:6px;align-items:flex-start;gap:6px;}
.field.invalid .field-error{display:flex;}
.field-error svg{width:14px;height:14px;flex:none;margin-top:3px;stroke:var(--err);}

/* honeypot */
.hp-field{position:absolute !important;left:-9999px !important;width:1px;height:1px;overflow:hidden;}

/* choices */
.choice-grid{display:grid;gap:10px;}
.choice-grid.cols-2{grid-template-columns:1fr 1fr;}
.choice-grid.cols-3{grid-template-columns:repeat(3,1fr);}
@media (max-width:620px){.choice-grid.cols-2,.choice-grid.cols-3{grid-template-columns:1fr;}}
.choice{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);background:var(--paper);padding:14px 16px;border-radius:var(--radius);cursor:pointer;transition:border-color .15s,background .15s;font-size:14.5px;}
.choice:hover{border-color:var(--brand-light);background:var(--surface);}
.choice input{margin:3px 0 0;flex:none;width:17px;height:17px;accent-color:var(--brand-deep);cursor:pointer;}
.choice:has(input:checked){border-color:var(--brand-deep);background:var(--surface);box-shadow:inset 0 0 0 1px var(--brand-deep);}
.choice .c-title{display:block;color:var(--ink);font-weight:500;}
.choice .c-sub{display:block;font-size:12.5px;color:var(--text-dim);margin-top:2px;line-height:1.5;}
.consent-box{border:1px solid var(--line);background:var(--paper);padding:20px;border-radius:var(--radius);}
.consent-box .choice{background:var(--surface);}
.consent-box + .consent-box{margin-top:12px;}

/* file upload */
.dropzone{border:1.5px dashed var(--line);background:var(--paper);border-radius:var(--radius);padding:28px 20px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;}
.dropzone:hover,.dropzone.dragover{border-color:var(--brand);background:#EDF4FA;}
.dropzone svg{width:28px;height:28px;margin:0 auto 12px;stroke:var(--brand);fill:none;stroke-width:1.5;}
.dropzone strong{display:block;font-size:14.5px;color:var(--ink);font-weight:500;}
.dropzone span{display:block;font-size:12.5px;color:var(--text-dim);margin-top:5px;}
.file-list{margin-top:12px;display:flex;flex-direction:column;gap:8px;}
.file-item{display:flex;align-items:center;gap:12px;border:1px solid var(--line);background:var(--surface);padding:11px 14px;border-radius:var(--radius);font-size:13.5px;}
.file-item .fi-icon{width:30px;height:30px;flex:none;border-radius:4px;background:var(--brand-deep);color:#fff;display:flex;align-items:center;justify-content:center;font-size:9.5px;font-weight:600;letter-spacing:.02em;}
.file-item .fi-meta{flex:1;min-width:0;}
.file-item .fi-name{display:block;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.file-item .fi-size{display:block;font-size:12px;color:var(--text-dim);}
.file-item.error{border-color:var(--err);background:var(--err-bg);}
.file-item.error .fi-icon{background:var(--err);}
.file-remove{background:none;border:none;cursor:pointer;color:var(--text-dim);font-size:20px;line-height:1;padding:2px 6px;border-radius:3px;}
.file-remove:hover{color:var(--err);background:var(--err-bg);}

/* ===== Multi-step application form ===== */
.app-layout{display:grid;grid-template-columns:270px 1fr;gap:48px;align-items:start;}
@media (max-width:940px){.app-layout{grid-template-columns:1fr;gap:28px;}}
.app-rail{position:sticky;top:104px;}
@media (max-width:940px){.app-rail{position:static;}}
.progress-track{height:4px;background:var(--line);border-radius:99px;overflow:hidden;margin-bottom:22px;}
.progress-bar{height:100%;width:0;background:var(--brand);transition:width .35s ease;}
.step-nav{display:flex;flex-direction:column;}
@media (max-width:940px){.step-nav{flex-direction:row;overflow-x:auto;gap:8px;padding-bottom:6px;-webkit-overflow-scrolling:touch;scrollbar-width:thin;}}
.step-nav li{display:flex;gap:13px;align-items:flex-start;padding:11px 0;color:var(--text-dim);font-size:14px;}
@media (max-width:940px){
  .step-nav li{flex:none;padding:9px 14px;border:1px solid var(--line);background:var(--surface);border-radius:999px;font-size:13px;white-space:nowrap;align-items:center;}
  .step-nav li .s-sub{display:none;}
}
.step-nav .s-dot{width:24px;height:24px;flex:none;border-radius:50%;border:1px solid var(--line);background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--text-dim);font-family:'Sora';}
.step-nav li[data-state="active"]{color:var(--ink);}
.step-nav li[data-state="active"] .s-dot{background:var(--brand-deep);border-color:var(--brand-deep);color:#fff;}
.step-nav li[data-state="active"] .s-title{font-weight:600;}
.step-nav li[data-state="done"] .s-dot{background:var(--ok-bg);border-color:var(--ok);color:var(--ok);}
.step-nav li[data-state="done"]{color:var(--ink);}
.s-title{display:block;line-height:1.35;}
.s-sub{display:block;font-size:12px;color:var(--text-dim);margin-top:2px;}
@media (max-width:940px){.step-nav li[data-state="active"]{border-color:var(--brand-deep);box-shadow:inset 0 0 0 1px var(--brand-deep);}}

.app-card{background:var(--surface);border:1px solid var(--line);padding:38px 40px;}
@media (max-width:640px){.app-card{padding:26px 20px;}}
@media (max-width:380px){.app-card{padding:22px 16px;}}
.app-step{display:none;}
.app-step.active{display:block;animation:stepIn .25s ease;}
@keyframes stepIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.step-head{border-bottom:1px solid var(--line);padding-bottom:20px;margin-bottom:28px;}
.step-head h2{font-size:22px;color:var(--ink);}
.step-head p{font-size:14.5px;color:var(--text-dim);margin-top:8px;max-width:58ch;}
.step-index{font-size:12.5px;color:var(--brand);font-weight:600;margin-bottom:9px;}
.app-actions{display:flex;gap:12px;justify-content:space-between;align-items:center;margin-top:34px;padding-top:24px;border-top:1px solid var(--line);flex-wrap:wrap;}
.app-actions .right{display:flex;gap:12px;margin-left:auto;}
@media (max-width:480px){
  .app-actions{flex-direction:column-reverse;align-items:stretch;}
  .app-actions .right{margin-left:0;flex-direction:column;}
  .app-actions .btn{width:100%;}
}
.cond{display:none;}
.cond.show{display:block;animation:stepIn .2s ease;}
fieldset{border:none;margin:0;padding:0;}
legend{padding:0;}
.group{border-top:1px solid var(--line);margin-top:26px;padding-top:24px;}
.group:first-of-type{border-top:none;margin-top:0;padding-top:0;}
.group-title{font-family:'Sora';font-size:15.5px;color:var(--ink);font-weight:600;margin-bottom:4px;}
.group-sub{font-size:13px;color:var(--text-dim);margin-bottom:18px;}
.stack{display:flex;flex-direction:column;gap:18px;}

/* repeatable rows */
.repeat-item{border:1px solid var(--line);background:var(--paper);padding:20px;border-radius:var(--radius);margin-bottom:14px;position:relative;}
.repeat-item .repeat-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;}
.repeat-item .repeat-head h4{font-size:14px;color:var(--ink);}
.link-btn{background:none;border:none;color:var(--brand);font-family:inherit;font-size:13.5px;cursor:pointer;padding:4px 6px;border-radius:3px;text-decoration:underline;}
.link-btn:hover{color:var(--brand-deep);}
.link-btn.danger{color:var(--err);}

/* review */
.review-block{border:1px solid var(--line);margin-bottom:14px;}
.review-block h3{font-size:14.5px;color:var(--ink);padding:14px 18px;background:var(--paper);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px;}
.review-dl{display:grid;grid-template-columns:200px 1fr;}
@media (max-width:620px){.review-dl{grid-template-columns:1fr;}}
.review-dl dt{padding:11px 18px;font-size:13px;color:var(--text-dim);border-bottom:1px solid var(--line);}
.review-dl dd{padding:11px 18px;margin:0;font-size:14px;color:var(--ink);border-bottom:1px solid var(--line);word-break:break-word;}
@media (max-width:620px){
  .review-dl dt{border-bottom:none;padding-bottom:2px;}
  .review-dl dd{padding-top:0;}
}
.review-dl div:last-child dt,.review-dl div:last-child dd{border-bottom:none;}

/* alerts */
.alert{display:flex;gap:12px;padding:15px 18px;border-radius:var(--radius);font-size:14px;line-height:1.55;border:1px solid transparent;}
.alert svg{width:18px;height:18px;flex:none;margin-top:2px;fill:none;stroke-width:1.8;}
.alert-info{background:#EDF4FA;border-color:#C8DDEE;color:#14415F;}
.alert-info svg{stroke:var(--brand);}
.alert-ok{background:var(--ok-bg);border-color:#BFE0CD;color:#145635;}
.alert-ok svg{stroke:var(--ok);}
.alert-warn{background:var(--warn-bg);border-color:#EFD6A8;color:#6F4200;}
.alert-warn svg{stroke:var(--warn);}
.alert-err{background:var(--err-bg);border-color:#F0C4C1;color:#8C1D18;}
.alert-err svg{stroke:var(--err);}
.alert a{text-decoration:underline;}
.alert strong{display:block;margin-bottom:3px;font-weight:600;}

/* toast */
.toast-stack{position:fixed;right:20px;bottom:20px;z-index:150;display:flex;flex-direction:column;gap:10px;max-width:360px;}
@media (max-width:560px){.toast-stack{left:16px;right:16px;bottom:16px;max-width:none;}}
.toast{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--brand);padding:14px 16px;border-radius:var(--radius);box-shadow:0 14px 32px -14px rgba(0,0,0,.45);font-size:14px;display:flex;gap:11px;align-items:flex-start;animation:toastIn .25s ease;}
.toast.ok{border-left-color:var(--ok);}
.toast.err{border-left-color:var(--err);}
.toast strong{display:block;font-size:14px;color:var(--ink);margin-bottom:2px;}
.toast p{font-size:13px;color:var(--text-dim);}
.toast button{background:none;border:none;cursor:pointer;color:var(--text-dim);font-size:17px;line-height:1;padding:0 2px;}
@keyframes toastIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}

/* success panel */
.success-panel{text-align:center;padding:40px 20px;}
.success-panel .tick{width:62px;height:62px;border-radius:50%;background:var(--ok-bg);border:1px solid #BFE0CD;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;}
.success-panel .tick svg{width:28px;height:28px;stroke:var(--ok);stroke-width:2.2;fill:none;}
.success-panel h2{font-size:24px;color:var(--ink);margin-bottom:12px;}
.success-panel p{color:var(--text-dim);max-width:48ch;margin:0 auto;font-size:15.5px;}
.ref-code{display:inline-block;margin-top:22px;font-family:'Sora';font-size:19px;letter-spacing:.06em;color:var(--brand-deep);background:var(--paper);border:1px solid var(--line);padding:12px 22px;border-radius:var(--radius);}
.ref-label{display:block;font-family:'Inter';font-size:11.5px;letter-spacing:.1em;color:var(--text-dim);margin-bottom:4px;font-weight:600;}
.success-actions{display:flex;gap:12px;justify-content:center;margin-top:30px;flex-wrap:wrap;}

/* ===== Legal / long-form pages ===== */
.legal-layout{display:grid;grid-template-columns:262px 1fr;gap:56px;align-items:start;}
@media (max-width:940px){.legal-layout{grid-template-columns:1fr;gap:30px;}}
.legal-toc{position:sticky;top:104px;border:1px solid var(--line);background:var(--surface);padding:22px;}
@media (max-width:940px){.legal-toc{position:static;}}
.legal-toc h2{font-size:13px;letter-spacing:.05em;color:var(--text-dim);font-family:'Inter';font-weight:600;margin-bottom:14px;}
.legal-toc a{display:block;font-size:13.5px;color:var(--text-dim);padding:7px 0;border-top:1px solid var(--line);line-height:1.45;}
.legal-toc a:first-of-type{border-top:none;}
.legal-toc a:hover,.legal-toc a.active{color:var(--brand);}
.legal-body{background:var(--surface);border:1px solid var(--line);padding:46px 52px;}
@media (max-width:640px){.legal-body{padding:28px 20px;}}
.legal-body h2{font-size:21px;color:var(--ink);margin:44px 0 14px;scroll-margin-top:100px;}
.legal-body h2:first-child{margin-top:0;}
.legal-body h3{font-size:16.5px;color:var(--ink);margin:26px 0 10px;}
.legal-body p{color:var(--text-dim);margin-bottom:14px;max-width:72ch;font-size:15.5px;}
.legal-body ul.bullets{margin:0 0 18px;padding-left:0;}
.legal-body ul.bullets li{position:relative;padding-left:20px;color:var(--text-dim);margin-bottom:9px;font-size:15.5px;max-width:70ch;}
.legal-body ul.bullets li::before{content:"";position:absolute;left:2px;top:10px;width:6px;height:6px;background:var(--brand-light);border-radius:50%;}
.legal-body ol.numbered{margin:0 0 18px;padding-left:22px;color:var(--text-dim);}
.legal-body ol.numbered li{margin-bottom:9px;font-size:15.5px;max-width:70ch;}
.legal-body strong{color:var(--ink);font-weight:600;}
.legal-body a{color:var(--brand);text-decoration:underline;}
.legal-body .callout{border-left:3px solid var(--brand);background:var(--paper);padding:18px 22px;margin:22px 0;}
.legal-body .callout p{margin-bottom:0;font-size:15px;}
.legal-body .callout p + p{margin-top:10px;}
.table-scroll{overflow-x:auto;margin:20px 0 26px;border:1px solid var(--line);}
table.data{width:100%;border-collapse:collapse;font-size:14px;min-width:560px;}
table.data th,table.data td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line);vertical-align:top;}
table.data th{background:var(--paper);color:var(--ink);font-weight:600;font-size:13px;}
table.data td{color:var(--text-dim);}
table.data tr:last-child td{border-bottom:none;}
.updated-note{font-size:13px;color:var(--text-dim);border-top:1px solid var(--line);margin-top:40px;padding-top:20px;}

/* ===== Cookie banner ===== */
.cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:130;background:var(--ink);color:var(--on-ink);border-top:1px solid var(--line-on-ink);transform:translateY(110%);transition:transform .35s ease;box-shadow:0 -14px 40px -22px rgba(0,0,0,.8);}
.cookie-banner.show{transform:translateY(0);}
.cookie-inner{max-width:var(--max);margin:0 auto;padding:24px 32px;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;}
@media (max-width:860px){.cookie-inner{grid-template-columns:1fr;gap:18px;padding:20px;}}
.cookie-inner h3{color:#fff;font-size:16.5px;margin-bottom:7px;}
.cookie-inner p{font-size:13.5px;color:var(--on-ink-dim);max-width:70ch;}
.cookie-inner p a{color:var(--brand-light);text-decoration:underline;}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;}
@media (max-width:480px){.cookie-actions{flex-direction:column;}.cookie-actions .btn{width:100%;}}
.cookie-actions .btn{padding:11px 20px;font-size:14px;}
.cookie-prefs{border-top:1px solid var(--line-on-ink);padding:22px 32px;max-width:var(--max);margin:0 auto;display:none;}
.cookie-prefs.show{display:block;}
@media (max-width:860px){.cookie-prefs{padding:20px;}}
.pref-row{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--line-on-ink);align-items:flex-start;}
.pref-row:last-of-type{border-bottom:none;}
.pref-row h4{color:#fff;font-size:14.5px;margin-bottom:4px;}
.pref-row p{font-size:13px;color:var(--on-ink-dim);max-width:64ch;}
.switch{position:relative;flex:none;width:44px;height:24px;}
.switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:2;}
.switch .track{position:absolute;inset:0;background:var(--line-on-ink);border-radius:99px;transition:background .18s;}
.switch .track::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;background:#fff;border-radius:50%;transition:transform .18s;}
.switch input:checked + .track{background:var(--brand);}
.switch input:checked + .track::after{transform:translateX(20px);}
.switch input:disabled + .track{opacity:.5;}
.switch input:focus-visible + .track{outline:2px solid var(--brand-light);outline-offset:2px;}

/* ===== Footer ===== */
footer{background:var(--ink);color:var(--on-ink-dim);padding:54px 0 34px;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding-bottom:34px;border-bottom:1px solid var(--line-on-ink);}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr;gap:32px;}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr;gap:26px;}}
.footer-grid h4{color:#fff;font-size:13px;font-family:'Inter';font-weight:600;letter-spacing:.05em;margin-bottom:14px;}
.footer-grid a{display:block;font-size:13.5px;padding:5px 0;transition:color .15s;}
.footer-grid a:hover{color:#fff;}
.footer-brand p{font-size:13.5px;max-width:38ch;margin-top:14px;}
.footer-brand .logo{color:#fff;}
.footer-brand .logo .word small{color:var(--on-ink-dim);}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;font-size:13px;padding-top:24px;}
.footer-bottom .footer-links{display:flex;gap:20px;flex-wrap:wrap;}
.footer-bottom a:hover{color:#fff;}


/* ==========================================================================
   CORPORATE SOC BACKGROUND — Rovuwa Holdings
   Subtle animated Security Operations Centre visual layer.
   ========================================================================== */
body{position:relative;isolation:isolate;}
body > *:not(.soc-background){position:relative;z-index:3;}
.soc-background{
  position:fixed!important;inset:0;z-index:0!important;pointer-events:none;
  overflow:hidden;opacity:.115;color:#1C6FAF;
  background:
    radial-gradient(circle at 12% 22%,rgba(28,111,175,.18),transparent 26%),
    radial-gradient(circle at 88% 72%,rgba(10,18,34,.14),transparent 30%);
}
.soc-grid{
  position:absolute;inset:-25%;
  background-image:
    linear-gradient(rgba(28,111,175,.20) 1px,transparent 1px),
    linear-gradient(90deg,rgba(28,111,175,.20) 1px,transparent 1px);
  background-size:54px 54px;
  transform:perspective(700px) rotateX(60deg) translateY(8%);
  transform-origin:center bottom;
  animation:socGridMove 18s linear infinite;
}
.soc-radar{
  position:absolute;width:min(420px,42vw);height:min(420px,42vw);
  right:-3vw;top:14vh;border:1px solid rgba(28,111,175,.24);border-radius:50%;
}
.radar-ring{position:absolute;inset:17%;border:1px solid rgba(28,111,175,.22);border-radius:50%}
.ring-2{inset:34%}.ring-3{inset:50%}
.radar-sweep{
  position:absolute;left:50%;top:50%;width:50%;height:1px;
  transform-origin:left center;
  background:linear-gradient(90deg,rgba(28,111,175,.65),transparent);
  box-shadow:0 0 16px rgba(28,111,175,.35);
  animation:radarSweep 5s linear infinite;
}
.soc-radar:before,.soc-radar:after{
  content:"";position:absolute;background:rgba(28,111,175,.16);
}
.soc-radar:before{left:50%;top:0;bottom:0;width:1px}
.soc-radar:after{top:50%;left:0;right:0;height:1px}
.radar-node,.node{
  position:absolute;width:7px;height:7px;border-radius:50%;
  background:#1C6FAF;box-shadow:0 0 14px rgba(28,111,175,.65);
  animation:socPulse 2.4s ease-in-out infinite;
}
.radar-node.n1{left:24%;top:34%}.radar-node.n2{left:69%;top:25%;animation-delay:.6s}
.radar-node.n3{left:57%;top:67%;animation-delay:1.1s}.radar-node.n4{left:30%;top:72%;animation-delay:1.7s}

.soc-network{position:absolute;inset:0;opacity:.8}
.soc-network .node.a{left:18%;top:25%}.soc-network .node.b{left:34%;top:43%;animation-delay:.5s}
.soc-network .node.c{left:67%;top:28%;animation-delay:1s}.soc-network .node.d{left:78%;top:63%;animation-delay:1.5s}
.soc-network .node.e{left:52%;top:78%;animation-delay:2s}
.soc-network .link{
  position:absolute;height:1px;background:linear-gradient(90deg,transparent,rgba(28,111,175,.32),transparent);
  transform-origin:left center;animation:networkFlow 4s ease-in-out infinite;
}
.soc-network .l1{left:18%;top:25%;width:19%;transform:rotate(31deg)}
.soc-network .l2{left:34%;top:43%;width:35%;transform:rotate(-25deg);animation-delay:.7s}
.soc-network .l3{left:67%;top:28%;width:36%;transform:rotate(42deg);animation-delay:1.2s}
.soc-network .l4{left:78%;top:63%;width:29%;transform:rotate(160deg);animation-delay:1.8s}

.soc-panel{
  position:absolute;padding:14px 16px;min-width:250px;
  border:1px solid rgba(28,111,175,.22);background:rgba(255,255,255,.30);
  backdrop-filter:blur(2px);font:600 9px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.08em;color:rgba(10,18,34,.62);
  box-shadow:0 12px 35px rgba(10,18,34,.06);
}
.soc-panel-left{left:4vw;top:26vh}.soc-panel-right{right:4vw;bottom:22vh;min-width:285px}
.soc-panel-title{font-size:10px;letter-spacing:.16em;margin-bottom:9px;color:rgba(15,58,101,.72)}
.soc-status{margin-bottom:10px}.soc-status b{
  display:inline-block;width:6px;height:6px;border-radius:50%;background:#1B7A4B;
  margin-right:6px;box-shadow:0 0 8px rgba(27,122,75,.55);animation:socPulse 1.7s infinite;
}
.soc-bars{height:34px;display:flex;align-items:end;gap:5px}
.soc-bars i{display:block;width:12px;background:rgba(28,111,175,.42);height:35%;animation:barRise 1.8s ease-in-out infinite}
.soc-bars i:nth-child(2){height:72%;animation-delay:.15s}.soc-bars i:nth-child(3){height:48%;animation-delay:.3s}
.soc-bars i:nth-child(4){height:88%;animation-delay:.45s}.soc-bars i:nth-child(5){height:55%;animation-delay:.6s}
.soc-bars i:nth-child(6){height:76%;animation-delay:.75s}.soc-bars i:nth-child(7){height:42%;animation-delay:.9s}
.soc-log{white-space:nowrap;animation:logFlicker 3.5s ease-in-out infinite}.soc-log:nth-child(3){animation-delay:.5s}
.soc-log:nth-child(4){animation-delay:1s}.soc-log:nth-child(5){animation-delay:1.5s}
.soc-scanline{
  position:absolute;left:0;right:0;top:-5%;height:2px;
  background:linear-gradient(90deg,transparent,rgba(28,111,175,.38),transparent);
  box-shadow:0 0 18px rgba(28,111,175,.22);animation:scanDown 9s linear infinite;
}
.soc-watermark{
  position:absolute;left:50%;bottom:5vh;transform:translateX(-50%);
  font:700 clamp(11px,1vw,14px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.38em;white-space:nowrap;color:rgba(15,58,101,.24);
  animation:watermarkDrift 12s ease-in-out infinite;
}

@keyframes socGridMove{from{transform:perspective(700px) rotateX(60deg) translateY(8%)}to{transform:perspective(700px) rotateX(60deg) translateY(16%)}}
@keyframes radarSweep{to{transform:rotate(360deg)}}
@keyframes socPulse{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.35)}}
@keyframes networkFlow{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes barRise{0%,100%{transform:scaleY(.65);transform-origin:bottom}50%{transform:scaleY(1.2);transform-origin:bottom}}
@keyframes logFlicker{0%,100%{opacity:.45}50%{opacity:.9}}
@keyframes scanDown{0%{top:-5%}100%{top:105%}}
@keyframes watermarkDrift{0%,100%{letter-spacing:.38em;opacity:.55}50%{letter-spacing:.48em;opacity:.9}}

@media (max-width:900px){
  .soc-panel{transform:scale(.82);transform-origin:top left}
  .soc-panel-right{transform-origin:bottom right}
  .soc-radar{width:300px;height:300px;right:-80px;top:20vh}
  .soc-watermark{letter-spacing:.18em}
}
@media (max-width:640px){
  .soc-background{opacity:.075}
  .soc-panel{display:none}
  .soc-radar{width:260px;height:260px;right:-90px;top:18vh}
  .soc-watermark{font-size:9px;letter-spacing:.12em;bottom:3vh}
}
@media (prefers-reduced-motion:reduce){
  .soc-grid,.radar-sweep,.radar-node,.soc-network .node,.soc-network .link,
  .soc-bars i,.soc-log,.soc-scanline,.soc-watermark{animation:none!important}
}


/* ===================== ROVUWA CORPORATE SOC BACKGROUND ===================== */
html,body{min-height:100%;position:relative}
body{isolation:isolate}
body>.soc-background{position:fixed!important;inset:0!important;z-index:0!important;display:block!important;pointer-events:none!important;overflow:hidden!important;opacity:.85!important;color:#1474b8!important;background:radial-gradient(circle at 15% 20%,rgba(0,217,255,.35),transparent 32%),radial-gradient(circle at 85% 15%,rgba(236,72,153,.30),transparent 34%),radial-gradient(circle at 75% 80%,rgba(168,85,247,.30),transparent 34%),radial-gradient(circle at 15% 85%,rgba(34,197,94,.28),transparent 32%),radial-gradient(circle at 50% 50%,rgba(249,115,22,.16),transparent 45%)!important}
body>.soc-background~*{position:relative;z-index:2}
.soc-topbar{position:absolute;left:0;right:0;top:0;height:38px;border-bottom:1px solid rgba(20,116,184,.22);display:flex;align-items:center;gap:12px;padding:0 28px;font:700 9px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.12em;color:rgba(7,35,66,.62);background:rgba(255,255,255,.22);backdrop-filter:blur(3px)}
.soc-top-status{margin-left:auto;color:rgba(19,111,69,.68)}
.soc-live-dot{width:6px;height:6px;border-radius:50%;background:#17834d;box-shadow:0 0 10px rgba(23,131,77,.8);animation:socBlink 1.5s infinite}
.soc-grid{position:absolute;inset:-30%;background-image:linear-gradient(rgba(0,217,255,.45) 1px,transparent 1px),linear-gradient(90deg,rgba(168,85,247,.4) 1px,transparent 1px);background-size:52px 52px;transform:perspective(700px) rotateX(61deg) translateY(8%);transform-origin:center bottom;animation:gridMove 16s linear infinite}
.soc-radar{position:absolute;width:390px;height:390px;right:-65px;top:115px;border:1px solid rgba(0,217,255,.4);border-radius:50%}
.radar-ring{position:absolute;border:1px solid rgba(0,217,255,.35);border-radius:50%;inset:17%}.radar-ring.r2{inset:34%;border-color:rgba(168,85,247,.35)}.radar-ring.r3{inset:51%;border-color:rgba(236,72,153,.35)}
.radar-cross{position:absolute;background:rgba(0,217,255,.25)}.radar-cross.h{height:1px;left:0;right:0;top:50%}.radar-cross.v{width:1px;top:0;bottom:0;left:50%}
.radar-sweep{position:absolute;width:50%;height:2px;left:50%;top:50%;transform-origin:left center;background:linear-gradient(90deg,rgba(236,72,153,.9),transparent);box-shadow:0 0 20px rgba(236,72,153,.6);animation:radar 5s linear infinite}
.radar-node,.soc-network .node{position:absolute;width:7px;height:7px;border-radius:50%;background:#00d9ff;box-shadow:0 0 15px rgba(0,217,255,.9);animation:pulse 2s infinite}
.radar-node.n1{background:#00d9ff;box-shadow:0 0 15px rgba(0,217,255,.9)}.radar-node.n2{background:#a855f7;box-shadow:0 0 15px rgba(168,85,247,.9)}.radar-node.n3{background:#ec4899;box-shadow:0 0 15px rgba(236,72,153,.9)}.radar-node.n4{background:#f97316;box-shadow:0 0 15px rgba(249,115,22,.9)}
.soc-network .node.a{background:#00d9ff;box-shadow:0 0 15px rgba(0,217,255,.9)}.soc-network .node.b{background:#22c55e;box-shadow:0 0 15px rgba(34,197,94,.9)}.soc-network .node.c{background:#a855f7;box-shadow:0 0 15px rgba(168,85,247,.9)}.soc-network .node.d{background:#ec4899;box-shadow:0 0 15px rgba(236,72,153,.9)}.soc-network .node.e{background:#f97316;box-shadow:0 0 15px rgba(249,115,22,.9)}.soc-network .node.f{background:#eab308;box-shadow:0 0 15px rgba(234,179,8,.9)}
.radar-node.n1{left:22%;top:35%}.radar-node.n2{left:69%;top:25%;animation-delay:.5s}.radar-node.n3{left:58%;top:70%;animation-delay:1s}.radar-node.n4{left:30%;top:73%;animation-delay:1.5s}
.soc-network{position:absolute;inset:0}.soc-network .node.a{left:13%;top:22%}.soc-network .node.b{left:28%;top:47%;animation-delay:.4s}.soc-network .node.c{left:58%;top:17%;animation-delay:.8s}.soc-network .node.d{left:73%;top:41%;animation-delay:1.2s}.soc-network .node.e{left:48%;top:76%;animation-delay:1.6s}.soc-network .node.f{left:86%;top:77%;animation-delay:2s}
.soc-network .link{position:absolute;height:1px;transform-origin:left center;background:linear-gradient(90deg,transparent,rgba(0,217,255,.6),transparent);animation:linkPulse 3s ease-in-out infinite}
.l1{left:13%;top:22%;width:29%;transform:rotate(43deg);background:linear-gradient(90deg,transparent,rgba(0,217,255,.6),transparent)}.l2{left:28%;top:47%;width:37%;transform:rotate(-35deg);animation-delay:.5s;background:linear-gradient(90deg,transparent,rgba(34,197,94,.6),transparent)}.l3{left:58%;top:17%;width:28%;transform:rotate(34deg);animation-delay:1s;background:linear-gradient(90deg,transparent,rgba(168,85,247,.6),transparent)}.l4{left:73%;top:41%;width:40%;transform:rotate(48deg);animation-delay:1.5s;background:linear-gradient(90deg,transparent,rgba(236,72,153,.6),transparent)}.l5{left:48%;top:76%;width:39%;transform:rotate(4deg);animation-delay:2s;background:linear-gradient(90deg,transparent,rgba(249,115,22,.6),transparent)}
.soc-console{position:absolute;width:265px;padding:13px 15px;border:2px solid rgba(0,217,255,.55);background:rgba(255,255,255,.7);box-shadow:0 15px 45px rgba(7,35,66,.15);backdrop-filter:blur(3px);font:600 9px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.06em;color:rgba(7,35,66,.85)}
.soc-console.left{left:3.5vw;top:18vh;border-color:rgba(0,217,255,.4)}.soc-console.right{right:3.5vw;bottom:17vh;width:300px;border-color:rgba(168,85,247,.4)}
.console-head{font-size:9px;letter-spacing:.13em;margin-bottom:10px;color:rgba(7,55,92,.85)}.console-head b{float:right;color:#22c55e}
.console-row{display:grid;grid-template-columns:42px 1fr 30px;align-items:center;gap:7px;margin:6px 0}.console-row em{font-style:normal;font-size:8px}.console-row i{height:3px;border-radius:3px;background:rgba(0,217,255,.6);animation:load 1.8s ease-in-out infinite}.console-bars{height:40px;display:flex;align-items:end;gap:5px;margin-top:10px}.console-bars b{display:block;width:12px;height:30%;border-radius:2px 2px 0 0;background:#00d9ff;box-shadow:0 0 10px rgba(0,217,255,.85);animation:bars 1.6s infinite}.console-bars b:nth-child(2){height:70%;animation-delay:.1s;background:#22c55e;box-shadow:0 0 10px rgba(34,197,94,.85)}.console-bars b:nth-child(3){height:45%;animation-delay:.2s;background:#a855f7;box-shadow:0 0 10px rgba(168,85,247,.85)}.console-bars b:nth-child(4){height:90%;animation-delay:.3s;background:#ec4899;box-shadow:0 0 10px rgba(236,72,153,.85)}.console-bars b:nth-child(5){height:55%;animation-delay:.4s;background:#f97316;box-shadow:0 0 10px rgba(249,115,22,.85)}.console-bars b:nth-child(6){height:78%;animation-delay:.5s;background:#eab308;box-shadow:0 0 10px rgba(234,179,8,.85)}.console-bars b:nth-child(7){height:40%;animation-delay:.6s;background:#00d9ff;box-shadow:0 0 10px rgba(0,217,255,.85)}.console-bars b:nth-child(8){height:65%;animation-delay:.7s;background:#22c55e;box-shadow:0 0 10px rgba(34,197,94,.85)}.console-bars b:nth-child(9){height:50%;animation-delay:.8s;background:#a855f7;box-shadow:0 0 10px rgba(168,85,247,.85)}.console-bars b:nth-child(10){height:82%;animation-delay:.9s;background:#ec4899;box-shadow:0 0 10px rgba(236,72,153,.85)}
.console-log{margin:5px 0;white-space:nowrap}.console-log span{opacity:.6;margin-right:6px}.console-log strong{float:right;color:#22c55e}
.soc-scan{position:absolute;left:0;right:0;top:-3px;height:2px;background:linear-gradient(90deg,transparent,#00d9ff,#a855f7,#ec4899,transparent);box-shadow:0 0 20px rgba(168,85,247,.4);animation:scan 8s linear infinite}
.soc-footer{position:absolute;left:50%;bottom:4vh;transform:translateX(-50%);white-space:nowrap;font:700 9px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.22em;color:rgba(7,55,92,.45);animation:drift 10s ease-in-out infinite}
@keyframes radar{to{transform:rotate(360deg)}}@keyframes pulse{0%,100%{opacity:.35;transform:scale(.75)}50%{opacity:1;transform:scale(1.45)}}@keyframes gridMove{from{transform:perspective(700px) rotateX(61deg) translateY(8%)}to{transform:perspective(700px) rotateX(61deg) translateY(17%)}}@keyframes linkPulse{0%,100%{opacity:.25}50%{opacity:1}}@keyframes scan{from{top:-3px}to{top:100%}}@keyframes bars{0%,100%{transform:scaleY(.65);transform-origin:bottom}50%{transform:scaleY(1.25);transform-origin:bottom}}@keyframes load{0%,100%{opacity:.45}50%{opacity:1}}@keyframes socBlink{0%,100%{opacity:.35}50%{opacity:1}}@keyframes drift{0%,100%{letter-spacing:.22em}50%{letter-spacing:.28em}}
@media(max-width:850px){.soc-console{transform:scale(.82);transform-origin:top left}.soc-console.left{left:2vw;top:16vh}.soc-console.right{transform-origin:bottom right;right:2vw;bottom:15vh}.soc-radar{width:300px;height:300px;right:-100px}.soc-footer{font-size:7px;letter-spacing:.1em}.soc-topbar{padding:0 12px}.soc-topbar span:not(.soc-top-status){display:none}}
@media(max-width:640px){.soc-console{width:180px!important;transform:scale(.85)}.soc-console.left{left:3vw;top:14vh}.soc-console.right{right:3vw;bottom:13vh;width:190px!important}.console-bars{height:36px}.console-bars b{width:11px}}
@media(max-width:420px){.soc-console.right{display:none}.soc-console.left{left:2vw;top:12vh;width:165px!important}.console-bars{height:32px}.console-bars b{width:9px}}
@media(prefers-reduced-motion:reduce){.soc-background *{animation:none!important}}