
:root{
  --red:#df0d16;
  --red-dark:#b80008;
  --ink:#151515;
  --muted:#555;
  --line:#e6e6e6;
  --soft:#fafafa;
  --white:#fff;
  --shadow:0 18px 42px rgba(0,0,0,.11);
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.5}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(1440px,calc(100% - 84px));margin:auto}
.topbar{height:36px;background:#f7f7f7;border-bottom:1px solid #ddd;font-size:13px}
.topbar .container{height:100%;display:flex;align-items:center;justify-content:space-between}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:22px;white-space:nowrap}
.navbar{height:100px;background:#fff;border-bottom:1px solid #ddd;position:sticky;top:0;z-index:99}
.navbar .container{height:100%;display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo{width:282px}
.nav-links{display:flex;align-items:center;gap:32px;text-transform:uppercase;font-size:14px;font-weight:900}
.nav-links a{position:relative;padding:39px 0}
.nav-links a:after{content:"";position:absolute;left:0;bottom:28px;width:0;height:3px;background:var(--red);transition:.2s}
.nav-links a:hover:after,.nav-links a.active:after{width:100%}
.nav-cta,.cart-link{background:var(--red);color:#fff;padding:15px 22px;border-radius:3px;font-weight:900;text-transform:uppercase}
.cart-link{background:#111}
.mobile-toggle{display:none;background:none;border:0;font-size:30px}
.hero{
  position:relative;min-height:442px;overflow:hidden;
  background-image:linear-gradient(90deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.94) 29%, rgba(255,255,255,.47) 45%, rgba(255,255,255,.05) 66%),url("../images/hero-clean.jpg");
  background-repeat:no-repeat;background-size:cover;background-position:center center;border-bottom:1px solid #dedede;
}
.hero .container{min-height:442px;display:flex;align-items:center;position:relative}
.hero-content{width:min(530px,100%);padding-top:10px}
.eyebrow{display:flex;align-items:center;gap:12px;color:var(--red);font-size:14px;font-weight:900;text-transform:uppercase;margin-bottom:24px}
.eyebrow:before{content:"";width:25px;height:2px;background:var(--red)}
.hero h1{margin:0 0 21px;font-size:71px;line-height:.9;font-style:italic;font-weight:1000;text-transform:uppercase;letter-spacing:-2px}
.hero h1 span{display:block;color:var(--red)}
.hero p{margin:0 0 30px;font-size:18px;max-width:430px;color:#222}
.hero-actions{display:flex;gap:25px}
.btn{height:47px;min-width:195px;border:2px solid var(--red);border-radius:3px;display:inline-flex;align-items:center;justify-content:center;gap:14px;text-transform:uppercase;font-weight:900;font-size:14px;color:var(--red);transition:.2s;background:#fff;cursor:pointer}
.btn-red{background:var(--red);color:#fff;box-shadow:0 14px 25px rgba(223,13,22,.18)}
.btn:hover{transform:translateY(-2px);box-shadow:0 18px 30px rgba(0,0,0,.13)}
.features{background:#fff;border-bottom:1px solid var(--line)}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);align-items:center;min-height:102px}
.feature{display:flex;align-items:center;gap:17px;padding:0 28px;border-right:1px solid var(--line)}
.feature:last-child{border-right:0}
.feature-icon{font-size:42px;line-height:1;color:var(--red)}
.feature h3{margin:0;text-transform:uppercase;font-size:14px;font-weight:1000;line-height:1.2}
.feature p{margin:4px 0 0;font-size:14px;line-height:1.35;color:#333}
.section{padding:34px 0 56px;background:linear-gradient(#fff,#fbfbfb)}
.section-head{text-align:center;margin-bottom:25px}
.section-head h2{margin:0;text-transform:uppercase;font-size:30px;line-height:1;font-weight:1000}
.section-head:after{content:"";display:block;width:50px;height:2px;background:var(--red);margin:13px auto 0}
.category-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:26px}
.category-card{background:#fff;border-radius:6px;overflow:hidden;box-shadow:var(--shadow);transition:.22s;min-height:252px}
.category-card:hover{transform:translateY(-7px)}
.card-image{height:120px;background-size:cover;background-position:center;position:relative}
.icon-block{position:absolute;left:10px;bottom:-24px;width:52px;height:48px;background:var(--red);color:#fff;border-radius:5px 5px 0 0;display:grid;place-items:center;font-size:24px}
.category-content{padding:30px 18px 18px}
.category-content h3{margin:0 0 6px;text-transform:uppercase;font-size:16px;font-weight:1000}
.category-content p{margin:0 0 14px;color:#333;font-size:14px;line-height:1.45}
.view-link{color:var(--red);font-weight:1000;text-transform:uppercase;font-size:14px}
.view-link span{font-size:20px;margin-left:8px;vertical-align:-2px}
.page-hero{min-height:250px;display:flex;align-items:center;background-image:linear-gradient(90deg, rgba(255,255,255,.98), rgba(255,255,255,.82), rgba(255,255,255,.2)),url("../images/hero-clean.jpg");background-size:cover;background-position:center;border-bottom:1px solid var(--line)}
.page-hero h1{margin:0;font-size:58px;line-height:.95;font-style:italic;text-transform:uppercase;font-weight:1000}
.page-hero span{color:var(--red)}
.page-content{padding:50px 0 70px}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.info-card{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);padding:30px}
.info-card h3{margin:0 0 10px;text-transform:uppercase}
.info-card p{margin:0;color:var(--muted)}
.shop-section{padding:48px 0 72px;background:linear-gradient(#fff,#fbfbfb)}
.shop-layout{display:grid;grid-template-columns:260px 1fr;gap:32px;align-items:start}
.filters{position:sticky;top:120px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 28px rgba(0,0,0,.06);border-radius:8px;padding:20px}
.filters h3{margin:0 0 15px;text-transform:uppercase}
.filter-btn{width:100%;text-align:left;border:1px solid var(--line);background:#fff;margin:0 0 8px;padding:12px;border-radius:5px;font-weight:900;cursor:pointer;text-transform:uppercase}
.filter-btn.active,.filter-btn:hover{border-color:var(--red);color:var(--red)}
.shop-top{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}
.shop-top h2{margin:0 0 6px;font-size:32px;line-height:1;text-transform:uppercase;font-weight:1000}
.shop-top p{margin:0;color:var(--muted)}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.product-card{background:#fff;border-radius:8px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);transition:.22s ease}
.product-card:hover{transform:translateY(-7px)}
.product-image{height:210px;background-size:cover;background-position:center}
.product-body{padding:22px}
.tag{display:inline-block;background:rgba(223,13,22,.09);color:var(--red);padding:6px 10px;border-radius:999px;font-size:12px;font-weight:900;text-transform:uppercase;margin-bottom:12px}
.product-body h3{margin:0 0 8px;text-transform:uppercase;font-size:20px;line-height:1.1}
.product-body p{margin:0 0 18px;color:#333}
.product-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:16px;gap:14px}
.product-bottom strong{font-size:20px}
.add-cart{border:0;background:var(--red);color:#fff;padding:11px 13px;border-radius:4px;text-transform:uppercase;font-weight:900;cursor:pointer}
.add-cart:hover{background:var(--red-dark)}
.cart-table{width:100%;border-collapse:collapse;background:#fff;box-shadow:var(--shadow);border-radius:8px;overflow:hidden}
.cart-table th,.cart-table td{padding:16px;border-bottom:1px solid var(--line);text-align:left}
.cart-table th{text-transform:uppercase;font-size:13px;background:#f7f7f7}
.qty-btn{border:1px solid var(--line);background:#fff;width:30px;height:30px;border-radius:4px;cursor:pointer}
.remove-btn{border:0;background:#111;color:#fff;padding:8px 10px;border-radius:4px;cursor:pointer}
.cart-summary{margin-top:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:8px;padding:24px;max-width:420px;margin-left:auto}
.cart-summary h3{margin:0 0 12px;text-transform:uppercase}
.summary-row{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:10px 0}
.checkout-note{background:#fff3f3;border:1px solid #ffd4d4;color:#7b0000;padding:14px;border-radius:6px;margin-top:16px}
.form{display:grid;gap:15px;max-width:760px}
.form input,.form textarea,.form select{width:100%;padding:15px;border:1px solid #ddd;border-radius:4px;font:inherit}
.form textarea{min-height:145px}
.footer{background:#f6f6f6;border-top:1px solid var(--line);padding:35px 0}
.footer .container{display:flex;align-items:center;justify-content:space-between;gap:20px}
.footer-logo{width:230px}
.toast{position:fixed;right:22px;bottom:22px;background:#111;color:#fff;padding:14px 18px;border-radius:6px;box-shadow:var(--shadow);opacity:0;transform:translateY(15px);transition:.25s;z-index:999}
.toast.show{opacity:1;transform:translateY(0)}
@media(max-width:1200px){
  .container{width:min(100% - 44px,1100px)}
  .category-grid{grid-template-columns:repeat(3,1fr)}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .feature{min-height:100px}
  .logo{width:235px}
  .nav-links{gap:16px}
  .product-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
  .topbar{display:none}
  .navbar{height:auto;padding:13px 0}
  .mobile-toggle{display:block}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;align-items:flex-start;padding:18px 24px;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
  .nav-links.open{display:flex}
  .nav-links a{padding:8px 0}
  .nav-links a:after{bottom:0}
  .nav-cta{display:none}
  .hero{min-height:560px;background-image:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.88),rgba(255,255,255,.15)),url("../images/hero-clean.jpg");background-position:center bottom}
  .hero .container{min-height:560px;align-items:flex-start;padding-top:55px}
  .hero h1{font-size:52px}
  .hero-actions{flex-direction:column;align-items:flex-start;gap:12px}
  .feature-grid,.category-grid,.info-grid,.shop-layout,.product-grid{grid-template-columns:1fr}
  .feature{border-right:0;border-bottom:1px solid var(--line);padding:22px 0}
  .filters{position:static}
  .shop-top{flex-direction:column;align-items:flex-start}
  .cart-table{font-size:14px}
  .footer .container{flex-direction:column;text-align:center}
}


/* Consultation unavailable / build slot taken */
.status-panel{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  border-radius:10px;
  overflow:hidden;
  max-width:1050px;
  margin:auto;
}
.status-banner{
  background:linear-gradient(135deg,#111,#333);
  color:#fff;
  padding:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.status-banner h2{
  margin:0;
  text-transform:uppercase;
  font-size:34px;
  font-style:italic;
  line-height:1;
}
.status-badge{
  background:var(--red);
  color:#fff;
  padding:12px 18px;
  border-radius:999px;
  font-weight:1000;
  text-transform:uppercase;
  white-space:nowrap;
}
.status-body{
  padding:34px;
  display:grid;
  grid-template-columns:1.3fr .7fr;
  gap:28px;
}
.status-body h3{
  margin:0 0 10px;
  text-transform:uppercase;
}
.status-body p{
  color:#333;
  margin:0 0 14px;
}
.status-list{
  margin:0;
  padding-left:20px;
  color:#333;
}
.waitlist-box{
  background:#fafafa;
  border:1px solid var(--line);
  border-radius:8px;
  padding:22px;
}
.product-card.disabled{
  opacity:.72;
  position:relative;
}
.product-card.disabled:hover{
  transform:none;
}
.sold-out-ribbon{
  position:absolute;
  top:16px;
  right:-38px;
  background:#111;
  color:#fff;
  transform:rotate(35deg);
  padding:8px 45px;
  font-size:12px;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.5px;
}
.add-cart.disabled{
  background:#999;
  cursor:not-allowed;
}
.add-cart.disabled:hover{
  background:#999;
}
@media(max-width:900px){
  .status-banner{flex-direction:column;align-items:flex-start}
  .status-body{grid-template-columns:1fr}
}


/* Fixed contact page */
.contact-layout{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:34px;
  align-items:start;
}
.contact-info h2{
  margin:0 0 10px;
  font-size:34px;
  text-transform:uppercase;
  font-weight:1000;
}
.contact-info > p{
  color:#333;
  margin:0 0 22px;
}
.contact-card{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 10px 28px rgba(0,0,0,.06);
  border-radius:8px;
  padding:20px;
  margin-bottom:14px;
}
.contact-card h3{
  margin:0 0 5px;
  text-transform:uppercase;
  color:var(--red);
}
.contact-card p{
  margin:0;
  color:#333;
}
.contact-form{
  max-width:none;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  border-radius:8px;
  padding:28px;
}
@media(max-width:900px){
  .contact-layout{
    grid-template-columns:1fr;
  }
}


/* Clickable product cards and detail page */
.product-card{
  cursor:pointer;
}
.details-link{
  display:inline-block;
  color:var(--red);
  font-weight:1000;
  text-transform:uppercase;
  margin-bottom:14px;
  font-size:14px;
}
.product-detail-grid{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:38px;
  align-items:start;
}
.product-detail-image{
  min-height:520px;
  background-size:cover;
  background-position:center;
  border-radius:10px;
  box-shadow:var(--shadow);
  border:1px solid var(--line);
  position:relative;
  overflow:hidden;
}
.detail-status{
  position:absolute;
  top:22px;
  right:22px;
  background:#111;
  color:#fff;
  padding:12px 16px;
  border-radius:999px;
  text-transform:uppercase;
  font-weight:1000;
}
.product-detail-info{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  border-radius:10px;
  padding:32px;
}
.product-detail-info h1{
  margin:10px 0 12px;
  text-transform:uppercase;
  font-size:42px;
  line-height:1;
  font-weight:1000;
}
.detail-desc{
  color:#333;
  font-size:17px;
  margin:0 0 18px;
}
.detail-price{
  font-size:34px;
  font-weight:1000;
  margin:18px 0;
}
.detail-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:24px;
}
.btn.disabled,
.btn:disabled{
  opacity:.6;
  cursor:not-allowed;
  background:#999;
  border-color:#999;
}
.detail-box{
  border-top:1px solid var(--line);
  padding-top:18px;
  margin-top:18px;
}
.detail-box h3{
  margin:0 0 8px;
  text-transform:uppercase;
}
.detail-box p{
  margin:0;
  color:#333;
}
.detail-box ul{
  margin:0;
  padding-left:20px;
  color:#333;
}
@media(max-width:900px){
  .product-detail-grid{
    grid-template-columns:1fr;
  }
  .product-detail-image{
    min-height:320px;
  }
  .product-detail-info h1{
    font-size:34px;
  }
}


/* Clickable info cards and info detail pages */
.info-card.clickable{
  cursor:pointer;
  transition:.22s ease;
  position:relative;
  overflow:hidden;
}
.info-card.clickable:hover{
  transform:translateY(-7px);
  border-color:rgba(223,13,22,.35);
}
.info-card.clickable:after{
  content:"View More →";
  display:block;
  margin-top:18px;
  color:var(--red);
  font-weight:1000;
  text-transform:uppercase;
}
.info-detail-panel{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:30px;
  align-items:start;
}
.info-detail-main,
.info-detail-side{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  border-radius:10px;
  padding:32px;
}
.info-detail-main h1{
  margin:12px 0 8px;
  font-size:48px;
  line-height:1;
  text-transform:uppercase;
  font-style:italic;
  font-weight:1000;
}
.info-detail-main h2{
  margin:0 0 18px;
  font-size:22px;
  color:#333;
}
.info-detail-main p{
  color:#333;
  font-size:17px;
  margin:0 0 24px;
}
.info-detail-side h3{
  margin:0 0 15px;
  text-transform:uppercase;
}
.info-detail-side ul{
  margin:0;
  padding-left:20px;
  color:#333;
}
.info-detail-side li{
  margin-bottom:10px;
}
@media(max-width:900px){
  .info-detail-panel{
    grid-template-columns:1fr;
  }
  .info-detail-main h1{
    font-size:36px;
  }
}



/* Brand photo cards */
.brand-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
}
.brand-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  box-shadow:var(--shadow);
  cursor:pointer;
  transition:.22s ease;
}
.brand-card:hover{
  transform:translateY(-7px);
  border-color:rgba(223,13,22,.35);
}
.brand-photo{
  height:210px;
  background-size:cover;
  background-position:center;
}
.brand-body{
  padding:24px;
}
.brand-body h3{
  margin:0 0 8px;
  text-transform:uppercase;
  font-size:22px;
}
.brand-body p{
  margin:0;
  color:#333;
}
.brand-body:after{
  content:"View More →";
  display:block;
  margin-top:18px;
  color:var(--red);
  font-weight:1000;
  text-transform:uppercase;
}

/* About Us professional layout */
.about-intro{
  max-width:980px;
  margin:0 auto 34px;
  text-align:center;
}
.about-intro h2{
  margin:0 0 12px;
  font-size:36px;
  line-height:1;
  text-transform:uppercase;
  font-weight:1000;
}
.about-intro p{
  margin:0;
  color:#333;
  font-size:17px;
}
@media(max-width:1000px){
  .brand-grid{
    grid-template-columns:1fr;
  }
}


/* Hero slideshow using clean uploaded reference image */
.hero-slideshow{
  background:none !important;
  position:relative;
  min-height:466px;
  overflow:hidden;
}
.hero-slideshow .hero-bg{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  opacity:0;
  transition:opacity .65s ease;
  z-index:0;
}
.hero-slideshow .hero-bg.active{
  opacity:1;
}
.hero-slideshow::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.91) 31%, rgba(255,255,255,.38) 53%, rgba(255,255,255,0) 74%);
  z-index:1;
  pointer-events:none;
}
.hero-slideshow .container{
  position:relative;
  z-index:2;
}
.hero-slideshow .slider-dots{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:18px;
  display:flex !important;
  gap:9px;
  z-index:3;
}
.hero-slideshow .slider-dots button{
  width:12px;
  height:12px;
  border-radius:50%;
  border:2px solid #fff;
  background:#fff;
  padding:0;
  cursor:pointer;
  box-shadow:0 5px 14px rgba(0,0,0,.18);
}
.hero-slideshow .slider-dots button.active{
  background:var(--red);
  border-color:var(--red);
}
.hero-slideshow .hero-arrows{
  position:absolute;
  right:22px;
  bottom:30px;
  display:flex !important;
  gap:18px;
  z-index:3;
}
.hero-slideshow .arrow{
  width:36px;
  height:36px;
  border-radius:50%;
  border:0;
  display:grid;
  place-items:center;
  background:#fff;
  color:#111;
  font-size:24px;
  font-weight:900;
  box-shadow:0 8px 20px rgba(0,0,0,.15);
  cursor:pointer;
}
.hero-slideshow .arrow.red{
  background:var(--red);
  color:#fff;
}
.hero-slideshow .arrow:hover{
  transform:translateY(-2px);
}
@media(max-width:900px){
  .hero-slideshow{
    min-height:560px;
  }
  .hero-slideshow .hero-bg{
    background-position:center bottom;
  }
  .hero-slideshow::before{
    background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.88) 45%, rgba(255,255,255,.20) 100%);
  }
  /* Damplifier Calculator FINAL */
.damplifier-builder {
  margin-top: 35px !important;
  padding: 40px !important;
  background: #f6f6f6 !important;
  border-radius: 14px !important;
  border: none !important;
}

.damplifier-builder h2 {
  text-align: center !important;
  color: #0073b7 !important;
  font-size: 38px !important;
  font-weight: 900 !important;
  margin: 0 0 35px !important;
}

.damplifier-builder-controls,
.damplifier-builder-controls-full {
  max-width: 600px !important;
  margin: 0 auto !important;
}

.damplifier-builder .calc-field {
  margin-bottom: 30px !important;
}

.damplifier-builder .calc-field label {
  display: block !important;
  margin-bottom: 12px !important;
  color: #222 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
}

.damplifier-builder select#vehicleClass {
  width: 100% !important;
  height: 52px !important;
  padding: 0 18px !important;
  border: 2px solid #111 !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #111 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
}

.damplifier-builder .calc-pill-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 14px 24px !important;
}

.damplifier-builder .calc-pill-grid button {
  height: 38px !important;
  border-radius: 999px !important;
  border: 1px solid #bdbdbd !important;
  background: #fff !important;
  color: #444 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

.damplifier-builder .calc-pill-grid button.active {
  background: #0073b7 !important;
  border-color: #0073b7 !important;
  color: #fff !important;
}

.damplifier-builder .calc-percent {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  width: 250px !important;
  height: 38px !important;
  border: 1px solid #bdbdbd !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: #fff !important;
}

.damplifier-builder .calc-percent button {
  border: none !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #777 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}

.damplifier-builder .calc-percent button.active {
  background: #0073b7 !important;
  color: #fff !important;
}

.damplifier-builder .sf-box {
  width: 150px !important;
  padding: 16px 12px !important;
  border-radius: 4px !important;
  background: #dcecf7 !important;
  color: #0073b7 !important;
  text-align: center !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
}

.damplifier-builder .sheet-result {
  margin-top: 18px !important;
  color: #222 !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
  font-weight: 600 !important;
}
.calc-btn {
  height: 46px !important;
  border-radius: 999px !important;
  border: 1px solid #c7c7c7 !important;
  background: linear-gradient(180deg, #ffffff, #f3f3f3) !important;
  color: #222 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.08) !important;
  transition: all .2s ease !important;
}

.calc-btn:hover {
  transform: translateY(-2px) !important;
  border-color: #0073b7 !important;
  color: #0073b7 !important;
}

.calc-btn.active {
  background: linear-gradient(135deg, #0073b7, #0099e6) !important;
  color: #fff !important;
  border-color: #0073b7 !important;
  box-shadow: 0 8px 20px rgba(0,115,183,.35) !important;
}

.percent-btn {
  height: 42px !important;
  border: none !important;
  background: transparent !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #777 !important;
}

.percent-btn.active {
  background: linear-gradient(135deg, #0073b7, #0099e6) !important;
  color: #fff !important;
  border-radius: 999px !important;
  box-shadow: 0 6px 16px rgba(0,115,183,.35) !important;
}
.cool-calc-btn {
  height: 48px !important;
  border-radius: 999px !important;
  border: 2px solid #d0d0d0 !important;
  background: #ffffff !important;
  color: #222 !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  box-shadow: 0 6px 14px rgba(0,0,0,.08) !important;
}

.cool-calc-btn.active {
  background: #0073b7 !important;
  color: #fff !important;
  border-color: #0073b7 !important;
  box-shadow: 0 8px 20px rgba(0,115,183,.35) !important;
}
}