/* AltoChip v2 visual layer — deep navy / cold white / graphite / muted copper
   Loads after the inline base styles and refines them. */
:root{
  --copper:#b0793f;      /* muted copper accent */
  --copper-soft:#f3e9dd; /* copper tint background */
  --graphite:#3c434b;
}
/* headline accent bar → copper gradient */
h2::before{background:linear-gradient(90deg,var(--copper),#d9a86a)!important}
/* tags: core product wears copper, keeps hierarchy */
.tag{background:var(--copper-soft);color:#8a5a26}
.tag.soon{background:#eef0f2;color:#6b737c}
/* step numbers → graphite circles with copper ring */
.step::before{background:var(--graphite);box-shadow:0 0 0 2px var(--copper-soft)}
/* door cards: hover lift + copper edge */
.door{transition:box-shadow .18s,transform .18s;border-top:3px solid transparent}
.door:hover{box-shadow:0 10px 28px rgba(18,35,63,.10);transform:translateY(-2px);border-top-color:var(--copper)}
/* buttons: primary stays navy-blue; ghost hover picks copper */
.btn-ghost:hover{border-color:#d9a86a;color:#f3e2cc}
/* table header: navy → graphite gradient */
th{background:linear-gradient(180deg,#16283f,#1f3350)}
/* footer link hover */
footer a:hover{color:#d9a86a}
/* form focus ring softened */
input:focus,select:focus,textarea:focus{outline-color:#e5d3bd}
/* hero caption + badges slightly warmer */
.badge::before{color:#d9a86a}
/* ===== mobile refinements ===== */
@media(max-width:820px){
  .hero{padding:52px 0 44px;background-position:70% center}
  .hero h1{font-size:27px}
  .hero p.sub{font-size:16px}
  .badges{gap:12px;margin-top:26px}
  section{padding:44px 0}
  .steps{grid-template-columns:1fr 1fr}
  table{font-size:13px;display:block;overflow-x:auto;white-space:nowrap}
  .nav-links{gap:12px}
}
@media(max-width:480px){
  .steps{grid-template-columns:1fr}
  .cta-row .btn{width:100%;text-align:center}
}
.image-rail{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:30px}
.image-tile{min-height:190px;border-radius:12px;overflow:hidden;position:relative;background:#132537;background-size:cover;background-position:center;display:flex;align-items:flex-end;padding:18px;color:#fff}
.image-tile:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(12,25,39,.86),transparent 70%)}
.image-tile span{position:relative;z-index:1;font-size:13px;font-weight:700;letter-spacing:.02em}
.image-inspection{background-image:url('inspection-components.jpg')}.image-inventory{background-image:url('inventory.jpg')}.image-packing{background-image:url('packing.jpg')}.image-components{background-image:url('components.jpg')}
.reach{background:#f4f6f8}.reach-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:center}.reach-copy h2{margin-bottom:12px}.reach-copy p{color:var(--grey);font-size:15px;max-width:520px}.reach-map{border-radius:16px;overflow:hidden;box-shadow:0 12px 30px rgba(18,35,63,.12)}.reach-map img{display:block;width:100%;height:auto}
.delivery-banner{position:relative;background:linear-gradient(90deg,rgba(12,25,39,.96) 0%,rgba(12,25,39,.80) 46%,rgba(12,25,39,.28) 100%),url('airport-delivery.jpg') center/cover;color:#fff;min-height:300px;display:flex;align-items:center}.delivery-inner{width:100%}.delivery-banner .eyebrow{color:#d9a86a;margin-bottom:12px}.delivery-banner h2{color:#fff;max-width:570px;margin-bottom:12px}.delivery-banner h2:before{display:none}.delivery-banner p:not(.eyebrow){color:#d2dce4;max-width:520px;font-size:15px}
@media(max-width:820px){.image-rail{grid-template-columns:1fr 1fr}.reach-grid{grid-template-columns:1fr}.image-tile{min-height:150px}}
@media(max-width:480px){.image-rail{grid-template-columns:1fr}.image-tile{min-height:180px}}

.reach-mail{display:inline-block;margin-top:20px}

/* product table category blocks */
tr.cat td{background:var(--copper-soft)!important;color:#8a5a26;font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:7px 14px;border-top:1px solid #e8d9c3}
tr.cat:hover td{background:var(--copper-soft)!important}

/* mailto fallback */
.mail-fb{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);font-size:12.5px;color:var(--grey)}
.mail-fb textarea{margin-top:8px;font-size:12px;min-height:96px;font-family:inherit}
.mail-fb .fb-copy{width:auto!important;margin-top:8px!important;padding:7px 16px;font-size:13px}

/* whatsapp + form success */
.wa-btn{background:#1fa855;color:#fff}.wa-btn:hover{background:#178a45}
.contact-row{margin:-14px 0 26px}
.fb-ok{color:var(--ok);font-weight:600;font-size:14px}

/* product page (P1) */
.tag.instock{background:#e2f5ec;color:#0e7a51}
.tag.nco{background:#f1f1f1;color:#9aa1a9}
.pn-note{font-size:12.5px;color:var(--grey);margin-top:12px;max-width:720px}
.ev-grid{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:22px}
@media(max-width:820px){.ev-grid{grid-template-columns:1fr}}
.sn-sample{margin-top:14px}
.sn-sample table{font-size:11.5px}
.sn-sample th{padding:6px 8px;font-size:11px}
.sn-sample td{padding:6px 8px}
.sn-cap{font-size:11px;color:var(--grey);margin-top:6px;font-style:italic}
.cond-list{list-style:none;max-width:680px}
.cond-list li{padding:9px 0 9px 26px;position:relative;border-bottom:1px solid var(--line);font-size:14.5px}
.cond-list li::before{content:"\2713";position:absolute;left:0;color:#1baf7a;font-weight:700}

/* shipping page (P2) */
.trio{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.trio.duo{grid-template-columns:1fr 1fr}
@media(max-width:600px){.trio,.trio.duo{grid-template-columns:1fr}}

/* evidence page (P3) */
.ev5{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
@media(max-width:820px){.ev5{grid-template-columns:1fr}}
.nav .logo{margin-right:16px}

/* policy pages (P4) */
.pol-hero{background:var(--navy);color:#fff;padding:56px 0 40px}
.pol-hero h1{font-size:32px;letter-spacing:-.4px}
.pol-hero .lead{color:#c6d2e2;margin-top:14px;margin-bottom:0}
.pol-hero .lead a{color:#d9a86a}
.pol-crumbs{margin-top:18px;font-size:13px;color:#8fa3bd}
.pol-crumbs a{color:#d9a86a;text-decoration:none}
.pol-updated{margin-top:6px;font-size:11.5px;color:#6d7f99}
.pol ul{list-style:none;max-width:760px}
.pol li{padding:8px 0 8px 24px;position:relative;font-size:14.5px;border-bottom:1px solid var(--line)}
.pol li::before{content:"\2014";position:absolute;left:0;color:var(--copper)}
.pol p{max-width:760px;font-size:14.5px;color:var(--ink);margin-bottom:12px}
.pol a{color:var(--accent2)}
.policy-links{margin-top:16px;font-size:12.5px;color:#93a5bd}
.policy-links a{color:#c6d2e2;text-decoration:none}
