/* Otomatik Kapı Tamircisi — sharp industrial theme */
:root{
  --bg-dark:#0A0A0A;
  --bg-dark-2:#141414;
  --bg-light:#FFFFFF;
  --bg-light-2:#F5F5F2;
  --surface:#171717;
  --text-dark:#F8FAFC;
  --text-light:#0A0A0A;
  --muted:#6B7280;
  --border:#1f1f1f;
  --border-light:#e5e5e5;
  --primary:#FF7A00;
  --primary-2:#E06A00;
  --wa:#25D366;
  --accent:#334155;
  --shadow: 0 8px 24px rgba(0,0,0,.35);
  --shadow-lg: 0 24px 48px -12px rgba(0,0,0,.55);
  --radius:2px;
  --container:min(1240px, 92vw);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"IBM Plex Sans",system-ui,-apple-system,Segoe UI,Arial,sans-serif;
  color:var(--text-light);
  background:var(--bg-light);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  line-height:1.6;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none}
h1,h2,h3,h4{font-family:"Outfit",sans-serif;letter-spacing:-.02em;line-height:1.1;margin:0 0 .6em}
h1{font-weight:900;font-size:clamp(2.4rem,4.6vw,4rem)}
h2{font-weight:800;font-size:clamp(1.6rem,2.6vw,2.4rem)}
h3{font-weight:700;font-size:1.25rem}
h4{font-weight:600;font-size:1rem;text-transform:uppercase;letter-spacing:.14em}
p{margin:0 0 1em}
.container{width:var(--container);margin:0 auto}
.eyebrow,.eyebrow-alt{display:inline-flex;align-items:center;gap:.5em;font-family:"Outfit",sans-serif;text-transform:uppercase;letter-spacing:.2em;font-size:.75rem;font-weight:600;color:var(--primary);padding:.4em .8em;border:1px solid rgba(255,122,0,.35);background:rgba(255,122,0,.06)}
.eyebrow-alt{color:var(--accent);border-color:#e2e8f0;background:#fff}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(10,10,10,.92);backdrop-filter:blur(12px);border-bottom:1px solid #1f1f1f;color:var(--text-dark)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:inline-flex;gap:12px;align-items:center;color:#fff}
.brand-icon{width:44px;height:44px;display:grid;place-items:center;background:var(--primary);color:#000;font-size:20px}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-text strong{font-family:"Outfit";font-weight:900;letter-spacing:-.02em;font-size:1rem}
.brand-text em{font-style:normal;font-family:"Outfit";font-weight:500;color:var(--primary);font-size:.85rem;letter-spacing:.1em;text-transform:uppercase}
.site-nav{display:flex;align-items:center;gap:28px}
.site-nav a{color:#e5e5e5;font-weight:500;font-size:.95rem;transition:color .18s ease;position:relative}
.site-nav a:hover,.site-nav a.active{color:#fff}
.site-nav a.active::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--primary)}
.nav-call{background:var(--primary);color:#000 !important;padding:10px 18px;font-weight:700;display:inline-flex;gap:8px;align-items:center;transition:background .18s ease,transform .1s ease}
.nav-call:hover{background:var(--primary-2)}
.nav-call:active{transform:scale(.97)}
.menu-toggle{display:none;flex-direction:column;gap:5px;padding:8px}
.menu-toggle span{width:26px;height:2px;background:#fff}
@media (max-width: 900px){
  .menu-toggle{display:flex}
  .site-nav{position:fixed;inset:64px 0 auto 0;background:#0A0A0A;flex-direction:column;padding:24px;gap:16px;transform:translateY(-120%);transition:transform .3s ease;border-bottom:1px solid #1f1f1f}
  .site-nav.open{transform:translateY(0)}
}

/* Hero */
.hero{position:relative;background:#0A0A0A;color:#fff;overflow:hidden;padding:70px 0 90px}
.hero-bg{position:absolute;inset:0;background:radial-gradient(1200px 400px at 100% -10%, rgba(255,122,0,.25), transparent 60%),radial-gradient(800px 500px at -10% 100%, rgba(51,65,85,.6), transparent 70%),
  linear-gradient(#0a0a0a,#0a0a0a);opacity:1;pointer-events:none;z-index:0}
.hero-bg::after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='4'><rect width='1' height='1' fill='%23ffffff' opacity='0.04'/></svg>");opacity:.5}
.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr 1fr;gap:60px;align-items:center}
.hero-copy .lead{color:#c8c8c8;font-size:1.1rem;max-width:56ch}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 28px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;font-weight:700;font-family:"Outfit";letter-spacing:-.01em;transition:transform .1s ease,background .18s ease,color .18s ease,border-color .18s ease}
.btn--primary{background:var(--primary);color:#000}
.btn--primary:hover{background:var(--primary-2);color:#000}
.btn--wa{background:var(--wa);color:#000}
.btn--wa:hover{background:#1DBB59}
.btn--ghost{background:transparent;color:#fff;border:1px solid #333}
.btn--ghost:hover{border-color:#fff}
.btn--xl{padding:18px 30px;font-size:1.05rem}
.btn:active{transform:scale(.97)}
.hero-stats{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;border-top:1px solid #262626;padding-top:22px}
.hero-stats li{display:flex;flex-direction:column}
.hero-stats strong{font-family:"Outfit";font-size:1.8rem;color:#fff}
.hero-stats span{color:#888;font-size:.8rem;text-transform:uppercase;letter-spacing:.14em}
.hero-visual{position:relative}
.hero-card{position:relative;border:1px solid #262626;box-shadow:var(--shadow-lg);overflow:hidden}
.hero-card img{width:100%;height:520px;object-fit:cover}
.hero-badge{position:absolute;left:16px;bottom:16px;background:rgba(0,0,0,.75);color:#fff;padding:10px 14px;border-left:3px solid var(--primary);font-weight:600;display:inline-flex;gap:8px;align-items:center;backdrop-filter:blur(6px)}
@media (max-width:900px){.hero-inner{grid-template-columns:1fr}.hero-card img{height:340px}.hero-stats{grid-template-columns:repeat(2,1fr)}}

/* Section head */
.section-head{margin:0 0 40px;display:flex;flex-direction:column;gap:12px}
.section-head h2{max-width:36ch}

/* Bento */
.bento{padding:90px 0;background:var(--bg-light)}
.bento-grid{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:180px;gap:16px}
.bento-item{position:relative;overflow:hidden;border:1px solid #eee;background:#111;color:#fff;transition:transform .2s ease,border-color .2s ease}
.bento-item:hover{transform:translateY(-2px);border-color:var(--primary)}
.bento-media{position:absolute;inset:0}
.bento-media img{width:100%;height:100%;object-fit:cover;opacity:.62;transition:opacity .3s ease, transform .5s ease}
.bento-item:hover .bento-media img{opacity:.5;transform:scale(1.06)}
.bento-body{position:relative;padding:20px;display:flex;flex-direction:column;justify-content:flex-end;height:100%;background:linear-gradient(180deg,transparent 30%, rgba(0,0,0,.85))}
.bento-body h3{color:#fff;font-family:"Outfit";font-weight:800;font-size:1.25rem;margin:0 0 8px}
.bento-cta{display:inline-flex;align-items:center;gap:8px;color:var(--primary);font-weight:600;font-size:.9rem;text-transform:uppercase;letter-spacing:.14em}
/* Bento tetris pattern */
.bento-item--1{grid-column:span 3;grid-row:span 2}
.bento-item--2{grid-column:span 3;grid-row:span 1}
.bento-item--3{grid-column:span 2;grid-row:span 1}
.bento-item--4{grid-column:span 1;grid-row:span 1}
.bento-item--5{grid-column:span 2;grid-row:span 2}
.bento-item--6{grid-column:span 2;grid-row:span 1}
.bento-item--7{grid-column:span 2;grid-row:span 1}
.bento-item--8{grid-column:span 2;grid-row:span 2}
.bento-item--9{grid-column:span 2;grid-row:span 1}
.bento-item--10{grid-column:span 2;grid-row:span 1}
@media (max-width:900px){
  .bento-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:160px}
  .bento-item{grid-column:span 1 !important;grid-row:span 1 !important}
}

/* Stripe */
.stripe{background:#0A0A0A;color:#fff;padding:70px 0}
.stripe-inner{display:grid;grid-template-columns:1fr 1.5fr;gap:60px;align-items:center}
.stripe h2{color:#fff}
.stripe p{color:#c8c8c8;max-width:38ch}
.feature-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.feature-list li{display:flex;gap:16px;padding:20px;border:1px solid #262626}
.feature-list i{color:var(--primary);font-size:22px;margin-top:2px}
.feature-list strong{display:block;color:#fff;font-family:"Outfit";font-weight:700}
.feature-list span{color:#a3a3a3;font-size:.9rem}
@media (max-width:900px){.stripe-inner{grid-template-columns:1fr}.feature-list{grid-template-columns:1fr}}

/* Regions */
.regions{background:#F5F5F2;padding:90px 0}
.regions-grid{display:flex;flex-wrap:wrap;gap:8px}
.region{padding:8px 14px;background:#fff;border:1px solid var(--border-light);font-size:.9rem;color:#333;font-weight:500}
.region i{color:var(--primary);margin-right:6px}

/* CTA band */
.cta-band{background:linear-gradient(90deg,var(--primary),#ff9640);padding:70px 0;color:#000}
.cta-band-inner{display:flex;justify-content:space-between;align-items:center;gap:40px;flex-wrap:wrap}
.cta-band h2{color:#000;font-weight:900}
.cta-band-actions{display:flex;gap:12px;flex-wrap:wrap}
.cta-band .btn--primary{background:#000;color:#fff}
.cta-band .btn--primary:hover{background:#171717}
.cta-band .btn--wa{background:#000;color:#fff}
.cta-band .btn--wa:hover{background:#171717}

/* Page hero */
.page-hero{background:#0A0A0A;color:#fff;padding:60px 0}
.page-hero h1{color:#fff;margin-top:12px}
.page-hero p{color:#c8c8c8;max-width:60ch}

/* Services list */
.services-list{padding:80px 0;background:#fff}
.services-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.service-card{background:#fff;border:1px solid var(--border-light);overflow:hidden;color:#111;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.service-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#000}
.service-card-media img{width:100%;height:180px;object-fit:cover}
.service-card-body{padding:20px}
.service-card-body h3{font-family:"Outfit";font-weight:800;margin:0 0 10px}
.service-card-body p{font-size:.92rem;color:#525252}
.link-arrow{display:inline-flex;gap:8px;color:var(--primary);font-weight:700;font-size:.9rem;text-transform:uppercase;letter-spacing:.14em}

/* Service page */
.service-hero{background:#0A0A0A;color:#fff;padding:60px 0 50px}
.service-hero h1{color:#fff}
.crumbs{color:#a3a3a3;font-size:.85rem;margin-bottom:12px}
.crumbs a{color:#a3a3a3}
.crumbs em{color:#fff;font-style:normal}
.crumbs span{margin:0 6px;color:#525252}
.service-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}
.service-body{padding:70px 0;background:#fff}
.service-grid{display:grid;grid-template-columns:2fr 1fr;gap:60px;align-items:flex-start}
.service-article{max-width:100%}
.service-figure{margin:0 0 30px;border:1px solid var(--border-light)}
.service-figure img{width:100%;height:380px;object-fit:cover}
.service-article .lead{font-size:1.15rem;color:#171717;border-left:3px solid var(--primary);padding-left:16px}
.service-article h2{margin-top:36px}
.service-article a:not(.btn){color:var(--primary);text-decoration:underline;font-weight:600}
.service-article .btn{text-decoration:none}
.service-article .btn--primary{color:#000 !important}
.service-article .btn--wa{color:#000 !important}
.internal-links{margin-top:40px;background:#F5F5F2;padding:24px;border-left:3px solid var(--primary)}
.internal-links ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.internal-links li a{display:inline-flex;gap:8px;font-weight:500;color:#171717;text-decoration:none;font-size:.95rem}
.internal-links li a:hover{color:var(--primary)}
@media (max-width:900px){.internal-links ul{grid-template-columns:1fr}}

.service-cta{margin-top:40px;padding:28px;background:#0A0A0A;color:#fff;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center;border-left:3px solid var(--primary)}
.service-cta h3{color:#fff}
.service-cta p{color:#c8c8c8;margin:0}
.service-cta-actions{display:flex;gap:12px;flex-wrap:wrap}

/* FAQ */
.faq{margin-top:44px}
.faq-list{display:flex;flex-direction:column;gap:8px}
.faq-item{background:#F5F5F2;border-left:3px solid transparent;transition:border-color .2s ease}
.faq-item[open]{border-left-color:var(--primary);background:#fff;border:1px solid #eee;border-left:3px solid var(--primary)}
.faq-item summary{cursor:pointer;list-style:none;padding:18px 20px;font-weight:600;font-family:"Outfit";display:flex;gap:12px;align-items:center;justify-content:space-between}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary i.fa-circle-question{color:var(--primary)}
.chev{margin-left:auto;transition:transform .2s ease}
.faq-item[open] .chev{transform:rotate(180deg)}
.faq-answer{padding:0 20px 20px 46px;color:#404040}

/* Sidebar */
.side{position:sticky;top:90px;display:flex;flex-direction:column;gap:20px}
.side-block{padding:22px;border:1px solid var(--border-light);background:#fff}
.side-block h4{margin:0 0 12px;color:#0A0A0A}
.side-block--dark{background:#0A0A0A;color:#fff;border-color:#0A0A0A}
.side-block--dark h4{color:#fff}
.side-block--dark p{color:#c8c8c8;font-size:.9rem}
.side-call,.side-wa{display:flex;gap:10px;align-items:center;padding:12px 14px;font-weight:700;margin-top:8px}
.side-call{background:var(--primary);color:#000}
.side-wa{background:var(--wa);color:#000}
.side-list{list-style:none;padding:0;margin:0}
.side-list li a{display:flex;align-items:center;gap:8px;padding:10px 0;color:#333;font-size:.95rem;border-bottom:1px solid #f1f1f1}
.side-list li:last-child a{border-bottom:0}
.side-list li a:hover{color:var(--primary)}
.side-list li a i{color:var(--primary);font-size:.75rem}
.side-list li a.is-current{color:var(--primary);font-weight:700}
.side-block--soft{background:#F5F5F2;border-color:transparent}
.side-chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{background:#fff;padding:4px 10px;font-size:.8rem;border:1px solid #e5e5e5}
.chip--muted{background:transparent;color:#525252}
@media (max-width:900px){.service-grid{grid-template-columns:1fr}.side{position:static}}

/* Contact */
.contact-body{padding:70px 0;background:#F5F5F2}
.contact-grid{display:grid;grid-template-columns:1fr 1.35fr;gap:40px;align-items:flex-start}
.contact-info{display:flex;flex-direction:column;gap:12px}
.contact-block{background:#fff;padding:20px;display:flex;gap:16px;align-items:center;color:#171717;border-left:3px solid var(--primary);transition:transform .15s ease}
.contact-block:hover{transform:translateX(4px)}
.contact-block i{color:var(--primary);font-size:22px;width:32px;text-align:center}
.contact-block--wa{border-left-color:var(--wa)}
.contact-block--wa i{color:var(--wa)}
.contact-block--muted{border-left-color:#a3a3a3}
.contact-block--muted i{color:#525252}
.contact-block strong{display:block;font-family:"Outfit";font-weight:700}
.contact-block span{color:#525252;font-size:.9rem}
.contact-form{background:#fff;padding:30px}
.contact-form h2{margin-bottom:20px}
.field{margin-bottom:16px;display:flex;flex-direction:column;gap:6px}
.field label{font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;color:#404040}
.field input,.field textarea{padding:12px 14px;border:1px solid #e5e5e5;background:#fff;font-family:inherit;font-size:.95rem;transition:border-color .15s ease,box-shadow .15s ease}
.field input:focus,.field textarea:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,122,0,.15)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-status{margin-top:16px;font-weight:600}
.form-status.ok{color:#059669}
.form-status.err{color:#dc2626}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}.grid2{grid-template-columns:1fr}}

/* Footer */
.site-footer{background:#0A0A0A;color:#c8c8c8;padding:70px 0 20px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1.4fr 1fr;gap:40px}
.brand--footer{color:#fff;margin-bottom:16px}
.footer-col p{color:#a3a3a3;font-size:.9rem}
.footer-col h4{color:#fff;font-family:"Outfit"}
.footer-col ul{list-style:none;padding:0;margin:0}
.footer-col li{margin-bottom:8px}
.footer-col li a{font-size:.9rem;color:#c8c8c8}
.footer-col li a:hover{color:var(--primary)}
.districts{display:flex;flex-wrap:wrap;gap:6px}
.district{font-size:.78rem;color:#a3a3a3;padding:3px 8px;background:#171717;border:1px solid #262626}
.footer-call,.footer-wa{display:inline-flex;gap:8px;align-items:center;font-weight:700;padding:10px 14px;margin-top:4px}
.footer-call{background:var(--primary);color:#000}
.footer-wa{background:var(--wa);color:#000}
.footer-bottom{margin-top:60px;padding-top:20px;border-top:1px solid #262626;display:flex;justify-content:space-between;gap:12px;font-size:.85rem;color:#7a7a7a;flex-wrap:wrap}
.admin-link{color:#525252}
.admin-link:hover{color:#fff}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.footer-grid{grid-template-columns:1fr}}

/* Floating CTA */
.floating-cta{position:fixed;right:20px;bottom:20px;z-index:60;display:flex;flex-direction:column;gap:12px}
.cta{display:inline-flex;align-items:center;gap:10px;padding:14px 20px;font-weight:700;font-family:"Outfit";box-shadow:var(--shadow-lg);position:relative;transition:transform .12s ease}
.cta--wa{background:var(--wa);color:#000}
.cta--call{background:var(--primary);color:#000}
.cta:hover{transform:translateY(-2px)}
.cta:active{transform:scale(.96)}
.pulse-ring{position:absolute;inset:0;border:2px solid var(--primary);animation:pulse 1.6s ease-out infinite;pointer-events:none;opacity:0}
.pulse-ring--2{animation-delay:.8s}
@keyframes pulse{
  0%{transform:scale(1);opacity:.65}
  100%{transform:scale(1.6);opacity:0}
}
@media (max-width:600px){
  .cta span:not(.pulse-ring){display:none}
  .cta{padding:14px 16px;font-size:1rem}
}

/* Admin */
.admin-wrap{min-height:100vh;background:#0A0A0A;color:#f5f5f5;font-family:"IBM Plex Sans",sans-serif}
.admin-shell{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
.admin-sidebar{background:#0A0A0A;border-right:1px solid #1f1f1f;padding:24px 16px}
.admin-sidebar .logo{color:#fff;font-family:"Outfit";font-weight:900;font-size:1.2rem;margin-bottom:24px;display:flex;gap:10px;align-items:center}
.admin-sidebar .logo i{color:var(--primary)}
.admin-nav{display:flex;flex-direction:column;gap:4px}
.admin-nav a{display:flex;gap:10px;align-items:center;padding:10px 12px;color:#a3a3a3;font-size:.95rem;border-left:2px solid transparent;transition:all .15s ease}
.admin-nav a i{width:16px;text-align:center}
.admin-nav a:hover,.admin-nav a.active{color:#fff;border-left-color:var(--primary);background:#141414}
.admin-main{padding:32px;background:#0e0e0e}
.admin-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}
.admin-topbar h1{font-size:1.5rem;color:#fff;margin:0}
.admin-topbar .logout{color:#a3a3a3}
.admin-topbar .logout:hover{color:var(--primary)}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:32px}
.stat{background:#141414;border:1px solid #262626;padding:20px}
.stat span{color:#a3a3a3;font-size:.8rem;text-transform:uppercase;letter-spacing:.14em}
.stat strong{display:block;color:#fff;font-family:"Outfit";font-size:2rem;margin-top:8px}
.stat.up strong{color:var(--primary)}
.stat.wa strong{color:var(--wa)}
.admin-card{background:#141414;border:1px solid #262626;padding:24px;margin-bottom:24px}
.admin-card h2{color:#fff;margin:0 0 16px;font-size:1.15rem}
.admin-card p{color:#a3a3a3;font-size:.9rem}
.admin-card label{display:block;margin-bottom:6px;font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;color:#c8c8c8}
.admin-card textarea,.admin-card input{width:100%;background:#0a0a0a;color:#f5f5f5;border:1px solid #333;padding:12px 14px;font-family:"JetBrains Mono",Menlo,monospace;font-size:.85rem}
.admin-card textarea:focus,.admin-card input:focus{outline:0;border-color:var(--primary)}
.admin-btn{background:var(--primary);color:#000;padding:12px 22px;font-weight:700;font-family:"Outfit";cursor:pointer;border:0;margin-top:12px}
.admin-btn:hover{background:var(--primary-2)}
.admin-btn--secondary{background:#262626;color:#fff}
.admin-notice{background:#141414;border-left:3px solid var(--primary);padding:14px 16px;color:#c8c8c8;font-size:.9rem;margin-bottom:20px;font-family:"JetBrains Mono",Menlo,monospace}
.admin-notice code{background:#0a0a0a;padding:2px 6px;color:var(--primary)}
.data-table{width:100%;border-collapse:collapse;font-size:.9rem}
.data-table th,.data-table td{padding:12px 14px;text-align:left;border-bottom:1px solid #262626;color:#c8c8c8}
.data-table th{color:#fff;font-family:"Outfit";font-weight:700;text-transform:uppercase;font-size:.75rem;letter-spacing:.14em;background:#0a0a0a}
.data-table tr:hover td{background:#181818}
.badge{padding:3px 8px;font-size:.75rem;font-weight:700}
.badge--call{background:rgba(255,122,0,.15);color:var(--primary)}
.badge--wa{background:rgba(37,211,102,.15);color:var(--wa)}
.badge--new{background:rgba(255,122,0,.15);color:var(--primary)}
.badge--read{background:#262626;color:#a3a3a3}
.chart-wrap{position:relative;height:260px;padding:12px 0}
.chart-bar{display:inline-block;background:linear-gradient(180deg,var(--primary),#c85800);width:100%;border-top:2px solid #fff}
.chart-bar.wa{background:linear-gradient(180deg,var(--wa),#1a9d4b)}
.range-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.range-filter a{padding:8px 14px;background:#141414;color:#a3a3a3;border:1px solid #262626;font-size:.85rem}
.range-filter a.active{background:var(--primary);color:#000;border-color:var(--primary);font-weight:700}
.range-filter form{display:inline-flex;gap:6px;margin-left:auto}
.range-filter input{padding:6px 10px;background:#0a0a0a;color:#f5f5f5;border:1px solid #333;font-size:.85rem}
.login-page{min-height:100vh;background:#0A0A0A;color:#fff;display:grid;place-items:center;padding:20px}
.login-card{background:#141414;border:1px solid #262626;padding:36px;width:100%;max-width:400px}
.login-card h1{color:#fff;font-size:1.5rem;margin:0 0 6px}
.login-card p{color:#a3a3a3;font-size:.9rem;margin-bottom:20px}
.login-card .field label{color:#c8c8c8}
.login-card .field input{background:#0a0a0a;color:#fff;border:1px solid #333}
.login-error{color:#fca5a5;background:rgba(220,38,38,.15);padding:10px 12px;margin-bottom:16px;font-size:.9rem}

@media (max-width:800px){
  .admin-shell{grid-template-columns:1fr}
  .admin-sidebar{position:sticky;top:0;z-index:10}
  .admin-nav{flex-direction:row;overflow-x:auto}
  .stat-grid{grid-template-columns:repeat(2,1fr)}
}