/* =============================
File: /assets/a1-vat.css
============================= */
:root{
  --bg:#0b1324;
  --card:#111a33;
  --ink:#eaf0ff;
  --muted:#9fb0d6;
  --accent:#6ea8fe;
  --accent-dark:#4d8dff;
  --line:rgba(255,255,255,.10);
  --panel:rgba(0,0,0,.15);
  --shadow:0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;width:100%;overflow-x:hidden}
body{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;
  color:var(--ink);
  background:radial-gradient(900px 560px at 85% -120px,#1b2d5b,transparent),radial-gradient(780px 480px at -20% 120%,#122347,transparent),var(--bg);
  padding:0 20px 24px;
}
a{color:var(--accent);text-decoration:none;font-weight:500}
a:hover,a:focus{color:#fff;text-decoration:underline}
a:visited{color:var(--accent)}
.wrap{width:100%;max-width:980px;margin:0 auto 30px}

/* ===== NAV ===== */
.a1-nav{width:calc(100% + 40px);margin:0 -20px 26px;background:rgba(7,14,30,.82);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.a1-nav__inner{max-width:1100px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand-logo,.brand-logo img,img.brand-logo{display:block;height:auto}
.brand-logo--nav img{width:min(44vw,360px);max-width:100%}
.a1-nav__links{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:flex-end}
.a1-nav__links a{color:#fff;text-decoration:none;padding:9px 12px;border-radius:10px;font-size:14px}
.a1-nav__links a:hover{background:rgba(255,255,255,.08);text-decoration:none}
.a1-nav__links a.is-active{background:rgba(110,168,254,.18);border:1px solid rgba(110,168,254,.5)}

/* ===== INTRO ===== */
.hero-intro{width:100%;max-width:980px;margin:0 auto 20px;padding:24px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));box-shadow:var(--shadow)}
.hero-intro .eyebrow{margin:0 0 8px;color:var(--accent);font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.hero-intro h1{margin:0 0 12px;font-size:clamp(34px,5vw,56px);line-height:1.02;letter-spacing:-.04em}
.hero-intro p{margin:0;max-width:850px;color:#dce6ff;font-size:17px;line-height:1.65}

/* ===== CALCULATOR ===== */
.card{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:20px;box-shadow:var(--shadow);overflow:hidden}
.card header{padding:22px 24px;border-bottom:1px solid rgba(255,255,255,.06);display:flex;gap:16px;align-items:center;justify-content:space-between}
.card header h1,.card header h2{font-size:20px;margin:0;letter-spacing:.2px}
.rate-pill{background:rgba(110,168,254,.15);border:1px solid rgba(110,168,254,.6);color:#d8e6ff;padding:6px 10px;border-radius:999px;font-size:12px;white-space:nowrap}
.grid{display:grid;gap:18px;grid-template-columns:repeat(12,1fr);padding:22px}
.panel,.results{background:var(--panel);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:18px}
.panel{grid-column:span 7}.results{grid-column:span 5}
.label{font-size:12px;color:var(--muted);margin-bottom:6px}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
input[type="number"],input[type="text"],select{width:100%;padding:14px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:var(--ink);font-size:16px;outline:none}
input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(110,168,254,.15)}
.toggle{display:inline-flex;border:1px solid rgba(255,255,255,.12);border-radius:12px;overflow:hidden;background:rgba(255,255,255,.04)}
.toggle button{padding:12px 14px;color:var(--ink);background:transparent;border:0;cursor:pointer;font-size:14px}
.toggle button.active{background:rgba(110,168,254,.18)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:var(--ink);cursor:pointer;font-size:14px;text-decoration:none}
.btn:hover{text-decoration:none;background:rgba(255,255,255,.08)}
.btn.primary{background:linear-gradient(180deg,var(--accent),var(--accent-dark));border:0;color:#051028;font-weight:700}
.btn.ghost{background:transparent}
.res-line{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px dashed rgba(255,255,255,.08)}
.res-line:last-child{border-bottom:none}
.res-line .k{color:var(--muted);font-size:14px}.res-line .v{font-feature-settings:"tnum" on,"lnum" on;font-variant-numeric:tabular-nums;font-size:18px}
.hint{color:var(--muted);font-size:12px;margin-top:8px}.mini{font-size:12px;color:var(--muted);line-height:1.55}
.rate-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin-top:6px}
.rate{padding:10px 8px;text-align:center;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);cursor:pointer;font-size:14px}
.rate:hover{background:rgba(255,255,255,.08)}.rate.active{outline:2px solid var(--accent);background:rgba(110,168,254,.16)}

/* ===== SEO CONTENT ===== */
.seo-content{width:100%;max-width:980px;margin:8px auto 28px;padding:26px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.035);box-shadow:var(--shadow)}
.seo-content h2{font-size:26px;margin:0 0 12px;letter-spacing:-.02em}.seo-content h2:not(:first-child){margin-top:28px}
.seo-content h3{font-size:18px;margin:0 0 8px}.seo-content p,.seo-content li{color:#dce6ff;line-height:1.7}.seo-content p{margin:0 0 14px}
.content-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:18px 0}
.content-grid article{padding:16px;border:1px solid var(--line);border-radius:16px;background:rgba(0,0,0,.12)}
details{border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin:10px 0;background:rgba(0,0,0,.12)}
summary{cursor:pointer;font-weight:700}details p{margin:10px 0 0}

/* ===== EMBED BANNER/PAGE ===== */
.embed-banner{max-width:960px;margin:30px auto;padding:20px;border:2px solid #0f4c81;border-radius:12px;background:#f0f6fa;text-align:center;box-shadow:0 3px 8px rgba(0,0,0,.05);color:#1f2937}
.page-card{margin-top:20px}.page-card .content,.vat-cal-content{padding:18px 24px}.page-card .content p,.page-card .content li{color:var(--ink)}

/* ===== FOOTER ===== */
.a1-footer{width:calc(100% + 40px);margin:24px -20px 0;background:#0e1422;color:#e6e8ec;border-top:1px solid var(--line);flex-shrink:0;clear:both}
.a1-footer__inner{width:100%;max-width:1100px;margin:0 auto;padding:22px 20px;display:flex;flex-direction:column;gap:.75rem;text-align:center}
.a1-footer__links{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.75rem 1rem;align-items:center;justify-content:center;font-size:.9rem;color:#fff}
.a1-footer__legal{font-size:14px;color:#9fb0d6;text-align:center;margin:0;line-height:1.55}

@media (max-width:900px){
  .panel,.results{grid-column:span 12}
  .rate-grid{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:700px){
  body{padding:0 14px 20px}
  .a1-nav,.a1-footer{width:calc(100% + 28px);margin-left:-14px;margin-right:-14px}
  .a1-nav__inner{flex-direction:column;align-items:center;text-align:center}
  .brand-logo--nav img{width:min(78vw,320px)}
  .a1-nav__links{justify-content:center}
  .hero-intro,.seo-content{padding:20px}
  .grid{padding:16px}.card header{flex-direction:column;align-items:flex-start}
  .toggle{display:flex;flex-direction:column;width:100%}.toggle button{width:100%;text-align:left}
  .rate-grid{grid-template-columns:repeat(3,1fr)}
  .content-grid{grid-template-columns:1fr}
}

.seo-content a,.vat-cal-content a{color:var(--accent);font-weight:700}.vat-cal-content pre{white-space:pre-wrap;overflow:auto;background:rgba(0,0,0,.2);border:1px solid var(--line);border-radius:12px;padding:14px;color:#dce6ff}.vat-cal-content h2{margin-top:26px}