/* ===== AITECH - main website, light theme ===== */
:root {
  --bs-primary: #e00006;
  --bs-primary-rgb: 224, 0, 6;
  --bs-body-font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --bs-body-color: #1e293b;
  --at-ink: #111111;
  --at-network: #4f46e5;
  --at-accessory: #0891b2;
  --at-solar: #f59e0b;
  --at-computer: #475569;
  --at-border: #e2e8f0;
  --at-soft: #f8fafc;
  --at-radius: 1.25rem;
}

html { scroll-behavior: smooth; }
body { background: #fff; overflow-x: hidden; }
a { text-decoration: none; }

.btn-primary { --bs-btn-bg: var(--bs-primary); --bs-btn-border-color: var(--bs-primary); --bs-btn-hover-bg: #bc0005; --bs-btn-hover-border-color: #bc0005; --bs-btn-active-bg: #9a0004; --bs-btn-active-border-color: #9a0004; }
.btn-outline-primary { --bs-btn-color: var(--bs-primary); --bs-btn-border-color: var(--bs-primary); --bs-btn-hover-bg: var(--bs-primary); --bs-btn-hover-border-color: var(--bs-primary); }
.btn-dark { --bs-btn-bg: var(--at-ink); --bs-btn-border-color: var(--at-ink); }
.text-primary { color: var(--bs-primary) !important; }

/* ----- Navbar ----- */
.navbar { padding-block: 1rem; transition: all .3s ease; }
.navbar.scrolled { background: rgba(255,255,255,.92); backdrop-filter: blur(12px); box-shadow: 0 4px 24px rgba(15,23,42,.06); padding-block: .6rem; }
.brand-logo { height: 44px; width: auto; display: block; transition: height .3s ease; }
.navbar.scrolled .brand-logo { height: 36px; }
.brand-logo-footer { height: 50px; }
@media (max-width: 575.98px) { .brand-logo { height: 36px; } }
.nav-link { font-weight: 500; color: #475569; }
.nav-link:hover, .nav-link.active { color: var(--bs-primary) !important; }
@media (max-width: 991.98px) {
  .navbar-collapse { background: #fff; border-radius: 1rem; padding: 1rem; margin-top: .75rem; box-shadow: 0 10px 30px rgba(15,23,42,.08); }
}

/* ----- Hero ----- */
.hero {
  padding: 9rem 0 6rem; position: relative; overflow: hidden;
  background:
    radial-gradient(600px 400px at 92% 8%, rgba(224,0,6,.10), transparent 70%),
    radial-gradient(500px 400px at 0% 95%, rgba(79,70,229,.08), transparent 70%),
    linear-gradient(180deg, #f8fafc, #fff);
}
.badge-soft { display: inline-block; padding: .4rem .9rem; border-radius: 50rem; background: rgba(224,0,6,.08); color: var(--bs-primary); font-weight: 600; font-size: .85rem; }
.text-accent { color: var(--bs-primary); }
.hero-points { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; margin-top: 2.5rem; padding: 0; list-style: none; }
.hero-points li { display: flex; align-items: center; gap: .5rem; color: #475569; font-weight: 500; font-size: .95rem; }
.hero-points i { color: var(--bs-primary); }

.hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; max-width: 520px; margin-inline: auto; }
.hero-tile { display: block; background: #fff; border: 1px solid var(--at-border); border-radius: var(--at-radius); padding: 1.5rem; box-shadow: 0 20px 50px rgba(15,23,42,.07); color: inherit; transition: transform .3s, box-shadow .3s, border-color .3s; }
.hero-tile:hover { transform: translateY(-4px); color: inherit; border-color: currentColor; }
.hero-tile:nth-child(2), .hero-tile:nth-child(4) { transform: translateY(1.5rem); }
.hero-tile:nth-child(2):hover, .hero-tile:nth-child(4):hover { transform: translateY(calc(1.5rem - 4px)); }
.hero-tile i { font-size: 1.8rem; display: block; margin-bottom: .75rem; }
.hero-tile strong { display: block; color: #0f172a; }
.hero-tile small { color: #64748b; }
@media (max-width: 575.98px) { .hero-tile { padding: 1.1rem; } .hero-tile:nth-child(n) { transform: none; } }

/* Category colours */
.c-network { color: var(--at-network); }
.c-accessory { color: var(--at-accessory); }
.c-solar { color: var(--at-solar); }
.c-computer { color: var(--at-computer); }
.bg-network { background: #eef2ff; }
.bg-accessory { background: #ecfeff; }
.bg-solar { background: #fef3c7; }
.bg-computer { background: #f1f5f9; }

/* ----- Sections ----- */
.section { padding: 6rem 0; }
.section-eyebrow { display: inline-block; text-transform: uppercase; letter-spacing: .12em; font-size: .8rem; font-weight: 700; color: var(--bs-primary); margin-bottom: .75rem; }
.bg-tint { background: linear-gradient(180deg, var(--at-soft), #fff); }
.bg-tint-solar { background: linear-gradient(180deg, #fffbeb, #fff); }

/* Product line cards */
.line-card { display: flex; flex-direction: column; height: 100%; background: #fff; border: 1px solid var(--at-border); border-radius: var(--at-radius); padding: 1.75rem; color: inherit; transition: transform .3s, box-shadow .3s; }
.line-card:hover { transform: translateY(-6px); box-shadow: 0 20px 40px rgba(15,23,42,.08); color: inherit; }
.line-icon { width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center; font-size: 1.6rem; margin-bottom: 1.25rem; }
.line-card h3 { font-size: 1.2rem; font-weight: 700; }
.line-card p { color: #64748b; font-size: .93rem; }
.line-tags { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1.25rem; padding: 0; list-style: none; }
.line-tags li { font-size: .78rem; font-weight: 600; color: #475569; background: var(--at-soft); border: 1px solid var(--at-border); border-radius: 50rem; padding: .2rem .65rem; }
.link-arrow { margin-top: auto; font-weight: 600; color: var(--bs-primary); }
.link-arrow i { transition: transform .2s; display: inline-block; }
.line-card:hover .link-arrow i, .link-arrow:hover i { transform: translateX(4px); }

/* Services */
.service-item { display: flex; gap: 1rem; height: 100%; padding: 1.5rem; border-radius: var(--at-radius); background: #fff; border: 1px solid var(--at-border); }
.service-item > i { width: 48px; height: 48px; border-radius: 12px; flex-shrink: 0; display: grid; place-items: center; font-size: 1.3rem; background: rgba(224,0,6,.08); color: var(--bs-primary); }
.service-item p { color: #64748b; font-size: .92rem; margin: 0; }

/* Business band */
.biz-band { border-radius: 1.75rem; padding: 3rem; color: #fff; background: linear-gradient(135deg, #111, #2a2a2a); position: relative; overflow: hidden; }
.biz-band::after { content: ""; position: absolute; right: -60px; top: -60px; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(224,0,6,.45), transparent 70%); }
.biz-band .list-check li { color: #e2e8f0; }
.biz-band .list-check li::before { color: #ff5a5f; }
@media (max-width: 575.98px) { .biz-band { padding: 2rem 1.5rem; } }
.list-check { list-style: none; padding: 0; }
.list-check li { position: relative; padding-left: 1.9rem; margin-bottom: .8rem; color: #475569; }
.list-check li::before { content: "\F26B"; font-family: "bootstrap-icons"; position: absolute; left: 0; top: 0; color: var(--bs-primary); font-size: 1.1rem; }

/* Solar calculator */
.calc-wrap { border: 1px solid var(--at-border); border-radius: 1.75rem; overflow: hidden; box-shadow: 0 24px 60px rgba(15,23,42,.08); background: #fff; }
.calc-inputs { padding: 2.5rem; }
.calc-inputs .form-range::-webkit-slider-thumb { background: var(--at-solar); }
.calc-inputs .form-range::-moz-range-thumb { background: var(--at-solar); }
.calc-inputs .form-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 .25rem rgba(245,158,11,.25); }
.calc-inputs .input-group-text { border-radius: .75rem 0 0 .75rem; border-color: var(--at-border); background: #fff; font-weight: 600; min-width: 3rem; justify-content: center; }
.calc-inputs .input-group .form-control { border-radius: 0 .75rem .75rem 0; }
.calc-val { font-weight: 700; color: #b45309; background: #fef3c7; border-radius: 50rem; padding: .1rem .7rem; font-size: .85rem; }
.btn-outline-warning { --bs-btn-color: #b45309; --bs-btn-border-color: #fcd34d; --bs-btn-hover-bg: #fef3c7; --bs-btn-hover-color: #92400e; --bs-btn-hover-border-color: #fcd34d; }
.btn-check:checked + .btn-outline-warning { background: var(--at-solar); border-color: var(--at-solar); color: #fff; }
.calc-results { height: 100%; padding: 2.5rem; color: #fff; background: linear-gradient(150deg, #f59e0b, #ea580c 55%, #c2410c); }
.calc-total { font-size: clamp(2.2rem, 5vw, 3.2rem); font-weight: 800; line-height: 1.1; }
.res-tile { background: rgba(255,255,255,.14); border-radius: 1rem; padding: 1rem; height: 100%; }
.res-tile i { font-size: 1.2rem; opacity: .85; }
.res-num { font-size: 1.25rem; font-weight: 800; margin-top: .25rem; }
.res-tile small { opacity: .9; }
.calc-breakdown { background: rgba(255,255,255,.95); color: #1e293b; border-radius: 1rem; padding: .5rem 1.25rem; }
.calc-breakdown > div { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--at-border); font-size: .92rem; }
.calc-breakdown > div:last-child { border: 0; }
.calc-lifetime strong { color: #15803d; }
@media (max-width: 575.98px) { .calc-inputs, .calc-results { padding: 1.75rem 1.25rem; } }

/* Why us */
.why-item { display: flex; gap: 1rem; padding: 1.25rem; border-radius: 1rem; background: var(--at-soft); height: 100%; }
.why-item i { font-size: 1.4rem; color: var(--bs-primary); flex-shrink: 0; }
.why-item p { color: #64748b; font-size: .9rem; margin: 0; }

/* CTA */
.cta-band { padding: 0 0 2rem; }
.cta-inner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem;
  padding: 3rem; border-radius: 1.75rem; color: #fff;
  background: linear-gradient(120deg, #e00006, #b80005 55%, #111);
  box-shadow: 0 24px 60px rgba(224,0,6,.22);
}
@media (max-width: 575.98px) { .cta-inner { padding: 2rem 1.5rem; } }

/* Contact */
.contact-item { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.25rem; color: inherit; }
a.contact-item:hover .fw-semibold { color: var(--bs-primary); }
.contact-item > i { width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; background: rgba(224,0,6,.08); color: var(--bs-primary); font-size: 1.2rem; flex-shrink: 0; }
.contact-form { background: #fff; border: 1px solid var(--at-border); border-radius: var(--at-radius); padding: 2rem; box-shadow: 0 20px 50px rgba(15,23,42,.05); }
@media (max-width: 575.98px) { .contact-form { padding: 1.5rem 1.25rem; } }
.form-control, .form-select { border-radius: .75rem; padding: .7rem 1rem; border-color: var(--at-border); background-color: var(--at-soft); }
.form-control:focus, .form-select:focus { border-color: var(--bs-primary); box-shadow: 0 0 0 .25rem rgba(224,0,6,.12); background-color: #fff; }
.form-label { font-weight: 600; font-size: .9rem; }
.btn-whatsapp { --bs-btn-bg: #1fa855; --bs-btn-border-color: #1fa855; --bs-btn-color: #fff; --bs-btn-hover-bg: #178a45; --bs-btn-hover-border-color: #178a45; --bs-btn-hover-color: #fff; --bs-btn-active-bg: #12733a; }
.map-frame { width: 100%; height: 260px; border: 0; border-radius: 1rem; background: var(--at-soft); }

/* Footer */
.footer { background: var(--at-soft); padding: 4rem 0 2rem; border-top: 1px solid var(--at-border); }
.footer a { color: #475569; }
.footer a:hover { color: var(--bs-primary); }
.footer-links li { margin-bottom: .5rem; }

/* Back to top */
.back-to-top {
  position: fixed; right: 1.25rem; bottom: 1.25rem; width: 46px; height: 46px; border-radius: 50%;
  display: grid; place-items: center; background: var(--bs-primary); color: #fff; font-size: 1.2rem;
  box-shadow: 0 10px 24px rgba(224,0,6,.35); opacity: 0; visibility: hidden; transition: all .3s; z-index: 1030;
}
.back-to-top.show { opacity: 1; visibility: visible; }
.back-to-top:hover { color: #fff; transform: translateY(-3px); }

/* Reveal animation */
[data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
[data-reveal].revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-reveal] { opacity: 1; transform: none; transition: none; }
}
