/* === RESET & BASE === */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-family: 'Inter', system-ui, -apple-system, sans-serif; scroll-behavior: smooth; }
body { color: #111827; background: #fff; -webkit-font-smoothing: antialiased; line-height: 1.5; }
img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }

/* === LAYOUT === */
.site-wrapper { min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1; }
.container { max-width: 1280px; margin: 0 auto; padding: 0 1rem; }
@media (min-width:640px)  { .container { padding: 0 1.5rem; } }
@media (min-width:1024px) { .container { padding: 0 2rem; } }
.max-w-2xl  { max-width: 42rem;  margin-left: auto; margin-right: auto; }
.max-w-3xl  { max-width: 48rem;  margin-left: auto; margin-right: auto; }
.max-w-4xl  { max-width: 56rem;  margin-left: auto; margin-right: auto; }
.max-w-5xl  { max-width: 64rem;  margin-left: auto; margin-right: auto; }
.max-w-6xl  { max-width: 72rem;  margin-left: auto; margin-right: auto; }
.max-w-lg   { max-width: 32rem; }

/* === HEADER === */
#site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  background: #0b1f3a;
  transition: box-shadow .3s;
}
#site-header.scrolled { box-shadow: 0 10px 30px rgba(0,0,0,.4); }
.header-inner {
  max-width: 1280px; margin: 0 auto; padding: 0 1rem;
  display: flex; align-items: center; justify-content: space-between; height: 4rem;
}
@media(min-width:640px)  { .header-inner { padding: 0 1.5rem; } }
@media(min-width:1024px) { .header-inner { padding: 0 2rem; height: 5rem; } }

.logo-link { display: flex; align-items: center; gap: .5rem; }
.logo-link img { height: 6rem; width: auto; object-fit: contain; }
.logo-name { color: #fff; font-weight: 700; font-size: 1.125rem; line-height: 1.2; display: block; }
.logo-sub  { color: #f97316; font-size: .75rem; line-height: 1.2; display: block; }

.desktop-nav { display: none; }
@media(min-width:1024px) { .desktop-nav { display: flex; align-items: center; gap: .25rem; } }
.desktop-nav a {
  padding: .5rem .75rem; border-radius: .375rem; font-size: .875rem; font-weight: 500;
  color: #d1d5db; transition: color .2s;
}
.desktop-nav a:hover { color: #fff; }
.desktop-nav a.active { color: #f97316; }

.header-actions { display: flex; align-items: center; gap: .75rem; }
.btn-call-header {
  display: none; align-items: center; gap: .5rem; padding: .625rem 1rem;
  border-radius: .5rem; background: #f97316; color: #fff; font-weight: 700; font-size: .875rem;
  transition: opacity .2s, transform .2s;
}
@media(min-width:640px) { .btn-call-header { display: flex; } }
.btn-call-header:hover { opacity: .9; transform: scale(1.05); }
.btn-call-header svg { width: 1rem; height: 1rem; }

.mobile-menu-btn {
  display: flex; padding: .5rem; border-radius: .375rem; color: #d1d5db;
  background: none; border: none; cursor: pointer; transition: color .2s;
}
.mobile-menu-btn:hover { color: #fff; }
.mobile-menu-btn svg { width: 1.5rem; height: 1.5rem; }
@media(min-width:1024px) { .mobile-menu-btn { display: none; } }

#mobile-nav { display: none; background: #0d2444; border-top: 1px solid rgba(255,255,255,.1); }
#mobile-nav.open { display: block; }
.mobile-nav-inner { padding: 1rem; display: flex; flex-direction: column; gap: .25rem; }
.mobile-nav-inner a {
  display: block; padding: .625rem .75rem; border-radius: .375rem;
  font-size: .875rem; font-weight: 500; color: #d1d5db; transition: color .2s;
}
.mobile-nav-inner a:hover { color: #fff; }
.mobile-nav-inner a.active { color: #f97316; }
.btn-call-mobile {
  display: flex; align-items: center; gap: .5rem; margin-top: .75rem;
  padding: .75rem 1rem; border-radius: .5rem; background: #f97316;
  color: #fff; font-weight: 700; font-size: .875rem;
}
.btn-call-mobile svg { width: 1rem; height: 1rem; }

/* === FOOTER === */
#site-footer { background: #061524; }
.footer-inner { max-width: 1280px; margin: 0 auto; padding: 4rem 1rem 2rem; }
@media(min-width:640px)  { .footer-inner { padding: 4rem 1.5rem 2rem; } }
@media(min-width:1024px) { .footer-inner { padding: 4rem 2rem  2rem; } }
.footer-grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; margin-bottom: 3rem; }
@media(min-width:768px)  { .footer-grid { grid-template-columns: repeat(2,1fr); } }
@media(min-width:1024px) { .footer-grid { grid-template-columns: repeat(4,1fr); } }
.footer-logo-row { display: flex; align-items: center; gap: .5rem; margin-bottom: 1.25rem; }
.footer-logo-row img { height: 6rem; width: auto; object-fit: contain; }
.footer-desc { color: #9ca3af; font-size: .875rem; line-height: 1.625; margin-bottom: 1.25rem; }
.footer-socials { display: flex; gap: .75rem; }
.footer-social-btn {
  width: 2.25rem; height: 2.25rem; border-radius: .5rem;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.1); color: #fff; transition: background .2s;
}
.footer-social-btn:hover { background: #f97316; }
.footer-social-btn svg { width: 1rem; height: 1rem; }
.footer-col-title { color: #fff; font-weight: 600; font-size: .875rem; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 1.25rem; }
.footer-links li { margin-bottom: .625rem; }
.footer-links a { color: #9ca3af; font-size: .875rem; transition: color .2s; }
.footer-links a:hover { color: #fb923c; }
.footer-area-box { margin-top: 1.5rem; padding: .75rem; border-radius: .5rem; border: 1px solid rgba(255,255,255,.1); background: #0d2444; }
.footer-area-box .a-label { font-size: .75rem; color: #9ca3af; margin-bottom: .25rem; }
.footer-area-box .a-main  { font-size: .875rem; color: #fff; }
.footer-area-box .a-sub   { font-size: .75rem; color: #9ca3af; margin-top: .25rem; }
.footer-contact-item { display: flex; align-items: flex-start; gap: .75rem; }
.footer-contact-item + .footer-contact-item { margin-top: 1rem; }
.footer-icon-wrap { width: 2rem; height: 2rem; border-radius: .5rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: rgba(249,115,22,.125); margin-top: .125rem; }
.footer-icon-wrap svg { width: 1rem; height: 1rem; color: #f97316; }
.fc-label { font-size: .75rem; color: #6b7280; margin-bottom: .125rem; }
.fc-val   { color: #fff; font-weight: 600; transition: color .2s; }
.fc-val:hover { color: #fb923c; }
.fc-sub { color: #9ca3af; font-size: .75rem; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.1); padding-top: 2rem; display: flex; flex-direction: column; align-items: center; gap: 1rem; }
@media(min-width:640px) { .footer-bottom { flex-direction: row; justify-content: space-between; } }
.footer-copy { color: #6b7280; font-size: .75rem; }
.footer-legal-links { display: flex; gap: 1rem; }
.footer-legal-links a { color: #6b7280; font-size: .75rem; transition: color .2s; }
.footer-legal-links a:hover { color: #d1d5db; }

/* === CTA STRIP === */
.cta-strip { padding: 3.5rem 0; background: #f97316; }
.cta-strip-inner { max-width: 64rem; margin: 0 auto; padding: 0 1rem; text-align: center; }
@media(min-width:640px) { .cta-strip-inner { padding: 0 1.5rem; } }
.cta-strip h2 { font-size: 1.5rem; font-weight: 700; color: #fff; margin-bottom: .75rem; }
@media(min-width:640px) { .cta-strip h2 { font-size: 1.875rem; } }
.cta-strip p { color: rgba(255,255,255,.85); font-size: 1.125rem; margin-bottom: 2rem; }
.cta-btns { display: flex; flex-direction: column; gap: 1rem; justify-content: center; }
@media(min-width:640px) { .cta-btns { flex-direction: row; } }
.btn-cta-white {
  display: inline-flex; align-items: center; justify-content: center; gap: .625rem;
  padding: 1rem 2rem; border-radius: .75rem; font-weight: 700; font-size: 1.125rem;
  background: #fff; color: #f97316; transition: background .2s, transform .2s;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,.1);
}
.btn-cta-white:hover { background: #f9fafb; transform: scale(1.05); }
.btn-cta-white svg { width: 1.25rem; height: 1.25rem; }
.btn-cta-outline {
  display: inline-flex; align-items: center; justify-content: center; gap: .625rem;
  padding: 1rem 2rem; border-radius: .75rem; font-weight: 700; font-size: 1.125rem;
  border: 2px solid #fff; color: #fff; transition: background .2s;
}
.btn-cta-outline:hover { background: rgba(255,255,255,.1); }
.btn-cta-outline svg { width: 1.25rem; height: 1.25rem; }

/* === PAGE HERO === */
.page-hero { padding: 7rem 0 5rem; background: linear-gradient(135deg,#0b1f3a 0%,#0d2a4e 100%); }
.breadcrumb { display: flex; align-items: center; gap: .5rem; font-size: .875rem; color: #9ca3af; margin-bottom: 1.5rem; }
.breadcrumb a { transition: color .2s; }
.breadcrumb a:hover { color: #fff; }
.breadcrumb .bc-current { color: #fff; }

/* Badge pill */
.badge-pill {
  display: inline-flex; align-items: center; gap: .5rem; padding: .375rem .75rem;
  border-radius: 9999px; font-size: .75rem; font-weight: 600; margin-bottom: 1.25rem;
  border: 1px solid rgba(249,115,22,.3); background: rgba(249,115,22,.082); color: #f97316;
}
.badge-dot { width: .375rem; height: .375rem; border-radius: 9999px; background: #f97316; animation: pulse 2s cubic-bezier(.4,0,.6,1) infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.5} }

/* Buttons */
.btn-orange {
  display: inline-flex; align-items: center; justify-content: center; gap: .625rem;
  padding: 1rem 1.75rem; border-radius: .75rem; font-weight: 700; color: #fff;
  font-size: 1.125rem; background: #f97316; transition: opacity .2s, transform .2s;
}
.btn-orange:hover { opacity: .9; transform: scale(1.05); }
.btn-orange svg { width: 1.25rem; height: 1.25rem; }
.btn-orange-sm {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .75rem 1.25rem; border-radius: .5rem; font-weight: 700; color: #fff;
  font-size: .875rem; background: #f97316; transition: opacity .2s;
}
.btn-orange-sm:hover { opacity: .9; }
.btn-orange-sm svg { width: 1rem; height: 1rem; }
.btn-outline-white {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: 1rem 1.75rem; border-radius: .75rem; font-weight: 600; color: #fff;
  font-size: 1.125rem; border: 1px solid rgba(255,255,255,.2); transition: border-color .2s, background .2s;
}
.btn-outline-white:hover { border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.05); }
.btn-outline-white svg { width: 1.25rem; height: 1.25rem; }
.hero-btns { display: flex; flex-direction: column; gap: 1rem; }
@media(min-width:640px) { .hero-btns { flex-direction: row; } }

/* Feature badges */
.feature-badges { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 1.75rem; }
.feature-badge { display: flex; align-items: center; gap: .375rem; font-size: .875rem; color: #d1d5db; }
.feature-badge svg { width: 1rem; height: 1rem; color: #f97316; }

/* Section header */
.section-header { text-align: center; margin-bottom: 3.5rem; }
.section-label { font-size: .875rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; margin-bottom: .75rem; display: block; }
.section-title { font-size: 1.875rem; font-weight: 700; color: #111827; margin-bottom: 1rem; line-height: 1.25; }
@media(min-width:640px) { .section-title { font-size: 2.25rem; } }
.section-desc { color: #6b7280; font-size: 1.125rem; }

/* Grid helpers */
.grid-1 { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
.grid-2 { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media(min-width:640px) { .grid-2 { grid-template-columns: repeat(2,1fr); } }
.grid-3 { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media(min-width:640px) { .grid-3 { grid-template-columns: repeat(2,1fr); } }
@media(min-width:1024px) { .grid-3 { grid-template-columns: repeat(3,1fr); } }
.grid-4 { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media(min-width:640px) { .grid-4 { grid-template-columns: repeat(2,1fr); } }
@media(min-width:1024px) { .grid-4 { grid-template-columns: repeat(4,1fr); } }
.grid-stats { display: grid; grid-template-columns: repeat(2,1fr); gap: 2rem; }
@media(min-width:768px) { .grid-stats { grid-template-columns: repeat(4,1fr); } }
.two-col { display: grid; gap: 4rem; }
@media(min-width:1024px) { .two-col { grid-template-columns: repeat(2,1fr); align-items: center; } }
.two-col-start { display: grid; gap: 4rem; }
@media(min-width:1024px) { .two-col-start { grid-template-columns: repeat(2,1fr); align-items: flex-start; } }

/* === HOME HERO === */
.home-hero { position: relative; min-height: 100vh; display: flex; align-items: center; padding-top: 5rem; background: linear-gradient(135deg,#0b1f3a 0%,#0d2a4e 50%,#0f3060 100%); }
.home-hero-bg { position: absolute; inset: 0; opacity: .05; background-image: url('https://images.pexels.com/photos/1181671/pexels-photo-1181671.jpeg?auto=compress&cs=tinysrgb&w=1600'); background-size: cover; background-position: center; }
.home-hero-overlay { position: absolute; inset: 0; background: linear-gradient(135deg,rgba(11,31,58,.93) 0%,rgba(13,42,78,.8) 100%); }
.home-hero-content { position: relative; max-width: 1280px; margin: 0 auto; padding: 5rem 1rem; }
@media(min-width:640px) { .home-hero-content { padding: 5rem 1.5rem; } }
@media(min-width:1024px) { .home-hero-content { padding: 5rem 2rem; } }

.hero-img-wrap { position: relative; display: none; }
@media(min-width:1024px) { .hero-img-wrap { display: block; } }
.hero-img-wrap img { border-radius: 1rem; object-fit: cover; width: 100%; height: 24rem; }
.hero-float-card { position: absolute; border-radius: .75rem; padding: 1rem; border: 1px solid rgba(255,255,255,.1); background: #0d2444; }
.hero-float-review { bottom: -1.5rem; left: -1.5rem; display: flex; align-items: center; gap: .75rem; }
.hero-float-review-icon { width: 3rem; height: 3rem; border-radius: 9999px; display: flex; align-items: center; justify-content: center; background: #f97316; flex-shrink: 0; }
.hero-float-review-icon svg { width: 1.5rem; height: 1.5rem; fill: #fff; color: #fff; }
.hero-float-count { top: -1.5rem; right: -1.5rem; }

/* Stat bar */
.stat-bar { background: #0d2444; padding: 3rem 0; }
.stat-item { text-align: center; }
.stat-value { font-size: 2.25rem; font-weight: 700; color: #f97316; margin-bottom: .25rem; }
@media(min-width:640px) { .stat-value { font-size: 2.5rem; } }
.stat-label { color: #9ca3af; font-size: .875rem; }

/* Service cards */
.service-card { background: #fff; border-radius: 1rem; padding: 1.75rem; box-shadow: 0 1px 2px rgba(0,0,0,.05); border: 1px solid #f3f4f6; transition: all .3s; display: flex; flex-direction: column; }
.service-card:hover { box-shadow: 0 20px 25px -5px rgba(0,0,0,.1); border-color: transparent; transform: translateY(-4px); }
.service-icon { width: 3rem; height: 3rem; border-radius: .75rem; display: flex; align-items: center; justify-content: center; margin-bottom: 1.25rem; transition: transform .2s; }
.service-card:hover .service-icon { transform: scale(1.1); }
.service-icon svg { width: 1.5rem; height: 1.5rem; }
.service-card h3 { font-weight: 700; font-size: 1.125rem; color: #111827; margin-bottom: .75rem; line-height: 1.25; }
.service-card p { color: #6b7280; font-size: .875rem; line-height: 1.625; flex: 1; margin-bottom: 1.25rem; }
.service-learn-more { display: flex; align-items: center; gap: .25rem; font-size: .875rem; font-weight: 600; }
.service-learn-more svg { width: 1rem; height: 1rem; }

/* Why us */
.why-item { display: flex; gap: 1rem; }
.why-icon { width: 2.5rem; height: 2.5rem; border-radius: .5rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: .125rem; background: rgba(249,115,22,.094); }
.why-icon svg { width: 1.25rem; height: 1.25rem; color: #f97316; }
.why-item h4 { font-weight: 600; font-size: .875rem; color: #111827; margin-bottom: .25rem; }
.why-item p  { color: #6b7280; font-size: .75rem; line-height: 1.625; }
.why-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media(min-width:640px) { .why-grid { grid-template-columns: repeat(2,1fr); } }
.why-img-rel { position: relative; }
.why-img-rel img { border-radius: 1rem; object-fit: cover; width: 100%; height: 30rem; }
.why-img-overlay { position: absolute; bottom: 1.5rem; left: 1.5rem; right: 1.5rem; border-radius: .75rem; padding: 1.25rem; border: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(4px); background: rgba(11,31,58,.933); display: flex; align-items: center; gap: .75rem; }
.why-img-overlay svg { width: 2rem; height: 2rem; color: #f97316; flex-shrink: 0; }

/* Testimonials */
.testimonial-card { background: #fff; border-radius: 1rem; padding: 2rem; box-shadow: 0 1px 2px rgba(0,0,0,.05); border: 1px solid #f3f4f6; display: flex; flex-direction: column; }
.quote-icon { width: 2rem; height: 2rem; margin-bottom: 1.25rem; color: #f97316; }
.testimonial-text { color: #4b5563; line-height: 1.625; flex: 1; margin-bottom: 1.5rem; font-style: italic; }
.testimonial-footer { display: flex; align-items: center; gap: .75rem; padding-top: 1.25rem; border-top: 1px solid #f3f4f6; }
.t-avatar { width: 2.5rem; height: 2.5rem; border-radius: 9999px; display: flex; align-items: center; justify-content: center; font-weight: 700; color: #fff; font-size: .875rem; background: #0d2444; flex-shrink: 0; }
.t-name { font-weight: 600; font-size: .875rem; color: #111827; }
.t-role { color: #9ca3af; font-size: .75rem; }
.stars { display: flex; gap: .125rem; margin-left: auto; }
.star-svg { width: 1rem; height: 1rem; fill: #fbbf24; color: #fbbf24; }

/* Repair cards */
.repair-card { background: #f9fafb; border-radius: 1rem; padding: 1.5rem; border: 1px solid #f3f4f6; transition: all .2s; }
.repair-card:hover { border-color: #fed7aa; box-shadow: 0 4px 6px -1px rgba(0,0,0,.1); }
.repair-icon { width: 2.75rem; height: 2.75rem; border-radius: .75rem; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; background: rgba(249,115,22,.094); }
.repair-icon svg { width: 1.25rem; height: 1.25rem; color: #f97316; }
.repair-card h3 { font-weight: 700; font-size: 1rem; color: #111827; margin-bottom: .5rem; }
.repair-card p  { color: #6b7280; font-size: .875rem; line-height: 1.625; }

/* Process steps */
.process-step { text-align: center; position: relative; }
.process-number { width: 3.5rem; height: 3.5rem; border-radius: .75rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; font-weight: 700; font-size: 1.25rem; color: #fff; background: #0b1f3a; }
.process-step h3 { font-weight: 700; font-size: .875rem; color: #111827; margin-bottom: .5rem; }
.process-step p  { color: #6b7280; font-size: .75rem; line-height: 1.625; }
.process-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media(min-width:640px) { .process-grid { grid-template-columns: repeat(2,1fr); } }
@media(min-width:1024px) { .process-grid { grid-template-columns: repeat(5,1fr); } }

/* FAQ */
.faq-item { background: #f9fafb; border-radius: .75rem; padding: 1.5rem; border: 1px solid #f3f4f6; margin-bottom: 1rem; }
.faq-question { display: flex; align-items: flex-start; gap: .5rem; font-weight: 600; color: #111827; margin-bottom: .5rem; }
.faq-q-badge { width: 1.25rem; height: 1.25rem; border-radius: 9999px; display: flex; align-items: center; justify-content: center; font-size: .75rem; font-weight: 700; color: #fff; background: #f97316; flex-shrink: 0; margin-top: .125rem; }
.faq-answer { color: #4b5563; font-size: .875rem; line-height: 1.625; padding-left: 1.75rem; }

/* Trust badges */
.trust-card { background: #fff; border-radius: 1rem; padding: 1.75rem; box-shadow: 0 1px 2px rgba(0,0,0,.05); border: 1px solid #f3f4f6; text-align: center; }
.trust-icon { width: 3rem; height: 3rem; border-radius: .75rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; background: rgba(249,115,22,.094); }
.trust-icon svg { width: 1.5rem; height: 1.5rem; color: #f97316; }
.trust-card h3 { font-weight: 700; font-size: 1rem; color: #111827; margin-bottom: .25rem; }
.trust-card p  { color: #6b7280; font-size: .875rem; }

/* Outcome cards */
.outcome-card { background: #f9fafb; border-radius: 1rem; padding: 1.75rem; border: 1px solid #f3f4f6; transition: box-shadow .2s; }
.outcome-card:hover { box-shadow: 0 4px 6px -1px rgba(0,0,0,.1); }
.outcome-icon { width: 2.75rem; height: 2.75rem; border-radius: .75rem; display: flex; align-items: center; justify-content: center; margin-bottom: 1.25rem; background: rgba(11,31,58,.094); }
.outcome-icon svg { width: 1.25rem; height: 1.25rem; color: #0b1f3a; }
.outcome-card h3 { font-weight: 700; font-size: 1rem; color: #111827; margin-bottom: .75rem; }
.outcome-card p  { color: #6b7280; font-size: .875rem; line-height: 1.625; }

/* Pain points */
.pain-card { background: #fff; border-radius: 1rem; padding: 1.75rem; box-shadow: 0 1px 2px rgba(0,0,0,.05); border: 1px solid #f3f4f6; margin-bottom: 1.5rem; }
.pain-row { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media(min-width:768px) { .pain-row { grid-template-columns: repeat(2,1fr); } }
.pain-problem { display: flex; align-items: flex-start; gap: .75rem; }
.pain-x { width: 1.5rem; height: 1.5rem; border-radius: 9999px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: .125rem; background: #fee2e2; color: #ef4444; font-size: .75rem; font-weight: 700; }
.pain-solution { display: flex; align-items: flex-start; gap: .75rem; }
.pain-check { width: 1.5rem; height: 1.5rem; border-radius: 9999px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: .125rem; background: rgba(249,115,22,.125); }
.pain-check svg { width: 1rem; height: 1rem; color: #f97316; }

/* Pricing */
.pricing-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; }
@media(min-width:768px) { .pricing-grid { grid-template-columns: repeat(3,1fr); } }
.plan-card { border-radius: 1rem; padding: 2rem; border: 2px solid #f3f4f6; box-shadow: 0 1px 2px rgba(0,0,0,.05); background: #fff; position: relative; }
.plan-card.highlight { border-color: #f97316; box-shadow: 0 20px 25px -5px rgba(0,0,0,.1); background: #0b1f3a; }
.plan-badge { position: absolute; top: -1rem; left: 50%; transform: translateX(-50%); padding: .375rem 1rem; border-radius: 9999px; font-size: .75rem; font-weight: 700; color: #fff; background: #f97316; white-space: nowrap; }
.plan-name { font-weight: 700; font-size: 1.25rem; margin-bottom: .25rem; }
.plan-price-row { display: flex; align-items: flex-end; gap: .25rem; margin-bottom: .5rem; }
.plan-price-val { font-weight: 700; font-size: 1.875rem; }
.plan-price-per { font-size: .875rem; margin-bottom: .25rem; }
.plan-desc { font-size: .875rem; margin-bottom: 1.5rem; }
.plan-features { margin-bottom: 2rem; display: flex; flex-direction: column; gap: .625rem; }
.plan-features li { display: flex; align-items: center; gap: .625rem; }
.plan-features li svg { width: 1rem; height: 1rem; color: #f97316; flex-shrink: 0; }
.plan-features li span { font-size: .875rem; }
.btn-plan-outline { display: block; text-align: center; padding: .75rem 1.25rem; border-radius: .75rem; font-weight: 700; font-size: .875rem; border: 2px solid #e5e7eb; color: #111827; transition: all .2s; }
.btn-plan-outline:hover { border-color: #f97316; }
.btn-plan-orange { display: block; text-align: center; padding: .75rem 1.25rem; border-radius: .75rem; font-weight: 700; font-size: .875rem; background: #f97316; color: #fff; transition: opacity .2s; }
.btn-plan-orange:hover { opacity: .9; }

/* Dark box */
.dark-box { border-radius: 1rem; padding: 2rem; box-shadow: 0 20px 25px -5px rgba(0,0,0,.1); background: #0b1f3a; }
.dark-box-btns { display: flex; flex-direction: column; gap: .75rem; }
.btn-dark-full { display: flex; align-items: center; justify-content: center; gap: .5rem; width: 100%; padding: .875rem; border-radius: .75rem; font-weight: 700; color: #fff; background: #f97316; transition: opacity .2s; }
.btn-dark-full:hover { opacity: .9; }
.btn-dark-outline { display: flex; align-items: center; justify-content: center; gap: .5rem; width: 100%; padding: .875rem; border-radius: .75rem; font-weight: 600; color: #fff; font-size: .875rem; border: 1px solid rgba(255,255,255,.2); transition: border-color .2s; }
.btn-dark-outline:hover { border-color: rgba(255,255,255,.4); }
.dark-box-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.1); text-align: center; }
.db-stat-val   { font-weight: 700; font-size: 1.125rem; color: #f97316; }
.db-stat-label { color: #9ca3af; font-size: .75rem; }

/* Net includes */
.include-item { display: flex; align-items: center; gap: .75rem; background: #fff; border-radius: .75rem; padding: .75rem 1.25rem; box-shadow: 0 1px 2px rgba(0,0,0,.05); border: 1px solid #f3f4f6; margin-bottom: .75rem; }
.include-item svg { width: 1.25rem; height: 1.25rem; color: #0ea5e9; flex-shrink: 0; }
.include-item span { color: #374151; font-size: .875rem; font-weight: 500; }

/* Common problems box */
.blue-info-box { border-radius: 1rem; padding: 2rem; border: 1px solid #bfdbfe; background: #eff6ff; }
.blue-info-list li { display: flex; align-items: center; gap: .625rem; color: #374151; font-size: .875rem; margin-bottom: .5rem; }
.blue-info-list li svg { width: 1rem; height: 1rem; color: #f97316; flex-shrink: 0; }
.same-day-box { display: inline-block; border-radius: 1rem; padding: 2rem; box-shadow: 0 10px 15px -3px rgba(0,0,0,.1); background: #0b1f3a; text-align: center; }

/* Contact info */
.contact-info-card { background: #fff; border-radius: 1rem; padding: 1.5rem; box-shadow: 0 1px 2px rgba(0,0,0,.05); border: 1px solid #f3f4f6; margin-bottom: 1.25rem; }
.contact-info-inner { display: flex; align-items: flex-start; gap: 1rem; }
.ci-icon { width: 2.75rem; height: 2.75rem; border-radius: .75rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: rgba(249,115,22,.094); }
.ci-icon svg { width: 1.25rem; height: 1.25rem; color: #f97316; }
.ci-sublabel { font-size: .75rem; color: #9ca3af; text-transform: uppercase; letter-spacing: .05em; margin-bottom: .25rem; }
.ci-val   { font-weight: 700; font-size: 1.125rem; color: #111827; transition: color .2s; }
a.ci-val:hover { color: #f97316; }
.ci-sub { font-size: .75rem; color: #9ca3af; margin-top: .25rem; }
.hours-row { display: flex; justify-content: space-between; font-size: .875rem; margin-bottom: .25rem; }

/* Contact form */
.contact-form-wrap { background: #fff; border-radius: 1rem; padding: 2rem; box-shadow: 0 1px 2px rgba(0,0,0,.05); border: 1px solid #f3f4f6; }
.form-label { display: block; font-size: .75rem; font-weight: 600; color: #4b5563; text-transform: uppercase; letter-spacing: .05em; margin-bottom: .375rem; }
.form-input { width: 100%; padding: .75rem 1rem; border-radius: .75rem; border: 1px solid #e5e7eb; font-size: .875rem; color: #111827; outline: none; transition: border-color .2s, box-shadow .2s; font-family: inherit; }
.form-input:focus { border-color: #f97316; box-shadow: 0 0 0 2px rgba(249,115,22,.2); }
.form-row { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media(min-width:640px) { .form-row { grid-template-columns: repeat(2,1fr); } }
.form-field { margin-bottom: 1.25rem; }
.btn-submit { width: 100%; display: flex; align-items: center; justify-content: center; gap: .625rem; padding: 1rem; border-radius: .75rem; font-weight: 700; color: #fff; font-size: 1rem; background: #f97316; border: none; cursor: pointer; transition: opacity .2s; font-family: inherit; }
.btn-submit:hover { opacity: .9; }
.form-note { text-align: center; color: #9ca3af; font-size: .75rem; margin-top: 1rem; }
.form-note a { color: #f97316; font-weight: 700; }
.success-state { padding: 4rem 1rem; text-align: center; }
.success-icon-wrap { width: 4rem; height: 4rem; border-radius: 9999px; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.25rem; background: rgba(249,115,22,.094); }
.success-icon-wrap svg { width: 2rem; height: 2rem; color: #f97316; }

/* Website package highlight */
.package-highlight { margin-top: 2rem; padding: 1.25rem; border-radius: .75rem; border: 1px solid rgba(16,185,129,.3); background: rgba(16,185,129,.063); display: flex; align-items: flex-start; gap: .75rem; }
.package-highlight svg { width: 1.25rem; height: 1.25rem; color: #10b981; flex-shrink: 0; margin-top: .125rem; }

/* SEO Checklist */
.seo-meta-card { background: #f9fafb; border-radius: 1rem; padding: 1.5rem; border: 1px solid #f3f4f6; margin-bottom: 1.25rem; }
.seo-page-badge { display: inline-block; padding: .125rem .5rem; border-radius: .25rem; font-size: .75rem; font-weight: 700; color: #fff; background: #0b1f3a; margin-bottom: .5rem; }
.seo-field-label { font-size: .75rem; font-weight: 600; color: #9ca3af; text-transform: uppercase; letter-spacing: .05em; margin-bottom: .25rem; }
.seo-field-val { font-size: .875rem; font-family: monospace; background: #fff; border-radius: .5rem; padding: .5rem .75rem; border: 1px solid #e5e7eb; color: #1f2937; margin-bottom: .75rem; }
.seo-keyword-pill { display: inline-block; padding: .25rem .625rem; border-radius: 9999px; font-size: .75rem; font-weight: 500; background: rgba(249,115,22,.082); color: #f97316; margin: .125rem; }
.checklist-section { background: #f9fafb; border-radius: 1rem; padding: 1.75rem; border: 1px solid #f3f4f6; margin-bottom: 2rem; }
.checklist-section-header { display: flex; align-items: center; gap: .75rem; margin-bottom: 1.25rem; }
.checklist-icon-wrap { width: 2.25rem; height: 2.25rem; border-radius: .5rem; display: flex; align-items: center; justify-content: center; }
.checklist-icon-wrap svg { width: 1.25rem; height: 1.25rem; }
.checklist-item { display: flex; align-items: flex-start; gap: .75rem; margin-bottom: .75rem; }
.checklist-item svg { width: 1.25rem; height: 1.25rem; flex-shrink: 0; margin-top: .125rem; }
.ci-done svg { color: #10b981; }
.ci-todo svg { color: #fbbf24; }
.ci-done p { font-size: .875rem; line-height: 1.625; color: #9ca3af; text-decoration: line-through; }
.ci-todo p { font-size: .875rem; line-height: 1.625; color: #374151; }
.priority-box { border-radius: 1rem; padding: 1.75rem; border: 1px solid #bfdbfe; background: #eff6ff; }
.priority-box ol { list-style: decimal; padding-left: 1.25rem; display: flex; flex-direction: column; gap: .375rem; }
.priority-box li { font-size: .875rem; color: #4b5563; }

/* Legal pages */
.legal-card { background: #fff; border-radius: 1rem; box-shadow: 0 1px 2px rgba(0,0,0,.05); border: 1px solid #f3f4f6; padding: 2rem; }
@media(min-width:640px) { .legal-card { padding: 3rem; } }
.legal-header { margin-bottom: 2rem; padding-bottom: 2rem; border-top: none; border-left: none; border-right: none; border-bottom: 1px solid #f3f4f6; }

/* 404 */
.not-found-page { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem; background: #f8fafc; text-align: center; }
.not-found-logo { height: 6rem; width: auto; object-fit: contain; margin: 0 auto 1.5rem; }
.not-found-404 { font-size: 6rem; font-weight: 900; color: #f97316; line-height: 1; margin-bottom: 1rem; }
.not-found-btns { display: flex; flex-direction: column; gap: .75rem; justify-content: center; margin-top: 2rem; }
@media(min-width:640px) { .not-found-btns { flex-direction: row; } }
.btn-navy { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .75rem 1.5rem; border-radius: .5rem; font-weight: 600; color: #fff; background: #0b1f3a; transition: opacity .2s; }
.btn-navy:hover { opacity: .9; }
.btn-outline-navy { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .75rem 1.5rem; border-radius: .5rem; font-weight: 600; color: #0b1f3a; border: 2px solid #0b1f3a; transition: background .2s; }
.btn-outline-navy:hover { background: #f9fafb; }
.not-found-phone-wrap { margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid #e5e7eb; }
.not-found-phone-wrap p { font-size: .875rem; color: #9ca3af; margin-bottom: .75rem; }
.not-found-phone { display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; font-size: 1.125rem; color: #f97316; }
.not-found-phone:hover { opacity: .8; }
.not-found-phone svg, .btn-navy svg, .btn-outline-navy svg { width: 1rem; height: 1rem; }

/* Inline SVG icon sizes */
svg.ic-sm { width: 1rem; height: 1rem; }
svg.ic-md { width: 1.25rem; height: 1.25rem; }
svg.ic-lg { width: 1.5rem; height: 1.5rem; }

/* Utilities */
.text-center { text-align: center; }
.text-white  { color: #fff; }
.text-orange { color: #f97316; }
.text-gray-300 { color: #d1d5db; }
.text-gray-400 { color: #9ca3af; }
.text-gray-500 { color: #6b7280; }
.text-gray-600 { color: #4b5563; }
.text-gray-700 { color: #374151; }
.text-gray-900 { color: #111827; }
.text-emerald  { color: #10b981; }
.text-sky      { color: #0ea5e9; }
.text-amber    { color: #fbbf24; }
.text-red-500  { color: #ef4444; }
.text-blue-500 { color: #3b82f6; }
.font-bold     { font-weight: 700; }
.font-semibold { font-weight: 600; }
.font-black    { font-weight: 900; }
.text-sm  { font-size: .875rem; }
.text-xs  { font-size: .75rem; }
.text-lg  { font-size: 1.125rem; }
.text-xl  { font-size: 1.25rem; }
.text-2xl { font-size: 1.5rem; }
.text-3xl { font-size: 1.875rem; }
.text-4xl { font-size: 2.25rem; }
.text-5xl { font-size: 3rem; }
.italic   { font-style: italic; }
.leading-tight   { line-height: 1.25; }
.leading-relaxed { line-height: 1.625; }
.break-all { word-break: break-all; }
.font-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
.ml-auto { margin-left: auto; }
.mt-1 { margin-top: .25rem; } .mt-2 { margin-top: .5rem; } .mt-3 { margin-top: .75rem; }
.mt-4 { margin-top: 1rem; }   .mt-5 { margin-top: 1.25rem; } .mt-6 { margin-top: 1.5rem; }
.mt-7 { margin-top: 1.75rem; } .mt-8 { margin-top: 2rem; }
.mb-1 { margin-bottom: .25rem; } .mb-2 { margin-bottom: .5rem; } .mb-3 { margin-bottom: .75rem; }
.mb-4 { margin-bottom: 1rem; }  .mb-5 { margin-bottom: 1.25rem; } .mb-6 { margin-bottom: 1.5rem; }
.mb-7 { margin-bottom: 1.75rem; } .mb-8 { margin-bottom: 2rem; }
.gap-2 { gap: .5rem; } .gap-3 { gap: .75rem; } .gap-4 { gap: 1rem; } .gap-6 { gap: 1.5rem; } .gap-8 { gap: 2rem; }
.flex { display: flex; } .flex-col { flex-direction: column; }
.items-center { align-items: center; } .items-start { align-items: flex-start; }
.justify-center { justify-content: center; } .justify-between { justify-content: space-between; }
.flex-wrap { flex-wrap: wrap; } .flex-1 { flex: 1; } .shrink-0 { flex-shrink: 0; }
.w-full { width: 100%; } .hidden { display: none; } .block { display: block; }
.inline-block { display: inline-block; } .inline-flex { display: inline-flex; }
.relative { position: relative; } .absolute { position: absolute; }
.py-12 { padding: 3rem 0; } .py-16 { padding: 4rem 0; } .py-20 { padding: 5rem 0; }
.pt-8 { padding-top: 2rem; } .pb-8 { padding-bottom: 2rem; }
.pt-20 { padding-top: 5rem; } .pt-24 { padding-top: 6rem; } .pt-28 { padding-top: 7rem; }
.pb-16 { padding-bottom: 4rem; }
.animate-spin { animation: spin 1s linear infinite; display: inline-block; width: 1rem; height: 1rem; border: 2px solid rgba(255,255,255,.3); border-top-color: #fff; border-radius: 9999px; }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes fadeIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.animate-fade-in { animation: fadeIn .5s ease-out forwards; }