/* Blueprint engineering theme for the ACE container supplier site.
   v2 component system, aisi palette (deep blueprint navy, steel blue
   accent, paper background, plain sans body). Layout, spacing, hierarchy
   and colour application change; text and page structure do not. */
/* Adapter note: site class names are kept. v2 system classes are mapped
   onto them below (brandbar, grouped nav rows, hero, evidence row,
   alternating section titles, dark inquiry band). */
:root{--ink:#1c2b36;--paper:#f7f9fb;--accent:#2f6f9f;--deep:#0b2a4a;--line:#c9d6e0;--soft:#e8f0f6;--card:#ffffff}
*{box-sizing:border-box}
body.site{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);line-height:1.65}
a{color:var(--deep)}a:hover{color:var(--accent)}
/* --- header: brandbar with solid inquiry button + grouped nav rows --- */
.site-header{background:var(--deep);color:#fff;padding:16px 5vw 0}
.brandbar{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-bottom:10px}
.brand{font-size:22px;font-weight:700;flex:1;min-width:0}
.brand-mark{font-weight:700;letter-spacing:.02em}
.brand-cta{flex-shrink:0}
.brand-cta-btn{display:inline-block;background:var(--accent);color:#fff !important;padding:11px 22px;text-decoration:none;font-weight:700;font-size:15px;border-radius:3px;box-shadow:0 2px 6px rgba(11,42,74,.25)}
.brand-cta-btn:hover{background:#1d5a83;color:#fff}
.mainnav{background:#fff;border-top:2px solid var(--deep);border-bottom:1px solid var(--line);margin:10px -5vw 0;min-width:0}
.nav-primary{display:flex;gap:22px;padding:11px 5vw 10px;flex-wrap:wrap;border-bottom:1px solid var(--line);min-width:0}
.nav-primary a{text-decoration:none;color:var(--ink);font-size:16px;font-weight:700;white-space:nowrap}
.nav-primary a:hover{color:var(--accent);text-decoration:underline}
.nav-secondary{display:flex;gap:18px;padding:8px 5vw;flex-wrap:wrap;border-bottom:1px solid var(--line);min-width:0}
.nav-secondary a{text-decoration:none;color:#4a5a64;font-size:13px;white-space:nowrap}
.nav-secondary a:hover{color:var(--accent);text-decoration:underline}
.nav-tertiary{display:flex;gap:18px;padding:8px 5vw;flex-wrap:wrap;min-width:0}
.nav-tertiary a{text-decoration:none;color:#4a5a64;font-size:13px;white-space:nowrap}
.nav-tertiary a:hover{color:var(--accent);text-decoration:underline}
.nav-link{color:#d7e6f2;text-decoration:none}
.nav-link:hover{text-decoration:underline}
/* --- hero: compact block, evidence as cards --- */
.site-main{max-width:880px;margin:0 auto;padding:28px 5vw 10px}
.hero-block{padding:28px 0 22px;border-bottom:3px solid var(--accent)}
.hero-title{font-size:36px;line-height:1.15;margin:0 0 12px;color:var(--deep)}
.lead{font-size:18px;line-height:1.6;max-width:840px}
.evidence{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-top:18px;list-style:none}
.evidence-item{border:1px solid var(--line);border-top:4px solid var(--accent);background:#fff;padding:12px 16px;font-size:14px;color:#334d63}
/* --- sections: panels with alternating title treatments --- */
.panel{background:#fff;border:1px solid var(--line);border-left:5px solid var(--accent);margin:20px 0;padding:18px 22px}
.section-title{font-size:26px;line-height:1.25;color:var(--deep);margin:0 0 10px}
.site-main .panel:nth-of-type(odd) .section-title::after{content:"";display:block;height:3px;width:64px;background:var(--accent);margin-top:10px}
.site-main .panel:nth-of-type(even) .section-title{border-left:0;background:var(--deep);color:#fff;padding:12px 16px}
.site-main .panel p{font-size:17px;line-height:1.85;margin:0 0 1.15em}
.motif{margin:14px 0 4px}
.motif-cat svg,.motif-guide svg,.motif-confirm svg,.motif-main svg{display:block;width:100%;height:24px}
/* --- inquiry band, callout, related, source note --- */
.cta{margin:26px 0;padding:28px 22px;background:var(--deep);color:#fff}
.cta-title{font-size:24px;font-weight:700;margin:0 0 8px;color:#fff}
.cta-link{display:inline-block;background:var(--accent);color:#fff !important;padding:12px 22px;text-decoration:none;font-weight:700}
.cta-link:hover{background:#1d5a83;color:#fff}
.callout{border:2px solid var(--deep);background:#fff;padding:18px;margin:22px 0}
.related-heading{font-weight:700;font-size:18px;margin:30px 0 6px}
.related-list{list-style:none;padding:0}
.related-list li{margin:6px 0}
.source-note{font-size:14px;color:#5a6b78}
/* --- footer --- */
.site-footer{background:var(--deep);color:#d7e6f2;padding:34px 5vw;margin-top:30px}
.foot-brand{font-weight:700;margin-bottom:10px}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 14px;margin:8px 0}
.foot-meta{margin-top:12px}
.muted{color:#5a6b78}
/* --- forms --- */
.inquiry-form{background:#fff;border:1px solid var(--line);padding:22px;margin:20px 0;max-width:640px}
.field{display:block;margin:12px 0;font-weight:700}
.text-input{display:block;width:100%;max-width:560px;margin-top:6px;padding:10px;border:1px solid #999;font-size:16px}
.message-input{display:block;width:100%;max-width:560px;min-height:140px;margin-top:6px;padding:10px;border:1px solid #999;font-size:16px}
.submit-btn{background:var(--accent);color:#fff;border:0;padding:13px 26px;font-size:16px;font-weight:700;cursor:pointer}
.submit-btn:hover{background:#1d5a83}
.contact-block{background:#fff;border:1px solid var(--line);padding:18px 22px;margin:20px 0}
.blog-list{list-style:disc;margin-left:20px}
.blog-item{margin:8px 0}
.drawing-note{font-size:14px;color:#334d63}
/* --- tablet: evidence as one compact row of five --- */
@media (max-width:1100px){
.evidence{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.evidence-item{padding:10px 12px}
}
/* --- mobile: compact header, scroll-row nav + evidence row with fade cues --- */
@media (max-width:640px){
.site-header{padding:12px 4vw 0}
.brandbar{padding-bottom:6px}
.brand{font-size:20px}
.brand-cta-btn{padding:8px 14px;font-size:14px}
.mainnav{margin:8px -4vw 0}
.nav-primary,.nav-secondary,.nav-tertiary{flex-wrap:nowrap;overflow-x:auto;padding-left:4vw;padding-right:4vw;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,#000 88%,transparent 100%)}
.nav-primary::-webkit-scrollbar,.nav-secondary::-webkit-scrollbar,.nav-tertiary::-webkit-scrollbar{display:none}
.nav-primary{gap:16px;padding-top:7px;padding-bottom:7px}
.nav-secondary,.nav-tertiary{gap:14px;padding-top:6px;padding-bottom:6px}
.hero-block{padding:16px 0 12px}
.hero-title{font-size:26px}
.lead{font-size:16px;line-height:1.55}
.site-main{padding:20px 4vw 10px}
.section-title{font-size:23px}
.panel{padding:16px 18px}
.evidence{display:flex;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:6px;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,#000 88%,transparent 100%)}
.evidence-item{flex:0 0 230px;scroll-snap-align:start}
.site-footer{padding:24px 4vw}
}