:root{--color-primary:#1a2332;--color-primary-light:#2c3e50;--color-accent:#d35400;--color-accent-hover:#d35400;--color-bg:#fff;--color-bg-alt:#f5f6f8;--color-bg-dark:#1a2332;--color-text:#2c3e50;--color-text-light:#5a6c7d;--color-text-on-dark:#fff;--color-border:#e1e5ea;--color-border-light:#eef0f2;--font-body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--font-mono:"SF Mono","Cascadia Code","Consolas",monospace;--container-max:1280px;--container-narrow:800px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--space-12:3rem;--space-16:4rem}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:100%;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font-body);font-size:1rem;line-height:1.65;color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--color-accent);text-decoration:none}a:hover{text-decoration:underline}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}
h1{font-size:clamp(1.75rem,4vw,2.5rem);line-height:1.2;font-weight:700;color:var(--color-primary);margin-bottom:var(--space-6)}
h2{font-size:clamp(1.35rem,3vw,1.75rem);line-height:1.3;font-weight:700;color:var(--color-primary);margin-top:var(--space-12);margin-bottom:var(--space-4)}
h3{font-size:1.2rem;line-height:1.4;font-weight:600;color:var(--color-primary-light);margin-top:var(--space-8);margin-bottom:var(--space-3)}
p{margin-bottom:var(--space-4)}
.container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 var(--space-4)}
.container--narrow{max-width:var(--container-narrow)}
.site-header{background:var(--color-primary);position:sticky;top:0;z-index:1000;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-4);height:64px;max-width:var(--container-max);margin:0 auto}
.site-logo{font-size:1.25rem;font-weight:700;color:var(--color-text-on-dark);text-decoration:none;white-space:nowrap;letter-spacing:-.02em}.site-logo span{color:var(--color-accent)}.site-logo:hover{text-decoration:none;opacity:.9}
.nav-primary{display:none}.nav-primary ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px}.nav-primary li{margin:0 4px;position:relative}.nav-primary a{color:rgba(255,255,255,.85);font-size:.9rem;font-weight:500;padding:10px 18px;display:block;border-bottom:2px solid transparent;transition:all .15s;text-decoration:none;white-space:nowrap}.nav-primary a:hover,.nav-primary .current-menu-item>a{color:#fff;border-bottom-color:var(--color-accent);text-decoration:none}.nav-primary .sub-menu{display:none;position:absolute;top:100%;left:0;background:var(--color-bg);min-width:200px;border-radius:var(--radius-sm);box-shadow:0 8px 24px rgba(0,0,0,.15);padding:8px 0;z-index:100}.nav-primary .sub-menu a{color:var(--color-text);font-size:.85rem;padding:8px 16px;border-bottom:none}.nav-primary .sub-menu a:hover{background:var(--color-bg-alt);color:var(--color-accent);border-bottom:none}.nav-primary li:hover>.sub-menu{display:block}
@media(min-width:992px){.nav-primary{display:flex;align-items:center;gap:var(--space-6)}}
.nav-toggle{display:block;background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:8px;min-width:48px;min-height:48px}@media(min-width:992px){.nav-toggle{display:none}}
.nav-primary.is-open{display:block;position:fixed;top:64px;left:0;right:0;bottom:0;background:var(--color-primary);padding:var(--space-6);overflow-y:auto;z-index:1001}.nav-primary.is-open ul{display:block}.nav-primary.is-open li{display:block}.nav-primary.is-open a{display:block;padding:12px 8px;font-size:1.1rem;border-bottom:1px solid rgba(255,255,255,.1)}.nav-primary.is-open a:hover{border-bottom-color:var(--color-accent)}.nav-primary.is-open .sub-menu{display:block;position:static;background:transparent;box-shadow:none;padding:0 0 0 16px;min-width:0}.nav-primary.is-open .sub-menu a{color:rgba(255,255,255,.7);font-size:.95rem;padding:8px}
.site-footer{background:var(--color-primary);color:rgba(255,255,255,.7);padding:var(--space-16) 0;margin-top:var(--space-16)}.site-footer a{color:rgba(255,255,255,.6);font-size:.9rem}.site-footer a:hover{color:var(--color-accent);text-decoration:none}.site-footer .container{text-align:center}.site-footer p{font-size:.85rem;margin:0}
.btn{display:inline-block;padding:12px 28px;border-radius:var(--radius-sm);font-weight:600;font-size:.95rem;text-align:center;cursor:pointer;transition:all .15s;border:none;min-height:48px;line-height:1.5;text-decoration:none}.btn-primary{background:var(--color-accent);color:#fff}.btn-primary:hover{background:var(--color-accent-hover);text-decoration:none;transform:translateY(-1px);box-shadow:0 4px 12px rgba(230,126,34,.3)}.btn-outline{background:transparent;color:var(--color-accent);border:2px solid var(--color-accent)}.btn-outline:hover{background:var(--color-accent);color:#fff;text-decoration:none}.btn-white{background:#fff;color:var(--color-primary)}.btn-white:hover{background:rgba(255,255,255,.9);text-decoration:none}
table{width:100%;border-collapse:collapse;margin:var(--space-6) 0;font-size:.95rem}thead{background:var(--color-primary);color:#fff}th{padding:12px 16px;text-align:left;font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.05em}td{padding:12px 16px;border-bottom:1px solid var(--color-border-light);font-family:var(--font-mono);font-size:.9rem}tbody tr:nth-child(even){background:var(--color-bg-alt)}
.card-grid{display:grid;gap:var(--space-6);grid-template-columns:1fr}@media(min-width:576px){.card-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:992px){.card-grid{grid-template-columns:repeat(3,1fr)}}
.product-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;transition:all .2s}.product-card:hover{border-color:var(--color-accent);box-shadow:0 8px 24px rgba(0,0,0,.08);transform:translateY(-2px)}
.product-card-img{background:var(--color-bg-alt);overflow:hidden;display:flex;align-items:center;justify-content:center;padding:20px;aspect-ratio:4/3}.product-card-img img{width:100%;height:100%;object-fit:contain}
.product-card-body{padding:var(--space-6)}.product-card h3{font-size:1.1rem;margin:0 0 var(--space-2)}.product-card p{font-size:.85rem;color:var(--color-text-light);margin-bottom:var(--space-4)}
.hero{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-light) 100%);color:var(--color-text-on-dark);padding:var(--space-16) 0}.hero h1{color:#fff;font-size:clamp(2rem,5vw,2.8rem);margin-bottom:var(--space-6);max-width:700px}.hero p{font-size:1.15rem;opacity:.9;margin-bottom:var(--space-8);max-width:600px}.hero-cta{display:flex;gap:var(--space-4);flex-wrap:wrap}
.trust-bar{display:flex;justify-content:center;gap:var(--space-8);flex-wrap:wrap;padding:var(--space-8) var(--space-4);background:var(--color-bg-alt);border-bottom:1px solid var(--color-border-light)}.trust-bar div{text-align:center}.trust-bar b{display:block;font-size:2rem;color:var(--color-accent)}.trust-bar span{font-size:.8rem;color:var(--color-text-light);text-transform:uppercase;letter-spacing:.05em}
.home-section{padding:var(--space-16) 0}.home-section--alt{background:var(--color-bg-alt)}.home-section h2{text-align:center;margin-top:0;margin-bottom:var(--space-12)}.home-wrap{max-width:var(--container-max);margin:0 auto;padding:0 var(--space-4)}
.faq-item{border:1px solid var(--color-border);border-radius:var(--radius-sm);margin-bottom:var(--space-2);overflow:hidden;padding:var(--space-4)}
.faq-item h3{font-size:1rem;margin:0 0 var(--space-2);cursor:pointer;color:var(--color-primary)}
.faq-answer{padding:0 0 var(--space-2)}
.cta-block{background:var(--color-bg-dark);color:var(--color-text-on-dark);padding:var(--space-16) 0;text-align:center;margin:var(--space-16) 0}.cta-block h2{color:#fff;margin-bottom:var(--space-4)}.cta-block p{opacity:.85;max-width:600px;margin:0 auto var(--space-8)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:767px){.hero{padding:var(--space-12) 0}.home-section{padding:var(--space-12) 0}}
.blog-post .post-header{margin-bottom:var(--space-8);padding-bottom:var(--space-6);border-bottom:2px solid var(--color-border-light)}.blog-post .post-meta{font-size:.9rem;color:var(--color-text-light);margin-top:var(--space-2)}.entry-content{font-size:1.05rem;line-height:1.75}.entry-content h2{margin-top:var(--space-12);padding-bottom:var(--space-2);border-bottom:1px solid var(--color-border-light)}.entry-content blockquote{border-left:4px solid var(--color-accent);padding:var(--space-4) var(--space-6);margin:var(--space-6) 0;background:var(--color-bg-alt);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-style:italic;color:var(--color-text-light)}.product-category .spec-table-wrap{overflow-x:auto}.product-detail .spec-table-wrap{overflow-x:auto}.technical-doc{max-width:var(--container-narrow)}.case-study .case-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--space-6);margin:var(--space-8) 0}.case-stat{text-align:center;padding:var(--space-6);background:var(--color-bg-alt);border-radius:var(--radius-md)}.case-stat-number{font-size:2rem;font-weight:700;color:var(--color-accent);display:block}.case-stat-label{font-size:.85rem;color:var(--color-text-light)}.about-gallery{display:grid;gap:var(--space-6);grid-template-columns:1fr}@media(min-width:576px){.about-gallery{grid-template-columns:repeat(3,1fr)}}.about-gallery img{border-radius:var(--radius-md);width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--color-bg-alt)}.about-gallery figcaption{text-align:center;font-size:.85rem;color:var(--color-text-light);margin-top:var(--space-2)}.breadcrumb{font-size:.85rem;color:var(--color-text-light);padding:10px 0}.breadcrumb a{color:var(--color-text-light)}.breadcrumb a:hover{color:var(--color-accent)}.breadcrumb .separator{margin:0 6px;color:var(--color-border)}.breadcrumb{background:transparent;padding:10px 0;font-size:.85rem;color:var(--color-text-light)}.breadcrumb a{color:var(--color-text-light)}.breadcrumb a:hover{color:var(--color-accent)}.breadcrumb .separator{margin:0 6px;color:var(--color-border)}main>.container:first-child{background:var(--color-bg-alt);border-bottom:1px solid var(--color-border-light)}.faq-item{border:1px solid var(--color-border);border-radius:var(--radius-sm);margin-bottom:8px;overflow:hidden}.faq-item h3{padding:16px 20px;font-size:1rem;cursor:pointer;margin:0;background:var(--color-bg);position:relative}.faq-item h3::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:1.3rem;color:var(--color-accent)}.faq-answer{padding:0 20px 16px;font-size:.95rem;line-height:1.6;color:var(--color-text-light)}.price-tag{background:var(--color-accent);color:#fff;padding:6px 14px;border-radius:4px;font-weight:600;font-size:.9rem}.meta-tag{background:var(--color-bg);border:1px solid var(--color-border);padding:6px 14px;border-radius:4px;font-size:.85rem;color:var(--color-text-light)}.product-hero{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}@media(max-width:767px){.product-hero{grid-template-columns:1fr}}
/* ---- Width constraints by template type ---- */
.container--narrow{max-width:800px;margin:0 auto;padding:0 var(--space-4)}.technical-doc,.blog-post,.scenario-page{max-width:800px;margin:0 auto}.product-category,.product-detail,.application-page{max-width:1280px;margin:0 auto}.collection-page{max-width:var(--container-max);margin:0 auto}
/* ---- FAQ accordion (details/summary) ---- */
.faq-item details{border:1px solid var(--color-border);border-radius:var(--radius-sm);margin-bottom:8px}.faq-item summary{padding:16px 20px;cursor:pointer;font-weight:600;list-style:none;background:var(--color-bg);border-radius:var(--radius-sm)}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary::after{content:"+";float:right;color:var(--color-accent);font-size:1.3rem;line-height:1}.faq-item details[open] summary::after{content:"−"}.faq-item details[open] summary{border-radius:var(--radius-sm) var(--radius-sm) 0 0}.faq-item .faq-answer{padding:0 20px 16px;color:var(--color-text-light);line-height:1.6;font-size:.95rem}
@media print{.site-header,.site-footer,.nav-toggle,.cta-block,.btn{display:none!important}body{font-size:12pt;color:#000}}

/* ============================================================
 *  Mobile Responsive — template-by-template approach
 *  Every hero section must use class="hero-split"
 *  Every grid must use class="resp-grid" (auto-fit, auto-wrap)
 *  Forms use class="resp-form" (stacks on mobile)
 * ============================================================ */
@media(max-width:767px){
  /* ===== GLOBAL: typography + spacing ===== */
  h1{font-size:1.5rem!important}h2{font-size:1.15rem!important}h3{font-size:1.0rem!important}
  .container{padding:0 12px!important}
  /* Redefine spacing variables for mobile — shrinks ALL inline var(--space-*) usage */
  :root{--space-4:0.5rem;--space-6:0.75rem;--space-8:1rem;--space-10:1.25rem;--space-12:1.5rem;--space-16:2rem}
  /* Gray decision/comparison boxes — reduce heavy padding */
  section[style*="var(--color-bg-alt)"][style*="border-radius"]{padding:10px!important;margin-bottom:12px!important}
  section[style*="var(--color-bg-alt)"][style*="border-radius"] h2{font-size:1rem!important;margin-bottom:8px!important}
  section[style*="var(--color-bg-alt)"][style*="border-radius"] table{font-size:.75rem!important}
  section[style*="var(--color-bg-alt)"][style*="border-radius"] th,
  section[style*="var(--color-bg-alt)"][style*="border-radius"] td{padding:6px 8px!important}
  /* Shrink common hardcoded gaps/margins */
  div[style*="gap:24px"]{gap:10px!important}
  div[style*="gap:20px"]{gap:10px!important}
  div[style*="gap:32px"],div[style*="gap:40px"],div[style*="gap:48px"]{gap:12px!important}

  /* ===== HERO: consistent across all pages ===== */
  /* All hero sections — no dark gradient, no padding */
  section.hero-split,section.hero{padding:0!important;background:var(--color-bg)!important;color:var(--color-text)!important}
  section.hero-split>.container,section.hero>.container{flex-direction:column!important;padding:0!important}
  /* Photo — full width, no border-radius */
  .hero-photo{min-width:100%!important;order:-1;border-radius:0!important}
  .hero-photo img,img[style*="aspect-ratio"]{border-radius:0!important;box-shadow:none!important;width:100%!important;aspect-ratio:16/9!important;object-fit:cover!important;max-height:280px!important}
  /* Text — white bg, left aligned */
  .hero-text{padding:20px 16px 24px!important;text-align:left!important;min-width:100%!important;flex:none!important}
  .hero-text h1{color:var(--color-primary)!important;font-size:1.3rem!important;margin-bottom:8px!important}
  .hero-text p{color:var(--color-text-light)!important;font-size:.9rem!important}
  /* Hide decorative elements */
  section.hero-split div[style*="height:4px"],section.hero div[style*="height:4px"]{display:none!important}
  section.hero-split div[style*="font-size:.8rem"]{display:none!important}

  /* ===== TRUST BAR: compact 2-line ===== */
  .trust-bar{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:8px!important;padding:12px 8px!important}
  .trust-bar div{padding:4px 0!important}
  .trust-bar b{font-size:1.3rem!important}
  .trust-bar span{font-size:.68rem!important}

  /* ===== GRIDS: default single column, products/downloads stay 2-col ===== */
  .resp-grid,div[style*="display:grid"][style*="repeat(auto-fill"]{grid-template-columns:1fr!important;gap:10px!important}
  .card-grid{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}
  div[style*="repeat(auto-fit"][style*="minmax"]{grid-template-columns:repeat(2,1fr)!important;gap:8px!important}
  /* Product cards */
  .product-card-img{height:auto!important;aspect-ratio:1!important;padding:8px!important}
  .product-card-img img{object-fit:contain!important;width:100%!important;height:100%!important}
  .product-card-body{padding:10px!important}
  .product-card h3,.product-card h3 a{font-size:.8rem!important;line-height:1.2!important;margin:0 0 4px!important}
  .product-card p{display:none!important}
  .product-card .price-tag{font-size:.68rem!important;padding:2px 6px!important}
  .product-card .btn,.product-card .btn-outline{font-size:.7rem!important;padding:5px 8px!important;display:block!important;width:100%!important;text-align:center!important;margin-top:4px!important}
  /* Scene/industry cards (square image + title) */
  a[style*="aspect-ratio:1"] + div,
  div[style*="aspect-ratio:1"] ~ div{padding:6px 8px!important}
  a[style*="aspect-ratio:1"] + div h3,
  div[style*="aspect-ratio:1"] ~ div h3,
  a div[style*="padding:var(--space-5)"] h3{font-size:.78rem!important;line-height:1.2!important}
  /* Blog list (2-column) */
  article[style*="padding:10px 0"] h3,
  article[style*="border-bottom:1px solid"] h3{font-size:.82rem!important}
  article[style*="border-bottom:1px solid"] div{font-size:.7rem!important}
  /* Entry content — limit paragraphs */
  .entry-content p{-webkit-line-clamp:3!important;overflow:hidden!important;display:-webkit-box!important;-webkit-box-orient:vertical!important}
  /* Tags and badges */
  .price-tag{font-size:.7rem!important;padding:3px 8px!important}
  .meta-tag{font-size:.7rem!important;padding:3px 8px!important}
  span[style*="rgba(230,126,34,.08)"]{font-size:.65rem!important;padding:1px 4px!important}
  /* FAQ more compact */
  .faq-item summary{font-size:.85rem!important;padding:14px 16px!important}
  .faq-answer{font-size:.85rem!important;padding:0 14px 12px!important}

  /* ===== CONTENT WIDTH: full ===== */
  .resp-content{max-width:100%!important;padding-left:var(--space-4)!important;padding-right:var(--space-4)!important}

  /* ===== FORMS: stacked ===== */
  .resp-form-row{grid-template-columns:1fr!important}
  form input,form textarea{font-size:16px!important} /* prevent iOS zoom */

  /* ===== TABLES: scroll ===== */
  table{font-size:.82rem!important}th,td{padding:8px 10px!important}

  /* ===== BLOG: author card stacks ===== */
  .author-card{flex-direction:column!important;text-align:center!important}

  /* ===== PRODUCT PAGE: hero stacks ===== */
  .product-hero{grid-template-columns:1fr!important}

  /* ===== CTA: reduced ===== */
  .cta-block{padding:var(--space-10) 0!important}
  .cta-block h2{font-size:1.2rem!important}

  /* ===== SECTION SPACING: reduced ===== */
  .resp-section{padding:var(--space-8) 0!important}
  /* Pillar pain points / choice factors — single column (text too long for 2-col) */
  section h2[style*="border-bottom"] + div.resp-grid{grid-template-columns:1fr!important}
  /* Footer */
  .site-footer>div>div:first-child{grid-template-columns:repeat(2,1fr)!important;gap:24px!important}
  .site-footer h4{font-size:.9rem!important;margin-bottom:8px!important}
  .site-footer li{margin-bottom:4px!important}
  .site-footer a{font-size:.78rem!important}
}
