/*
Theme Name: A One Crackers
Theme URI: https://example.com
Author: A One Crackers
Description: Custom theme for A One Crackers, a Sivakasi fireworks price-list & estimate site. Colours are edited via CSS variables at the top of this file.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: aone-crackers
*/

:root{
  /* ---- BRAND COLOURS (edit these) ---- */
  --ink:        #15111a;
  --ink-soft:   #241d29;
  --maroon:     #EDE8D0;
  --maroon-deep:#5c1424;
  --gold:       #d9a441;
  --gold-light: #f0ce8b;
  --emerald:    #1f6f54;
  --paper:      #fbf3e4;
  --paper-line: #e7dcc4;
  --ink-text:   #241b1d;
  --ink-muted:  #6d6058;

  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Inter", Arial, sans-serif;
  --wrap: 1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);color:var(--ink-text);background:var(--paper);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}

.topbar{background:var(--ink);color:#c9c0cd;font-size:13px}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;padding-top:8px;padding-bottom:8px;gap:16px;flex-wrap:wrap}
.topbar a{color:var(--gold-light)}
.topbar .phones{display:flex;gap:18px;flex-wrap:wrap}
.topbar .phones span{color:#8f8695;margin-right:6px}

header.site{background:var(--ink);border-bottom:1px solid #2c2432}
.nav{display:flex;align-items:center;justify-content:space-between;padding:16px 0;gap:24px}
.brand{display:flex;align-items:baseline;gap:10px}
.brand .mark{font-family:var(--font-display);font-weight:600;font-size:26px;color:#fff}
.brand .tag{font-size:12px;color:var(--gold-light)}
nav.links{display:flex;gap:28px;font-size:14px}
nav.links ul{list-style:none;display:flex;gap:28px;margin:0;padding:0}
nav.links a{color:#d8d1dd;padding:6px 0;border-bottom:2px solid transparent}
nav.links a:hover,nav.links .current-menu-item a{color:#fff;border-bottom-color:var(--gold)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:3px;font-weight:600;font-size:14px;border:1px solid transparent;cursor:pointer}
.btn-gold{background:var(--gold);color:var(--ink)}
.btn-gold:hover{background:var(--gold-light);color:var(--ink)}
.btn-outline{border-color:#4a3f52;color:#f2eef4}

/* ---------- cart badge (in nav / footer) ---------- */
.cart-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:18px;height:18px;padding:0 5px;margin-left:6px;
  background:var(--gold);color:var(--ink);
  border-radius:9px;font-size:11px;font-weight:700;
  vertical-align:middle;
}
.cart-badge[data-zero="true"]{background:#4a3f52;color:#c9c0cd}

.hero{position:relative;overflow:hidden;background:radial-gradient(120% 140% at 82% 20%, var(--maroon-deep) 0%, var(--ink) 60%);color:#f5f1f7}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;padding-top:76px;padding-bottom:84px;align-items:center}
.hero h1{font-family:var(--font-display);font-size:clamp(34px,4.4vw,54px);line-height:1.06;margin:0 0 20px;font-weight:600;max-width:16ch}
.hero p{font-size:17px;line-height:1.6;color:#cfc4d4;max-width:46ch;margin:0 0 28px}
.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap}
.hero .stats{display:flex;gap:32px;margin-top:44px;flex-wrap:wrap}
.hero .stats div b{display:block;font-family:var(--font-display);font-size:26px;color:var(--gold-light)}
.hero .stats div span{font-size:12.5px;color:#a99cb0}
.spark-art{aspect-ratio:1/1;max-width:420px;justify-self:end}

.section{padding:64px 0}
.section h2{font-family:var(--font-display);font-weight:600;font-size:30px;margin:0 0 6px;color:var(--ink-text)}
.section .lede{color:var(--ink-muted);max-width:58ch;margin:0 0 34px;font-size:15px}
.cat-rail{display:grid;grid-auto-flow:column;grid-auto-columns:200px;gap:16px;overflow-x:auto;padding-bottom:14px}
.cat-card{border-top:3px solid var(--maroon);background:#fff;padding:20px 18px;min-height:126px;display:flex;flex-direction:column;justify-content:space-between}
.cat-card .name{font-weight:700;font-size:15px;line-height:1.3}
.cat-card .count{font-size:12.5px;color:var(--ink-muted)}

.steps{background:var(--ink);color:#f0ebf2}
.steps .wrap{padding:60px 24px;display:grid;grid-template-columns:repeat(3,1fr);gap:36px}
.step .num{font-family:var(--font-display);font-size:34px;color:var(--gold);border-bottom:1px solid #3a3040;padding-bottom:14px;margin-bottom:14px}
.step h3{margin:0 0 8px;font-size:17px}
.step p{margin:0;color:#b6acbb;font-size:14.5px;line-height:1.55}

.cta-band{background:linear-gradient(100deg,var(--maroon) 0%,var(--maroon-deep) 100%);color:#fff}
.cta-band .wrap{padding:52px 24px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.cta-band h2{font-family:var(--font-display);margin:0 0 6px;font-size:26px}
.cta-band p{margin:0;color:#f0d9de;max-width:46ch}

footer.site{background:var(--ink);color:#c9c0cd;font-size:14px}
footer.site .wrap{padding:56px 24px 28px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:36px}
footer.site h4{color:#fff;font-size:14px;margin:0 0 14px;font-weight:600}
footer.site ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.legal-note{border-top:1px solid #2c2432;padding:22px 24px;font-size:12.5px;color:#8f8695;line-height:1.6}
.legal-note .wrap{padding:0}

.page-header{background:var(--ink);color:#fff;padding:48px 0}
.page-header h1{font-family:var(--font-display);font-size:34px;margin:0 0 8px}
.page-header p{color:#c9bccd;margin:0}
.prose{max-width:70ch}
.prose h2{font-family:var(--font-display);font-size:22px;margin:34px 0 10px}
.prose p{line-height:1.7;color:var(--ink-text)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.info-card{background:#fff;border-top:3px solid var(--gold);padding:24px}

/* ---- Price-list / estimate tool ---- */
.tool-header{background:var(--ink);color:#fff;padding:20px 24px}
.tool-header .header{max-width:1400px;margin:auto;display:flex;justify-content:space-between;gap:20px;align-items:center}
.tool-header h1{font-family:var(--font-display);font-size:22px;margin:0;font-weight:600}
.tool-muted{color:#c9c0cd;font-size:13px}
.tool-container{max-width:1400px;margin:20px auto;padding:0 16px}
.tool-card{background:#fff;border:1px solid #e5ddd0;border-radius:4px;padding:18px;box-shadow:0 2px 10px rgba(0,0,0,.03);margin-bottom:16px}
.tool-controls{display:grid;grid-template-columns:1fr 180px 180px;gap:12px}
.tool-container input,.tool-container button{font:inherit}
.tool-container input[type=text],.tool-container input[type=number],.tool-container input[type=date]{width:100%;padding:10px 11px;border:1px solid #ccd1d9;border-radius:4px;background:#fff}
.tool-container button{border:0;border-radius:4px;padding:10px 15px;cursor:pointer;font-weight:600}
.tool-primary{background:var(--maroon);color:#fff}
.tool-secondary{background:#eef0f4;color:#20242a}
.tool-table-wrap{max-height:620px;overflow:auto;border:1px solid #e1e4e9;border-radius:4px}
.tool-container table{width:100%;border-collapse:collapse;font-size:14px}
.tool-container th,.tool-container td{padding:10px 9px;border-bottom:1px solid #eceef1;text-align:left}
.tool-container th{background:#f8f9fb;position:sticky;top:0;z-index:2;font-size:12px;text-transform:uppercase;color:#606873}
.tool-container td.num,.tool-container th.num{text-align:right}
.tool-container td.center,.tool-container th.center{text-align:center}
.tool-category-row td{background:#f0f2f5;font-weight:700;color:#343a43;padding:8px 9px}
.tool-qty{width:85px!important;text-align:center}
.tool-selected{background:#fbf3e4}
.tool-customer{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tool-totals{margin-left:auto;max-width:360px}
.tool-line{display:flex;justify-content:space-between;padding:7px 0}
.tool-grand{font-size:20px;font-weight:800;border-top:2px solid #20242a;margin-top:6px;padding-top:12px}
.tool-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.tool-small{font-size:12px;color:#707780}
.tool-invoice-preview{display:none}
.tool-danger{background:#fff;color:#8a1f35;border:1px solid #e2b9c1!important}
.tool-empty-cart{padding:40px 20px;text-align:center;color:var(--ink-muted)}
.tool-empty-cart .btn{margin-top:16px}

@media(max-width:880px){
  .hero .wrap{grid-template-columns:1fr;padding-top:48px;padding-bottom:48px}
  .spark-art{justify-self:start;max-width:280px}
  .steps .wrap{grid-template-columns:1fr}
  footer.site .wrap{grid-template-columns:1fr 1fr}
  .contact-grid{grid-template-columns:1fr}
  nav.links{display:none}
}
@media(max-width:800px){.tool-controls,.tool-customer{grid-template-columns:1fr}.tool-table-wrap{max-height:none}}
@media print{
  body *{visibility:hidden}
  .tool-invoice-preview,.tool-invoice-preview *{visibility:visible}
  .tool-invoice-preview{display:block;position:absolute;left:0;top:0;width:100%}
}
