@media (max-width: 1180px) {
    .site-header { grid-template-columns: auto auto; }
    .nav-toggle { display: block; justify-self: end; }
    .site-nav { display: none; grid-column: 1 / -1; justify-self: stretch; border-top: 1px solid var(--color-border); padding-top: 10px; }
    .site-nav.open { display: grid; grid-template-columns: repeat(3, 1fr); }
    .header-actions { grid-column: 1 / -1; justify-content: stretch; }
    .header-actions .btn { flex: 1; }
    .footer-main { grid-template-columns: repeat(2, 1fr); }
    .operation-flow { grid-template-columns: repeat(4, 1fr); }
    .flow-step:nth-child(4)::after { display: none; }
}
@media (max-width: 980px) {
    .tax-alert { position: static; display: grid; text-align: center; }
    .site-header { top: 14px; }
    .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 124px; }
    .screens-section, .pricing-section, .module-hero { grid-template-columns: 1fr; }
    .metrics-band, .problem-grid, .module-grid, .segment-grid, .integration-grid, .testimonial-grid, .result-grid { grid-template-columns: repeat(2, 1fr); }
    .screen-phone, .floating-chip { position: static; width: auto; margin-top: 12px; }
    .screen-phone { max-width: 180px; justify-self: end; }
    .screen-stack { display: grid; }
    .stage-caption { display: grid; }
}
@media (max-width: 700px) {
    html { scroll-padding-top: 96px; }
    .hero, .section, .section-slim, .subhero, .site-footer { width: min(var(--container-width), calc(100% - 32px)); }
    .site-header { width: calc(100% - 24px); min-height: 62px; }
    .brand-logo { width: 148px; height: 48px; }
    .brand-mark { width: 38px; height: 38px; }
    .header-actions { display: none; }
    .site-nav.open { grid-template-columns: 1fr; }
    .tax-alert span { display: none; }
    h1 { font-size: clamp(2rem, 10vw, 3.15rem); line-height: 1.08; }
    h2 { font-size: clamp(1.65rem, 8vw, 2.45rem); line-height: 1.1; }
    .hero-proof-grid { grid-template-columns: 1fr; }
    .stage-topbar strong { display: none; }
    .hero-actions, .cta-actions, .price-actions { display: grid; }
    .btn { width: 100%; }
    .metrics-band, .problem-grid, .module-grid, .segment-grid, .integration-grid, .testimonial-grid, .result-grid, .compare-grid, .footer-main, .operation-flow, .screens-gallery { grid-template-columns: 1fr; }
    .flow-step::after { display: none; }
    .screens-gallery img { height: auto; max-height: 280px; }
    .module-card img { height: 180px; }
    .final-cta { display: grid; padding: 26px; }
    .price-card strong { font-size: 3.1rem; }
    .wa-float { right: 14px; bottom: 14px; }
    .footer-bottom { display: grid; }
}
@media (min-width: 1600px) {
    :root { --container-width: 1320px; }
    .hero { min-height: 820px; }
}




/* Reference-inspired AutoParts software landing theme */
body {
    background: #f5fbff;
    color: #10243f;
}
body::before {
    background:
        linear-gradient(135deg, rgba(0, 153, 255, .14), transparent 32%),
        linear-gradient(225deg, rgba(72, 199, 255, .18), transparent 36%),
        linear-gradient(180deg, #ffffff 0%, #eef8ff 52%, #ffffff 100%);
}
body::after {
    opacity: .55;
    background-image:
        linear-gradient(rgba(0, 153, 255, .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 153, 255, .06) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: linear-gradient(to bottom, #000 0%, transparent 70%);
}
.site-header {
    top: 50px;
    border-color: rgba(0, 153, 255, .12);
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 18px 46px rgba(0, 69, 130, .12);
}
.site-header.scrolled {
    background: rgba(255, 255, 255, .97);
    border-color: rgba(0, 153, 255, .18);
    box-shadow: 0 18px 54px rgba(0, 69, 130, .16);
}
.brand-copy strong,
.site-nav a:hover,
.site-nav a.active,
.module-card strong,
.integration-card strong,
.quote-card blockquote,
.result-card,
.flow-step strong,
.compare-card h3,
.glass-card h3,
.final-cta h2,
.section-head h2,
.screens-copy h2,
.pricing-copy h2,
.lead-copy h2,
.subhero h1,
h1,
h2,
h3 {
    color: #10243f;
}
.brand-copy small,
.site-nav a,
.hero-copy p,
.section-head p,
.screens-copy p,
.pricing-copy p,
.final-cta p,
.subhero p,
.problem-card p,
.problem-card strong,
.module-card p,
.glass-card p,
.integration-card p,
.quote-card span,
.lead-copy p,
.faq-item p,
.site-footer p,
.site-footer a,
.site-footer span {
    color: #58708e;
}
.brand-mark {
    background: linear-gradient(135deg, #0077d9, #28c7ff);
    box-shadow: 0 14px 34px rgba(0, 153, 255, .28);
}
.tax-alert {
    background: linear-gradient(90deg, #006ecb, #00b7ff);
    color: #ffffff;
    border-bottom: 0;
    box-shadow: 0 12px 30px rgba(0, 110, 203, .18);
}
.tax-alert strong {
    color: #ffffff;
}
.hero {
    grid-template-columns: .92fr 1.08fr;
    min-height: 780px;
    padding-top: 150px;
    padding-bottom: 70px;
}
.hero::before {
    inset: 110px -7% auto auto;
    width: 54%;
    height: 62%;
    border-radius: 40px;
    background: linear-gradient(135deg, rgba(0, 153, 255, .18), rgba(72, 199, 255, .08));
    filter: blur(16px);
    transform: rotate(-8deg);
}
.eyebrow {
    color: #0099ff;
    letter-spacing: .11em;
}
h1 {
    max-width: 720px;
    font-size: clamp(2.45rem, 4.35vw, 4.25rem);
    line-height: 1.08;
    font-weight: 900;
}
h2 {
    max-width: 780px;
    font-size: clamp(1.9rem, 3.1vw, 3.15rem);
    line-height: 1.12;
    font-weight: 900;
}
h3 {
    line-height: 1.25;
}
.hero-copy p,
.section-head p,
.screens-copy p,
.pricing-copy p,
.final-cta p,
.subhero p {
    font-size: 1rem;
    line-height: 1.7;
}
.btn-primary {
    background: linear-gradient(135deg, #0077d9, #00b7ff);
    box-shadow: 0 18px 42px rgba(0, 153, 255, .28);
}
.btn-secondary,
.btn-quiet {
    color: #0c63a5;
    border-color: rgba(0, 153, 255, .18);
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(0, 69, 130, .08);
}
.trust-strip span,
.resource-grid span {
    color: #355371;
    border-color: rgba(0, 153, 255, .14);
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(0, 69, 130, .07);
}
.hero-proof-grid {
    max-width: 560px;
}
.hero-proof-grid span {
    color: #58708e;
    border-color: rgba(0, 153, 255, .14);
    border-left-color: #0099ff;
    background: #ffffff;
    box-shadow: 0 14px 30px rgba(0, 69, 130, .08);
}
.hero-proof-grid strong {
    color: #10243f;
}
.screen-stack {
    border-color: rgba(0, 153, 255, .18);
    background: #ffffff;
    box-shadow: 0 26px 70px rgba(0, 69, 130, .16);
}
.screen-stack::before {
    background: linear-gradient(135deg, rgba(0,153,255,.10), transparent 36%);
}
.stage-topbar,
.stage-topbar strong,
.stage-caption span {
    color: #58708e;
}
.stage-caption {
    background: #f2f9ff;
    border-color: rgba(0,153,255,.12);
}
.stage-caption strong {
    color: #10243f;
}
.floating-chip {
    color: #10243f;
    border-color: rgba(0,153,255,.18);
    background: rgba(255,255,255,.94);
    box-shadow: 0 18px 42px rgba(0,69,130,.14);
}
.floating-chip span {
    color: #0099ff;
}
.metrics-band {
    margin-top: -22px;
}
.metric-item,
.problem-card,
.module-card,
.glass-card,
.integration-card,
.quote-card,
.result-card,
.compare-card,
.final-cta,
.flow-step,
.faq-item {
    border-color: rgba(0, 153, 255, .12);
    background: #ffffff;
    box-shadow: 0 18px 45px rgba(0, 69, 130, .08);
}
.metric-item strong {
    color: #0099ff;
    font-size: clamp(1.8rem, 2.4vw, 2.6rem);
}
.metric-item span {
    color: #58708e;
}
.problem-card {
    border-top-color: #0099ff;
}
.problem-card > span,
.module-card span,
.price-card > span,
.flow-step span,
.text-link {
    color: #0099ff;
}
.operation-flow {
    gap: 12px;
}
.flow-step:not(:last-child)::after {
    background: rgba(0,153,255,.32);
}
.screens-gallery figure,
.module-visual {
    border-color: rgba(0,153,255,.12);
    background: #ffffff;
    box-shadow: 0 18px 45px rgba(0,69,130,.08);
}
.screens-gallery figcaption,
.module-card small {
    color: #355371;
}
.module-card img {
    background: #eef8ff;
}
.compare-card-primary {
    background: linear-gradient(135deg, #eaf7ff, #ffffff);
    border-color: rgba(0,153,255,.24);
}
.compare-card ul,
.price-card ul {
    color: #355371;
}
.price-card {
    background: linear-gradient(180deg, #ffffff, #f2f9ff);
    box-shadow: 0 24px 64px rgba(0,69,130,.12);
}
.price-card strong {
    color: #0099ff;
    font-size: clamp(2.8rem, 4vw, 3.5rem);
}
.price-card small,
.price-card p {
    color: #58708e;
}
.price-card .btn-secondary {
    color: #0c63a5;
    border-color: rgba(0,153,255,.18);
    background: #ffffff;
}
.lead-section {
    border-color: rgba(0,153,255,.16);
    background: linear-gradient(135deg, #eaf7ff, #ffffff);
    box-shadow: 0 24px 64px rgba(0,69,130,.10);
}
.lead-form {
    box-shadow: 0 22px 55px rgba(0,69,130,.12);
}
.final-cta {
    background: linear-gradient(135deg, #eaf7ff, #ffffff);
}
.site-footer {
    border-top-color: rgba(0,153,255,.14);
}
.wa-float {
    color: #ffffff;
    background: #16b864;
    box-shadow: 0 18px 42px rgba(22,184,100,.25);
}
@media (max-width: 980px) {
    .site-header { top: 14px; }
    .hero { min-height: auto; padding-top: 118px; }
}
@media (max-width: 700px) {
    h1 { font-size: clamp(2rem, 10vw, 3.05rem); }
    h2 { font-size: clamp(1.62rem, 8vw, 2.35rem); }
    .hero-proof-grid { grid-template-columns: 1fr; }
    .metrics-band { margin-top: 0; }
}