/* ==========================================================================
   gk-einv.css — GoldenKey · E-Invoicing cluster (GK.03.001)
   Sits on top of style.css / premium.css / luxe.css. Navy + gold brand,
   with a compliance-blue accent used only inside this cluster.
   Designed & Developed by Sahil Zaini / Zaini Developers
   ========================================================================== */
:root{
  --ei-navy:#0e2140; --ei-navy-2:#152c52; --ei-ink:#0e2140; --ei-body:#44536b;
  --ei-gold:#c9a227; --ei-gold-lt:#e6c25a; --ei-gold-deep:#9a7b16;
  --ei-blue:#1a5fb4; --ei-blue-lt:#e8f0fb; --ei-blue-deep:#12447f;
  --ei-green:#0f7b53; --ei-green-lt:#e6f5ee;
  --ei-amber:#a8660a; --ei-amber-lt:#fdf2e0;
  --ei-red:#b03030; --ei-red-lt:#fbeceb;
  --ei-line:rgba(14,33,64,.10); --ei-line-2:rgba(14,33,64,.16);
  --ei-r:18px; --ei-r-lg:26px;
  --ei-sh:0 14px 36px -24px rgba(14,33,64,.44);
  --ei-sh-lg:0 26px 60px -30px rgba(14,33,64,.5);
  --ei-f:'Jost',system-ui,sans-serif; --ei-fd:'Marcellus',Georgia,serif;
}

.ei *{box-sizing:border-box}
.ei{font-family:var(--ei-f);color:var(--ei-body);line-height:1.68}
.ei h1,.ei h2,.ei h3,.ei h4{font-family:var(--ei-fd);color:var(--ei-ink);line-height:1.22;margin:0}
.ei p{margin:0 0 14px}
.ei a{color:var(--ei-blue-deep)}
.ei-wrap{max-width:1200px;margin:0 auto;padding:0 22px}

/* ---------- eyebrow / kicker ---------- */
.ei-kick{display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ei-gold-deep)}
.ei-kick::before{content:"";width:24px;height:1.5px;background:linear-gradient(90deg,var(--ei-gold),transparent)}
.ei-kick.on-dark{color:var(--ei-gold-lt)}

/* ---------- breadcrumb ---------- */
.ei-crumb{background:#f7f9fc;border-bottom:1px solid var(--ei-line);padding:11px 0;font-size:13px}
.ei-crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.ei-crumb li{display:flex;align-items:center;gap:7px;color:#7a8798}
.ei-crumb li+li::before{content:"›";color:#b3bdcb}
.ei-crumb a{color:#5b6b83;text-decoration:none}
.ei-crumb a:hover{color:var(--ei-blue);text-decoration:underline}

/* ---------- hero ---------- */
.ei-hero{position:relative;background:
   radial-gradient(1100px 420px at 82% -10%,rgba(230,194,90,.20),transparent 62%),
   linear-gradient(140deg,#0b1c36 0%,#0e2140 42%,#16305a 100%);
  color:#dce5f2;padding:52px 0 58px;overflow:hidden}
.ei-hero::after{content:"";position:absolute;inset:auto 0 0 0;height:1px;
  background:linear-gradient(90deg,transparent,var(--ei-gold),transparent);opacity:.55}
.ei-hero-grid{display:grid;grid-template-columns:1.5fr .95fr;gap:38px;align-items:center}
.ei-hero h1{color:#fff;font-size:clamp(1.85rem,3.5vw,2.95rem);margin:14px 0 12px;letter-spacing:.1px}
.ei-hero .ei-lead{font-size:1.06rem;color:#c3d0e3;max-width:62ch}
.ei-hero .ei-lead b{color:#f3dc8f;font-weight:600}

.ei-chips{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
.ei-chip{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;
  padding:8px 14px;border-radius:100px;background:rgba(255,255,255,.07);
  border:1px solid rgba(230,194,90,.34);color:#e8eefa}
.ei-chip b{color:#f3dc8f;font-variant-numeric:tabular-nums}
.ei-chip.hot{background:linear-gradient(120deg,var(--ei-gold),var(--ei-gold-lt));
  border-color:transparent;color:#211a04}
.ei-chip.hot b{color:#3a2c02}

.ei-cta{display:flex;flex-wrap:wrap;gap:11px;margin-top:26px}
.ei-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--ei-f);font-weight:600;font-size:.95rem;padding:13px 24px;border-radius:100px;
  text-decoration:none;border:1.6px solid transparent;cursor:pointer;transition:.24s}
.ei-btn-gold{background:linear-gradient(120deg,var(--ei-gold),var(--ei-gold-lt));color:#211a04;
  box-shadow:0 14px 30px -16px rgba(201,162,39,.75)}
.ei-btn-gold:hover{transform:translateY(-2px);box-shadow:0 20px 40px -16px rgba(201,162,39,.85)}
.ei-btn-line{border-color:rgba(230,194,90,.5);color:#f3dc8f;background:transparent}
.ei-btn-line:hover{background:rgba(230,194,90,.12);transform:translateY(-2px)}
.ei-btn-blue{background:var(--ei-blue);color:#fff;box-shadow:0 14px 30px -18px rgba(26,95,180,.9)}
.ei-btn-blue:hover{background:var(--ei-blue-deep);transform:translateY(-2px)}
.ei-btn-ghost{border-color:var(--ei-line-2);color:var(--ei-ink);background:#fff}
.ei-btn-ghost:hover{border-color:var(--ei-blue);color:var(--ei-blue)}

/* hero side card */
.ei-hcard{background:rgba(255,255,255,.055);border:1px solid rgba(230,194,90,.3);
  border-radius:var(--ei-r-lg);padding:24px;backdrop-filter:blur(8px)}
.ei-hcard h3{color:#fff;font-size:1.16rem;margin-bottom:6px}
.ei-hcard p{color:#b7c5db;font-size:.9rem;margin-bottom:16px}
.ei-hcard .ei-mini{display:flex;justify-content:space-between;gap:12px;
  padding:10px 0;border-bottom:1px dashed rgba(255,255,255,.15);font-size:.88rem;color:#c8d5e8}
.ei-hcard .ei-mini:last-of-type{border-bottom:none}
.ei-hcard .ei-mini b{color:#f3dc8f;white-space:nowrap;font-variant-numeric:tabular-nums}

/* ---------- generic section ---------- */
.ei-sec{padding:56px 0}
.ei-sec.tint{background:#f7f9fc}
.ei-sec.tint-blue{background:linear-gradient(180deg,#f2f7fd,#fff)}
.ei-sec h2{font-size:clamp(1.4rem,2.3vw,1.95rem);margin:12px 0 12px}
.ei-sec .ei-sub{color:#5b6b83;max-width:74ch;margin-bottom:26px}

/* ---------- key facts strip ---------- */
.ei-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.ei-fact{background:#fff;border:1px solid var(--ei-line);border-radius:var(--ei-r);
  padding:18px 20px;box-shadow:var(--ei-sh);position:relative;overflow:hidden}
.ei-fact::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;
  background:linear-gradient(180deg,var(--ei-gold),var(--ei-gold-lt))}
.ei-fact .n{font-family:var(--ei-fd);font-size:1.5rem;color:var(--ei-navy);
  font-variant-numeric:tabular-nums;line-height:1.1}
.ei-fact .l{font-size:.83rem;color:#77839a;margin-top:5px}

/* ---------- point cards ---------- */
.ei-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.ei-cards.three{grid-template-columns:repeat(3,1fr)}
.ei-card{background:#fff;border:1px solid var(--ei-line);border-radius:var(--ei-r);
  padding:24px;box-shadow:var(--ei-sh);transition:.28s}
.ei-card:hover{transform:translateY(-4px);box-shadow:var(--ei-sh-lg);border-color:rgba(26,95,180,.28)}
.ei-card h3{font-size:1.1rem;margin-bottom:8px;display:flex;align-items:flex-start;gap:10px}
.ei-card p{font-size:.94rem;margin:0}
.ei-num{flex:0 0 28px;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;
  background:var(--ei-blue-lt);color:var(--ei-blue-deep);font-family:var(--ei-f);
  font-size:.82rem;font-weight:700;margin-top:2px}

/* ---------- timeline ---------- */
.ei-tl{position:relative;padding-left:30px}
.ei-tl::before{content:"";position:absolute;left:9px;top:6px;bottom:6px;width:2px;
  background:linear-gradient(180deg,var(--ei-gold),rgba(201,162,39,.15))}
.ei-tl-item{position:relative;padding:0 0 24px 4px}
.ei-tl-item:last-child{padding-bottom:0}
.ei-tl-item::before{content:"";position:absolute;left:-26px;top:5px;width:12px;height:12px;
  border-radius:50%;background:#fff;border:2.5px solid var(--ei-gold)}
.ei-tl-item.done::before{background:var(--ei-gold)}
.ei-tl-date{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ei-gold-deep)}
.ei-tl-item h4{font-size:1.03rem;margin:3px 0 4px}
.ei-tl-item p{font-size:.92rem;margin:0;color:#5b6b83}

/* ---------- checklist ---------- */
.ei-check{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:11px}
.ei-check li{position:relative;padding:13px 16px 13px 44px;background:#fff;
  border:1px solid var(--ei-line);border-radius:13px;font-size:.93rem;color:#3f4c60}
.ei-check li::before{content:"";position:absolute;left:16px;top:16px;width:16px;height:16px;
  border-radius:5px;background:var(--ei-green-lt);
  box-shadow:inset 0 0 0 1.5px rgba(15,123,83,.42)}
.ei-check li::after{content:"";position:absolute;left:21px;top:20px;width:6px;height:9px;
  border-right:2px solid var(--ei-green);border-bottom:2px solid var(--ei-green);
  transform:rotate(42deg)}

/* ---------- callouts ---------- */
.ei-note{border-radius:var(--ei-r);padding:18px 22px 18px 20px;border:1px solid;
  font-size:.94rem;margin:22px 0}
.ei-note b{display:block;margin-bottom:4px;font-weight:700}
.ei-note.info{background:var(--ei-blue-lt);border-color:rgba(26,95,180,.24);color:#1b3a63}
.ei-note.warn{background:var(--ei-amber-lt);border-color:rgba(168,102,10,.26);color:#6b4406}
.ei-note.good{background:var(--ei-green-lt);border-color:rgba(15,123,83,.24);color:#0b5138}

/* ---------- product / app showcase ---------- */
.ei-app{background:linear-gradient(140deg,#0b1c36,#10264a 55%,#173464);
  border-radius:var(--ei-r-lg);padding:40px;color:#d5e0f0;position:relative;overflow:hidden}
.ei-app::before{content:"";position:absolute;top:-120px;right:-80px;width:380px;height:380px;
  border-radius:50%;background:radial-gradient(circle,rgba(230,194,90,.22),transparent 68%)}
.ei-app h2{color:#fff;position:relative}
.ei-app .ei-sub{color:#b9c7dc;position:relative}
.ei-app-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:24px;position:relative}
.ei-feat{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.10);
  border-radius:15px;padding:16px 18px;transition:.26s}
.ei-feat:hover{background:rgba(255,255,255,.10);border-color:rgba(230,194,90,.34);transform:translateY(-3px)}
.ei-feat b{display:block;color:#f3dc8f;font-size:.95rem;font-weight:600;margin-bottom:4px}
.ei-feat span{font-size:.86rem;color:#aebbd0;line-height:1.55}
.ei-badge{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;padding:5px 11px;border-radius:100px;
  background:rgba(230,194,90,.16);border:1px solid rgba(230,194,90,.4);color:#f3dc8f}

/* ---------- FAQ ---------- */
.ei-faq{display:grid;gap:10px;max-width:920px}
.ei-faq details{background:#fff;border:1px solid var(--ei-line);border-radius:14px;
  padding:16px 20px;transition:.24s}
.ei-faq details[open]{border-color:rgba(26,95,180,.3);box-shadow:var(--ei-sh)}
.ei-faq summary{cursor:pointer;list-style:none;font-family:var(--ei-fd);font-size:1.02rem;
  color:var(--ei-ink);display:flex;align-items:flex-start;gap:12px}
.ei-faq summary::-webkit-details-marker{display:none}
.ei-faq summary::after{content:"+";margin-left:auto;color:var(--ei-gold-deep);
  font-family:var(--ei-f);font-size:1.35rem;line-height:1;transition:.24s}
.ei-faq details[open] summary::after{transform:rotate(45deg)}
.ei-faq details p{margin:12px 0 0;font-size:.94rem;color:#54627a}

/* ---------- related links ---------- */
.ei-links{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.ei-link{display:block;background:#fff;border:1px solid var(--ei-line);border-radius:14px;
  padding:16px 18px;text-decoration:none;transition:.26s}
.ei-link:hover{border-color:var(--ei-gold);transform:translateY(-3px);box-shadow:var(--ei-sh)}
.ei-link b{display:block;font-family:var(--ei-fd);font-size:1rem;color:var(--ei-ink);margin-bottom:3px}
.ei-link span{font-size:.85rem;color:#77839a}

/* ---------- pillar index grid ---------- */
.ei-pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.ei-pillar{background:#fff;border:1px solid var(--ei-line);border-radius:var(--ei-r);
  padding:26px;box-shadow:var(--ei-sh);transition:.28s;text-decoration:none;display:block}
.ei-pillar:hover{transform:translateY(-5px);box-shadow:var(--ei-sh-lg);border-color:var(--ei-gold)}
.ei-pillar h3{font-size:1.18rem;margin-bottom:7px}
.ei-pillar p{font-size:.93rem;color:#5b6b83;margin-bottom:12px}
.ei-pillar .ei-count{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ei-gold-deep)}

/* ---------- lead form ---------- */
.ei-form-sec{background:linear-gradient(140deg,#0b1c36,#12294c);padding:56px 0;color:#d5e0f0}
.ei-form-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:start}
.ei-form-grid h2{color:#fff}
.ei-form-grid .ei-sub{color:#b9c7dc}
.ei-usp{list-style:none;padding:0;margin:20px 0 0}
.ei-usp li{position:relative;padding:9px 0 9px 30px;font-size:.94rem;color:#c3d0e3}
.ei-usp li::before{content:"✦";position:absolute;left:0;top:8px;color:var(--ei-gold-lt)}
.ei-formcard{background:#fff;border-radius:var(--ei-r-lg);padding:30px;box-shadow:0 30px 70px -30px rgba(0,0,0,.55)}
.ei-formcard h3{font-size:1.3rem;margin-bottom:5px}
.ei-formcard>p{font-size:.9rem;color:#77839a;margin-bottom:18px}
.ei-frow{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.ei-fg{margin-bottom:13px}
.ei-fg label{display:block;font-size:.82rem;font-weight:600;color:#44536b;margin-bottom:6px}
.ei-fg input,.ei-fg select,.ei-fg textarea{width:100%;padding:12px 14px;border-radius:11px;
  border:1.4px solid var(--ei-line-2);font-family:var(--ei-f);font-size:.94rem;color:var(--ei-ink);
  background:#fbfcfe;transition:.2s}
.ei-fg input:focus,.ei-fg select:focus,.ei-fg textarea:focus{outline:none;border-color:var(--ei-blue);
  background:#fff;box-shadow:0 0 0 3px rgba(26,95,180,.12)}
.ei-fg .err{display:none;font-size:.78rem;color:var(--ei-red);margin-top:5px}
.ei-formcard .form-note{font-size:.79rem;color:#8a95a8;margin:13px 0 0;text-align:center}

/* ---------- sticky mobile CTA ---------- */
.ei-sticky{display:none}

/* ---------- responsive ---------- */
@media(max-width:1024px){
  .ei-hero-grid{grid-template-columns:1fr;gap:28px}
  .ei-facts{grid-template-columns:repeat(2,1fr)}
  .ei-app-grid{grid-template-columns:repeat(2,1fr)}
  .ei-links{grid-template-columns:repeat(2,1fr)}
  .ei-form-grid{grid-template-columns:1fr;gap:28px}
}
@media(max-width:720px){
  .ei-sec{padding:40px 0}
  .ei-hero{padding:38px 0 42px}
  .ei-cards,.ei-cards.three,.ei-pillars,.ei-check,.ei-links,.ei-app-grid,.ei-frow{grid-template-columns:1fr}
  .ei-facts{grid-template-columns:1fr 1fr}
  .ei-app{padding:26px 22px}
  .ei-formcard{padding:22px}
  .ei-cta .ei-btn{flex:1 1 100%}
  .ei-sticky{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:58;gap:1px;
    background:rgba(14,33,64,.14);backdrop-filter:blur(10px)}
  .ei-sticky a{flex:1;text-align:center;padding:14px 6px;font-family:var(--ei-f);font-weight:600;
    font-size:.86rem;text-decoration:none}
  .ei-sticky .s-call{background:#0e2140;color:#f3dc8f}
  .ei-sticky .s-wa{background:#128c7e;color:#fff}
  .ei-sticky .s-quote{background:linear-gradient(120deg,#c9a227,#e6c25a);color:#211a04}
  body{padding-bottom:52px}
  .floaters,.floaters.left{bottom:66px}
}
@media(prefers-reduced-motion:reduce){
  .ei *{transition:none!important;animation:none!important}
}