
:root{
  --bg:#060911;
  --bg2:#0b1320;
  --panel:#0c121d;
  --panel2:#111a28;
  --text:#f7f8fb;
  --muted:#99a4b5;
  --line:rgba(255,255,255,.09);
  --line2:rgba(255,255,255,.15);
  --violet:#8f75ff;
  --cyan:#65e6d8;
  --max:1180px;
  --header-h:76px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{
  margin:0!important;
  padding:0!important;
  background:var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  overflow-x:hidden;
}
body.modal-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.shell{width:min(calc(100% - 34px),var(--max));margin:auto}

.ambient-bg{
  position:fixed;inset:0;z-index:-5;pointer-events:none;
  background:
    radial-gradient(circle at 8% 4%,rgba(143,117,255,.15),transparent 28%),
    radial-gradient(circle at 92% 34%,rgba(36,174,160,.10),transparent 28%),
    linear-gradient(180deg,#060911,#08111b 48%,#060911);
}

.site-header{
  position:sticky;top:0;z-index:9000;
  background:rgba(6,9,17,.92);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(14px);
}
body.admin-bar .site-header{top:32px}
.header-inner{
  min-height:var(--header-h);
  display:flex;align-items:center;justify-content:space-between;gap:18px;
}

.brand{display:flex;align-items:center;gap:10px;min-width:max-content}
.brand-icon{width:36px;height:36px}
.brand-icon svg{width:100%;height:100%;display:block}
.brand-name{font-size:22px;font-weight:900;letter-spacing:-.055em}
.brand-name b{
  background:linear-gradient(90deg,#fff,#cfc7ff);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.brand-name span{color:#7d8799;margin-left:2px}
.brand small{font-size:8px;letter-spacing:.18em;color:#616b7d;font-weight:800;margin-left:6px}

.desktop-nav{display:flex;align-items:center;gap:24px;color:#c6ceda;font-size:13px}
.desktop-nav a:hover{color:#fff}
.header-actions{display:flex;align-items:center;gap:9px}
.control-btn{
  height:42px;border:1px solid var(--line);border-radius:999px;
  background:rgba(255,255,255,.035);color:#e1e6ed;
  display:inline-flex;align-items:center;gap:7px;padding:0 12px;
  font-size:12px;font-weight:800;
}
.control-btn svg{width:16px;height:16px;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.theme-btn{min-width:76px;justify-content:center}
.theme-btn .moon{display:none}
.project-top-btn{
  height:44px;padding:0 18px;border:0;border-radius:999px;
  color:#090b10;background:linear-gradient(135deg,#fff,#e3dcff 62%,#d3fff8);
  font-weight:900;font-size:13px;
}

.language{position:relative}
.language-menu{
  position:absolute;right:0;top:50px;width:180px;padding:8px;
  background:#0c121d;border:1px solid var(--line);border-radius:16px;
  box-shadow:0 22px 70px rgba(0,0,0,.38);display:none;
}
.language-menu.open{display:block}
.language-menu button{
  width:100%;display:flex;justify-content:space-between;align-items:center;
  border:0;background:transparent;color:#d0d6df;padding:10px;border-radius:10px;text-align:left;font-size:12px;
}
.language-menu button:hover{background:rgba(255,255,255,.06)}
.language-menu b{color:#6e7889;font-size:10px}

.hero{
  min-height:calc(100vh - var(--header-h));
  display:flex;align-items:center;
  padding:26px 0 34px;
}
.hero-grid{
  width:100%;display:grid;grid-template-columns:1.06fr .94fr;gap:38px;align-items:center;
}
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  padding:8px 12px;border:1px solid var(--line);border-radius:999px;
  background:rgba(255,255,255,.03);font-size:12px;font-weight:800;color:#d5dae3;
}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px rgba(101,230,216,.6)}
h1,h2,h3{margin-top:0}
h1{
  font-size:clamp(50px,6.6vw,90px);line-height:.94;letter-spacing:-.065em;
  margin:18px 0 20px;font-weight:900;
}
.gradient-text{
  background:linear-gradient(90deg,#fff,#c9bcff 42%,#64e6d8 80%,#84bfff);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-copy{max-width:680px;color:var(--muted);font-size:17px;line-height:1.72;margin:0 0 26px}
.hero-buttons{display:flex;gap:11px;flex-wrap:wrap}
.primary-btn,.secondary-btn{
  min-height:52px;padding:0 19px;border-radius:15px;font-weight:900;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
}
.primary-btn{
  border:0;background:linear-gradient(135deg,#fff,#e3dcff 65%,#d3fff8);color:#080a0e;
}
.primary-btn b{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.08)}
.secondary-btn{border:1px solid var(--line);background:rgba(255,255,255,.025)}
.proof-row{display:flex;gap:13px;flex-wrap:wrap;margin-top:22px;color:#7f8999;font-size:11px}
.proof-row span{display:flex;align-items:center;gap:6px}
.proof-row i{width:4px;height:4px;border-radius:50%;background:#566071}
.proof-row b{font-weight:700}

.earth-area{
  min-height:500px;position:relative;display:flex;align-items:center;justify-content:center;
}
.earth-light{
  position:absolute;right:8%;top:7%;width:115px;height:115px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.32),rgba(152,192,255,.10) 28%,transparent 70%);
  filter:blur(9px);z-index:4;pointer-events:none;
}
.earth-orbit{
  position:absolute;width:420px;height:170px;border:1px solid rgba(122,205,210,.15);
  border-radius:50%;transform:rotate(-10deg);
}
.earth{
  width:360px;height:360px;border-radius:50%;position:relative;overflow:hidden;
  background:#02060c;
  box-shadow:
    inset -42px -28px 72px rgba(0,0,0,.34),
    0 38px 105px rgba(42,83,155,.23),
    0 0 40px rgba(78,151,235,.08);
  border:1px solid rgba(255,255,255,.10);
  isolation:isolate;
}
.earth-photo{
  position:absolute;
  inset:-1%;
  width:102%;
  height:102%;
  object-fit:cover;
  border-radius:50%;
  z-index:1;
  transform-origin:50% 50%;
  animation:earthPhotoSpin 52s linear infinite;
  will-change:transform;
}
.earth-shade{
  position:absolute;inset:0;z-index:2;
  background:
    radial-gradient(circle at 30% 24%,rgba(255,255,255,.035),transparent 28%),
    linear-gradient(90deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,0) 43%,rgba(0,0,0,.035) 61%,rgba(0,0,0,.30) 100%);
  pointer-events:none;
}
.earth-highlight{
  position:absolute;z-index:3;
  left:13%;top:8%;width:42%;height:28%;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.18),rgba(155,202,255,.06) 38%,transparent 72%);
  filter:blur(13px);
  transform:rotate(-24deg);
  pointer-events:none;
}
.earth-card{
  position:absolute;right:0;top:78px;width:205px;padding:16px;border-radius:18px;
  background:rgba(8,13,22,.86);border:1px solid var(--line);
}
.earth-card small{display:block;color:#758092;font-size:9px;letter-spacing:.07em;margin-bottom:7px}
.earth-card strong{font-size:14px}
.status-bars{display:flex;gap:5px;align-items:end;height:16px;margin-top:12px}
.status-bars i{width:4px;border-radius:4px;background:linear-gradient(to top,var(--violet),var(--cyan))}
.status-bars i:nth-child(1){height:6px}.status-bars i:nth-child(2){height:10px}.status-bars i:nth-child(3){height:15px}.status-bars i:nth-child(4){height:11px}
@keyframes earthPhotoSpin{from{transform:rotate(0deg) scale(1.02)}to{transform:rotate(360deg) scale(1.02)}}

.section{padding:88px 0;scroll-margin-top:96px}
.section-kicker{font-size:10px;letter-spacing:.15em;color:#7b8596;font-weight:900;margin-bottom:11px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:30px}
.section-head h2,.contact-panel h2{font-size:clamp(34px,4.7vw,58px);line-height:1.04;letter-spacing:-.05em;margin:0;font-weight:900}
.section-head p{max-width:520px;color:var(--muted);line-height:1.68;margin:0}

.service-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:15px}
.service-card{
  border:1px solid var(--line);border-radius:24px;padding:26px;
  background:linear-gradient(180deg,rgba(255,255,255,.038),rgba(255,255,255,.015));
}
.service-card.large{grid-column:span 7}.service-card.small{grid-column:span 5}
.service-no{display:block;font-size:9px;color:#6f7989;letter-spacing:.1em;margin-bottom:56px}
.service-card h3{font-size:26px;letter-spacing:-.04em;margin-bottom:9px}
.service-card p{color:var(--muted);line-height:1.65;margin:0}

.cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}
.cap-grid article{border:1px solid var(--line);border-radius:19px;padding:21px;background:rgba(255,255,255,.02)}
.cap-grid b{display:block;font-size:15px;margin-bottom:6px}
.cap-grid p{margin:0;color:var(--muted);font-size:12px;line-height:1.58}

.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.process-grid article{border-top:1px solid var(--line);padding:22px 16px}
.process-grid span{display:block;color:#727c8c;font-size:10px;margin-bottom:18px}
.process-grid b{display:block;font-size:16px;margin-bottom:6px}
.process-grid p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}

.contact-panel{
  min-height:390px;border:1px solid var(--line);border-radius:30px;padding:44px;
  background:
    radial-gradient(circle at 10% 8%,rgba(143,117,255,.16),transparent 30%),
    radial-gradient(circle at 88% 20%,rgba(101,230,216,.08),transparent 25%),
    #0b111b;
  display:flex;align-items:end;justify-content:space-between;gap:28px;
}
.contact-panel p{max-width:560px;color:var(--muted);line-height:1.68}
.contact-btn{
  min-height:54px;border:0;border-radius:17px;padding:0 20px;
  background:linear-gradient(135deg,#fff,#e3dcff 62%,#d3fff8);color:#080a0e;font-weight:900;
  display:flex;align-items:center;gap:10px;white-space:nowrap;
}
.contact-btn b{width:27px;height:27px;border-radius:50%;background:#0a0c11;color:#fff;display:grid;place-items:center}

.site-footer{padding:24px 0 38px;color:#748091;font-size:11px}
.footer-inner{border-top:1px solid var(--line);padding-top:22px;display:flex;justify-content:space-between;gap:18px}

.modal{
  position:fixed;inset:0;z-index:20000;display:none;align-items:center;justify-content:center;
  padding:18px;background:rgba(3,5,9,.78);
}
.modal.open{display:flex}
.modal-box{
  position:relative;width:min(100%,760px);max-height:88vh;overflow:auto;
  border:1px solid var(--line);border-radius:28px;padding:28px;background:#0b111b;
  box-shadow:0 36px 110px rgba(0,0,0,.5);
}
.modal-box.small{width:min(100%,500px)}
.modal-close{
  position:absolute;right:16px;top:16px;width:40px;height:40px;border-radius:50%;
  border:1px solid var(--line);background:rgba(255,255,255,.04);color:#fff;font-size:23px;
}
.modal-kicker{font-size:9px;letter-spacing:.14em;color:#788393;font-weight:900}
.modal h3{font-size:31px;line-height:1.1;letter-spacing:-.045em;margin:8px 50px 8px 0}
.modal p{color:var(--muted);line-height:1.62}

.contact-options{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:20px}
.social-card{
  min-height:165px;border:1px solid var(--line);border-radius:21px;padding:20px;
  background:rgba(255,255,255,.025);display:flex;flex-direction:column;justify-content:space-between;
}
.social-logo{width:58px;height:58px;border-radius:18px;display:grid;place-items:center}
.whatsapp .social-logo{background:#25D366;box-shadow:0 0 28px rgba(37,211,102,.25)}
.instagram .social-logo{background:radial-gradient(circle at 30% 110%,#fdf497 0 5%,#fd5949 39%,#d6249f 62%,#285AEB 90%);box-shadow:0 0 28px rgba(214,36,159,.22)}
.social-card b{display:block;font-size:17px;margin-bottom:3px}
.social-card span{color:#8993a3;font-size:11px}

.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:20px}
.form-grid label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:800;color:#cbd1da}
.form-grid input,.form-grid select,.form-grid textarea{
  width:100%;border:1px solid var(--line);border-radius:13px;background:#0f1621;color:#fff;padding:13px 14px;outline:none;
}
.form-grid textarea{min-height:115px;resize:vertical}
.full-field{grid-column:1/-1}
.field-title{font-size:12px;color:#cbd1da;font-weight:800}
.choice-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.choice-row label{display:block}
.choice-row input{display:none}
.choice-row span{
  display:block;padding:9px 11px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.025);font-size:11px;font-weight:700;color:#c7cdd6;cursor:pointer;
}
.choice-row input:checked+span{background:#fff;color:#090b0f;border-color:#fff}
.form-submit{width:100%;min-height:52px;border:0;border-radius:14px;margin-top:16px;background:linear-gradient(135deg,#fff,#e3dcff);color:#080a0e;font-weight:900}
.form-note{display:block;color:#6f7989;margin-top:9px}

html[data-theme="light"] body{
  --bg:#f5f7fb;--bg2:#eef2f8;--panel:#fff;--panel2:#f8fafc;--text:#121826;--muted:#687386;--line:rgba(17,24,39,.1);--line2:rgba(17,24,39,.17);
  background:#f5f7fb;color:var(--text);
}
html[data-theme="light"] .ambient-bg{
  background:
    radial-gradient(circle at 8% 4%,rgba(143,117,255,.12),transparent 28%),
    radial-gradient(circle at 92% 34%,rgba(36,174,160,.10),transparent 28%),
    linear-gradient(180deg,#f8f9fc,#eef3f8 48%,#f7f9fc);
}
html[data-theme="light"] .site-header{background:rgba(249,251,255,.94);box-shadow:0 8px 30px rgba(38,48,68,.05)}
html[data-theme="light"] .desktop-nav{color:#4f596b}
html[data-theme="light"] .control-btn,
html[data-theme="light"] .secondary-btn{background:#fff;color:#253044;border-color:rgba(17,24,39,.1)}
html[data-theme="light"] .theme-btn .sun{display:none}
html[data-theme="light"] .theme-btn .moon{display:block}
html[data-theme="light"] .language-menu{background:#fff;box-shadow:0 22px 70px rgba(40,50,70,.13)}
html[data-theme="light"] .language-menu button{color:#4f596b}
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .service-card,
html[data-theme="light"] .cap-grid article{background:rgba(255,255,255,.72)}
html[data-theme="light"] .earth-card{background:rgba(255,255,255,.9);color:#182133}
html[data-theme="light"] .contact-panel{background:
  radial-gradient(circle at 10% 8%,rgba(143,117,255,.13),transparent 30%),
  radial-gradient(circle at 88% 20%,rgba(101,230,216,.11),transparent 25%),#fff}
html[data-theme="light"] .modal{background:rgba(232,236,244,.78)}
html[data-theme="light"] .modal-box{background:#fff;color:#121826;box-shadow:0 36px 110px rgba(45,55,75,.18)}
html[data-theme="light"] .modal-close{background:#f2f4f8;color:#20293b}
html[data-theme="light"] .social-card{background:#f8fafc}
html[data-theme="light"] .form-grid input,
html[data-theme="light"] .form-grid select,
html[data-theme="light"] .form-grid textarea{background:#f6f8fb;color:#121826}
html[data-theme="light"] .choice-row span{background:#f7f8fb;color:#4f596b}
html[data-theme="light"] .brand-name b{
  background:linear-gradient(90deg,#1c2230,#5b46a3);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

@media(max-width:960px){
  .desktop-nav{display:none}
  .brand small{display:none}
  .hero-grid{grid-template-columns:1fr;gap:8px}
  .hero{padding-top:20px;min-height:auto}
  .earth-area{min-height:420px}
  .earth{width:310px;height:310px}
  .earth-orbit{width:360px;height:145px}
  .earth-card{right:2%;top:48px}
  .service-card.large,.service-card.small{grid-column:span 12}
  .cap-grid{grid-template-columns:1fr 1fr}
  .process-grid{grid-template-columns:1fr 1fr}
  .section-head{display:block}
  .section-head p{margin-top:14px}
  .contact-panel{display:block}
  .contact-btn{margin-top:20px}
}

@media(max-width:782px){
  body.admin-bar .site-header{top:46px}
}

@media(max-width:650px){
  :root{--header-h:64px}
  html{scroll-padding-top:80px}
  .shell{width:min(calc(100% - 22px),var(--max))}
  .header-inner{min-height:64px;gap:8px}
  .brand-icon{width:31px;height:31px}
  .brand-name{font-size:17px}
  .header-actions{gap:6px}
  .control-btn{height:38px;padding:0 10px}
  .theme-btn{min-width:38px;width:38px;padding:0}
  .theme-text{display:none}
  .project-top-btn{
    height:38px;padding:0 11px;font-size:10px;
    width:108px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }

  .hero{
    padding:14px 0 24px;
  }
  h1{font-size:46px;margin:14px 0 16px}
  .hero-copy{font-size:14px;line-height:1.65}
  .hero-buttons{display:grid}
  .primary-btn,.secondary-btn{width:100%}
  .proof-row{gap:8px 12px;margin-top:18px}

  .earth-area{min-height:330px;margin-top:4px}
  .earth{width:235px;height:235px}
  .earth-orbit{width:280px;height:110px}
  .earth-light{width:80px;height:80px;right:9%;top:7%}
  .earth-card{width:150px;padding:11px;right:0;top:30px}
  .earth-card strong{font-size:11px}
  .earth-card small{font-size:7px}
  

  .section{padding:70px 0;scroll-margin-top:82px}
  .section-head h2,.contact-panel h2{font-size:38px}
  .service-card{padding:22px}
  .service-no{margin-bottom:40px}
  .cap-grid{grid-template-columns:1fr}
  .process-grid{grid-template-columns:1fr}
  .contact-panel{min-height:350px;padding:25px 20px}
  .contact-btn{width:100%;justify-content:center}
  .footer-inner{display:block}
  .footer-inner span:last-child{display:block;margin-top:7px}

  .modal{padding:9px}
  .modal-box{padding:21px 15px;border-radius:21px}
  .modal h3{font-size:27px}
  .contact-options{grid-template-columns:1fr}
  .social-card{min-height:130px}
  .form-grid{grid-template-columns:1fr}
  .full-field{grid-column:auto}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .earth-photo{animation:none!important}
}


/* V7.1 — user-provided real Earth image */
.earth-light{
  right:3% !important;
  top:4% !important;
  width:145px !important;
  height:145px !important;
  background:radial-gradient(circle at 36% 36%,
    rgba(255,255,255,.30) 0%,
    rgba(176,211,255,.14) 22%,
    rgba(108,166,255,.045) 45%,
    transparent 72%) !important;
  filter:blur(11px) !important;
}
@media(max-width:650px){
  .earth-photo{animation-duration:62s}
  .earth-light{
    width:90px !important;
    height:90px !important;
    right:4% !important;
    top:5% !important;
    filter:blur(9px) !important;
  }
}


/* =========================================================
   V7.2 — LIGHT THEME READABILITY + BRAND VISIBILITY
========================================================= */
html[data-theme="light"] body{
  color:#101522 !important;
}
html[data-theme="light"] .brand-icon{
  background:#0a1020;
  border:1px solid rgba(17,24,39,.10);
  border-radius:11px;
  padding:4px;
  box-shadow:0 8px 24px rgba(59,65,90,.12);
}
html[data-theme="light"] .brand-name span{
  color:#5a6475 !important;
}
html[data-theme="light"] .brand small{
  color:#697386 !important;
}
html[data-theme="light"] .desktop-nav,
html[data-theme="light"] .desktop-nav a{
  color:#3f495a !important;
}
html[data-theme="light"] .desktop-nav a:hover{
  color:#111827 !important;
}
html[data-theme="light"] .eyebrow{
  color:#293347 !important;
  background:rgba(255,255,255,.88) !important;
}
html[data-theme="light"] .hero-copy,
html[data-theme="light"] .section-head p,
html[data-theme="light"] .service-card p,
html[data-theme="light"] .cap-grid p,
html[data-theme="light"] .process-grid p,
html[data-theme="light"] .contact-panel p,
html[data-theme="light"] .modal p{
  color:#596579 !important;
}
html[data-theme="light"] .proof-row{
  color:#596579 !important;
}
html[data-theme="light"] .proof-row b{
  color:#4e596c !important;
}
html[data-theme="light"] .section-kicker,
html[data-theme="light"] .service-no,
html[data-theme="light"] .modal-kicker,
html[data-theme="light"] .earth-card small,
html[data-theme="light"] .form-note{
  color:#667085 !important;
}
html[data-theme="light"] .section-head h2,
html[data-theme="light"] .service-card h3,
html[data-theme="light"] .cap-grid b,
html[data-theme="light"] .process-grid b,
html[data-theme="light"] .contact-panel h2,
html[data-theme="light"] .modal h3,
html[data-theme="light"] .earth-card strong{
  color:#111827 !important;
}
html[data-theme="light"] .control-btn{
  background:#ffffff !important;
  color:#273246 !important;
  border-color:rgba(17,24,39,.11) !important;
}
html[data-theme="light"] .project-top-btn,
html[data-theme="light"] .primary-btn,
html[data-theme="light"] .contact-btn{
  color:#080b10 !important;
}
html[data-theme="light"] .secondary-btn{
  background:#ffffff !important;
  color:#202b3e !important;
  border-color:rgba(17,24,39,.11) !important;
}
html[data-theme="light"] .language-menu b{
  color:#6b7280 !important;
}
html[data-theme="light"] .choice-row span{
  background:#f5f7fa !important;
  color:#435066 !important;
}
html[data-theme="light"] .choice-row input:checked + span{
  background:#101522 !important;
  color:#fff !important;
  border-color:#101522 !important;
}
html[data-theme="light"] .social-card span{
  color:#667085 !important;
}
html[data-theme="light"] .site-footer{
  color:#697386 !important;
}

/* Earth image must always be the user-provided photo. */
.earth-photo{
  content:url("../images/earth-user-v72.webp?v=72");
  opacity:1 !important;
  filter:saturate(1.04) contrast(1.03);
}

/* Make the light source clearly visible but fixed in place. */
.earth-light{
  z-index:5 !important;
  pointer-events:none !important;
}
