:root{--ink:#15181c;--ink2:#2a2f37;--steel:#5b6470;--line:#e4e7ec;--bg:#f6f7f9;--card:#fff;
  --or:#ff671f;--or-dk:#c94f12;--maxw:900px;--shadow:0 1px 2px rgba(20,24,28,.06),0 4px 14px rgba(20,24,28,.06)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:var(--or-dk)}
h1,h2,h3,.kicker,.btn,.nav a,.legend,.badge,.more{font-family:"Roboto Condensed",Arial,sans-serif}
h1{font-size:clamp(30px,6vw,44px);line-height:1.08;margin:.2em 0 .35em;font-weight:800}
h2{font-size:clamp(23px,4.4vw,30px);line-height:1.15;margin:1.6em 0 .45em;font-weight:800}
h3{font-size:20px;line-height:1.2;margin:1.1em 0 .3em;font-weight:700}
strong{color:#000}
/* masthead */
.mast{background:var(--ink);color:#fff}
.mast-in{max-width:var(--maxw);margin:0 auto;padding:14px 16px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.logo img{width:190px;height:auto;display:block}
.mast-meta{display:flex;flex-direction:column;gap:2px;font-size:15px}
.mast-meta a{color:#fff;text-decoration:none}
.mphone{font:800 24px "Roboto Condensed",Arial,sans-serif;color:var(--or)!important}
.maddr{text-decoration:underline!important;text-underline-offset:3px;color:#d5dae0!important}
.mhours{color:#aab2bb}
.nav{display:flex;gap:4px;overflow-x:auto;max-width:var(--maxw);margin:0 auto;padding:0 12px 10px}
.nav a{color:#fff;text-decoration:none;font-weight:700;font-size:15px;padding:6px 10px;border-radius:6px;white-space:nowrap;background:#23282f}
.nav a:hover{background:var(--or)}
.crumbs{max-width:var(--maxw);margin:0 auto;padding:12px 16px 0;font-size:14px;color:var(--steel)}
.crumbs a{color:var(--steel)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 16px 30px}
.hero{padding:10px 0 4px}
.kicker{color:var(--or-dk);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:14px;margin:12px 0 0}
.lead{font-size:20px;color:var(--ink2)}
.aka{color:var(--steel);font-size:15px;margin-top:-6px}
/* figures */
.figs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0 6px}
.fig{margin:0}
.figbox{background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px;box-shadow:var(--shadow)}
.figbox svg{width:100%;height:auto;display:block}
figcaption{font-size:14px;color:var(--steel);margin-top:6px}
.hubdiag{display:grid;grid-template-columns:3fr 2fr;gap:16px;align-items:start;margin:14px 0}
/* legend */
.legend{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr;gap:4px;font-size:17px}
.alltrims .legend{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.legend li{display:flex;gap:8px;align-items:center}
.legend a{color:var(--ink);font-weight:700;text-decoration:none}
.legend a:hover{color:var(--or-dk);text-decoration:underline}
.legend .n{flex:0 0 26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}
.legend li.on .n{background:var(--or)}
/* facts / toc */
.facts{background:#fff;border-left:6px solid var(--or);border-radius:10px;padding:6px 18px 10px;box-shadow:var(--shadow);margin:18px 0}
.facts .h-sm{font-size:21px;margin:.6em 0 .3em}
.facts dl{margin:0;display:grid;grid-template-columns:150px 1fr;gap:6px 14px}
.facts dt{font-weight:700;font-family:"Roboto Condensed",Arial,sans-serif;color:var(--or-dk)}
.facts dd{margin:0}
.toc{background:#eef0f3;border-radius:10px;padding:12px 18px;margin:18px 0;font-size:16px}
.toc ol{margin:6px 0 0;padding-left:22px;columns:2;column-gap:28px}
.toc a{color:var(--ink)}
section ul,section ol{padding-left:24px}
li{margin:.25em 0}
ol.steps{counter-reset:s;list-style:none;padding-left:0}
ol.steps li{counter-increment:s;position:relative;padding-left:42px;margin:.6em 0}
ol.steps li:before{content:counter(s);position:absolute;left:0;top:1px;width:30px;height:30px;border-radius:50%;background:var(--or);color:#fff;font:800 16px/30px "Roboto Condensed",Arial,sans-serif;text-align:center}
.qa{background:#fff;border:1px solid var(--line);border-radius:10px;padding:2px 16px 4px;margin:10px 0}
.qa h3{font-size:19px}
/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);text-decoration:none;color:var(--ink);overflow:hidden;transition:transform .12s,border-color .12s}
.card:hover{transform:translateY(-2px);border-color:var(--or)}
.cardpic{background:#fafbfc;border-bottom:1px solid var(--line);padding:6px}
.cardpic svg{width:100%;height:150px;display:block}
.cardtx{padding:10px 14px 14px;display:flex;flex-direction:column;flex:1}
.cardtx h3{margin:.2em 0 .2em}
.cardtx p{margin:0 0 10px;font-size:15.5px;line-height:1.45;color:var(--ink2);flex:1}
.more{font-weight:700;color:var(--or-dk);font-size:16px}
.badge{align-self:flex-start;background:var(--or);color:#fff;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:2px 8px;border-radius:20px}
.checklist{background:#fff;border-radius:12px;padding:4px 20px 12px;box-shadow:var(--shadow);margin-top:26px}
/* buttons + CTA */
.btn{display:inline-block;background:var(--or);color:#fff!important;text-decoration:none;font-weight:700;font-size:17px;padding:11px 16px;border-radius:8px;margin:4px 6px 4px 0}
.btn.ghost{background:#fff;color:var(--ink)!important;border:2px solid var(--ink)}
.ctaband{background:var(--ink);color:#fff;border-radius:14px;padding:18px 20px 16px;margin:34px 0 10px}
.ctaband h2{margin:.1em 0 .3em;color:#fff}
.ctaband p{color:#cfd5db;margin:0 0 10px}
.btns{display:flex;flex-wrap:wrap;gap:8px}
.btns .btn{margin:0}
.btn.text{background:#2e7d32}.btn.mail{background:#3b4652}.btn.dir{background:#fff;color:var(--ink)!important}
.related,.alltrims{margin-top:10px}
/* footer */
.foot{background:var(--ink);color:#cfd5db;margin-top:30px;font-size:15px}
.foot-in{max-width:var(--maxw);margin:0 auto;padding:22px 16px 6px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.foot a{color:#fff}
.foot strong{color:#fff}
.fine{max-width:var(--maxw);margin:0 auto;padding:8px 16px 22px;font-size:13px;color:#8d96a0}
@media (max-width:700px){
  .figs,.hubdiag,.foot-in{grid-template-columns:1fr}
  .toc ol{columns:1}
  .facts dl{grid-template-columns:1fr;gap:0}
  .facts dd{margin-bottom:8px}
  .logo img{width:150px}
  .nav{flex-wrap:wrap;overflow:visible}
  .nav a{font-size:14px;padding:5px 9px}
  .mphone{font-size:22px}
  .btns .btn{flex:1 1 100%;text-align:center}
}
/* ---------- dark hub: trim box grid ---------- */
body.dark{--maxw:1240px;background:#0f1216;color:#e6eaee}
.dark strong{color:#fff}
.dark .crumbs,.dark .crumbs a{color:#8d96a0}
.dark .hubhero h1{color:#fff;margin-bottom:.25em}
.dark .lead{color:#b8c0c8;font-size:19px;max-width:820px}
.dark .kicker{color:var(--or)}
.herobtns{display:flex;flex-wrap:wrap;gap:8px}
.herobtns .btn{margin:0}
.dark .btn.ghost{background:transparent;color:#fff!important;border:2px solid #fff}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 14px}
.chips button{font:700 15px "Roboto Condensed",Arial,sans-serif;color:#d5dae0;background:#1a1f26;border:1px solid #333b45;border-radius:20px;padding:7px 16px;cursor:pointer}
.chips button:hover{border-color:var(--or)}
.chips button.on{background:var(--or);border-color:var(--or);color:#fff}
.tgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (min-width:700px){.tgrid{grid-template-columns:repeat(3,1fr);gap:16px}}
@media (min-width:960px){.tgrid{grid-template-columns:repeat(4,1fr)}}
@media (min-width:1180px){.tgrid{grid-template-columns:repeat(5,1fr)}}
.tbox{display:flex;flex-direction:column;background:#1a1f26;border:1px solid #2a313a;border-radius:14px;overflow:hidden;
  text-decoration:none;color:#e6eaee;transition:transform .14s,border-color .14s,box-shadow .14s}
.tbox:hover,.tbox:focus-visible{transform:translateY(-3px);border-color:var(--or);box-shadow:0 10px 26px rgba(0,0,0,.45)}
.tbox[hidden]{display:none}
.tpic{position:relative;background:radial-gradient(circle at 50% 40%,#262d36,#161a20);border-bottom:3px solid var(--or);padding:10px 8px 6px}
.tpic svg{width:100%;height:124px;display:block}
.tpic svg .prof{stroke-width:5}
.trow{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}
.trow .badge{font-size:10.5px;padding:1px 7px;align-self:center}
.ttx{padding:10px 14px 14px;display:flex;flex-direction:column;flex:1}
.tcat{font:700 12px "Roboto Condensed",Arial,sans-serif;color:var(--or);text-transform:uppercase;letter-spacing:.07em}
.tbox h2{font-size:21px;line-height:1.12;margin:.15em 0 .3em;color:#fff}
.ttx p{font-size:14.5px;line-height:1.45;color:#aab2bb;margin:0 0 12px;flex:1}
.tgo{align-self:stretch;text-align:center;font:700 15px "Roboto Condensed",Arial,sans-serif;color:#fff;background:#262d36;
  border:1px solid var(--or);border-radius:8px;padding:7px 8px;transition:background .14s}
.tbox:hover .tgo{background:var(--or)}
/* drawings recolored for the dark boxes */
.dark svg.prof .prof2{stroke:#e6eaee}
.dark svg.prof .under,.dark svg.prof .panel{stroke:#7d8893}
.dark svg.prof .frm{fill:#2c333c;stroke:#7d8893}
.dark svg.prof .slab{stroke:#7d8893}
.dark svg.prof .pl{fill:#e6eaee}
.dark svg.prof .pl.or{fill:#ff8a4c}
.dark svg.prof .sm{fill:#9aa3ab}
.dark .ctaband{background:#1a1f26;border:1px solid #2a313a;border-top:4px solid var(--or)}
@media (max-width:700px){
  .tbox h2{font-size:17px}
  .ttx{padding:8px 10px 10px}
  .ttx p{font-size:13px}
  .tpic svg{height:84px}
  .tgo{font-size:13.5px;padding:6px 4px}
  .dark .lead{font-size:17px}
}
/* language switch — blinking orange "Ver en Español" strip at the very top (Rod 10/9/2026) */
.langbar{background:var(--ink)}
.langbar-in{max-width:var(--maxw);margin:0 auto;padding:10px 16px 0;display:flex;justify-content:flex-end}
.langbtn{display:inline-flex;align-items:center;gap:6px;font:800 18px/1 "Roboto Condensed",Arial,sans-serif;letter-spacing:.3px;
  color:#fff;text-decoration:none;padding:10px 20px;border-radius:999px;border:2px solid var(--or);background:transparent}
.langbtn:hover{background:var(--or)}
.langbtn.blink{background:var(--or);animation:langblink 1.2s ease-in-out infinite}
@keyframes langblink{0%,45%{background:#ff671f;color:#fff;box-shadow:0 0 0 0 rgba(255,103,31,.75)}
  55%,95%{background:#0f1216;color:#ff8a4c;box-shadow:0 0 0 8px rgba(255,103,31,0)}100%{background:#ff671f;color:#fff}}
.langbtn.blink:hover,.langbtn.blink:focus{animation:none;background:var(--or);color:#fff}
@media (prefers-reduced-motion:reduce){.langbtn.blink{animation:none}}
@media (max-width:600px){.langbar-in{justify-content:center;padding-top:12px}.langbtn{font-size:20px;padding:12px 26px}}
@media print{.langbar{display:none}}

svg.bldg .roof{fill:#dfe3e7;stroke:#9aa3ab;stroke-width:1}
svg.bldg .roof2{fill:#cfd5db;stroke:#9aa3ab;stroke-width:1}
svg.bldg .wall{fill:#f3f5f7;stroke:#9aa3ab;stroke-width:1}
svg.bldg .wall2{fill:#e6eaee;stroke:#9aa3ab;stroke-width:1}
svg.bldg .rib{stroke:#c9d0d6;stroke-width:.8}
svg.bldg .door{fill:#c7cdd3;stroke:#9aa3ab}
svg.bldg .win{fill:#bcd3e6;stroke:#9aa3ab}
svg.bldg .trim{stroke:#1d232b;stroke-width:3.2;stroke-linecap:round}
svg.bldg .trim.dim{stroke:#7d8790;stroke-width:2.2}
svg.bldg .trim.hi{stroke:#ff671f;stroke-width:6}
svg.bldg .bub{fill:#1d232b;stroke:#fff;stroke-width:2}
svg.bldg .bub.on{fill:#ff671f}
svg.bldg .bubt{fill:#fff;font:700 11px 'Roboto Condensed',Arial,sans-serif;text-anchor:middle}
svg.prof .prof{fill:none;stroke:#ff671f;stroke-width:4;stroke-linejoin:round;stroke-linecap:round}
svg.prof .prof2{fill:none;stroke:#1d232b;stroke-width:2.5;stroke-linejoin:round}
svg.prof .under,svg.prof .panel{fill:none;stroke:#8a939c;stroke-width:2.5;stroke-dasharray:0;stroke-linejoin:round}
svg.prof .frm{fill:#e9ecef;stroke:#8a939c;stroke-width:2}
svg.prof .slab{stroke:#8a939c;stroke-width:6}
svg.prof .foam{fill:#f6d36b;stroke:#c9a227;stroke-width:1.2}
svg.prof .pl{font:600 13px 'Roboto Condensed',Arial,sans-serif;fill:#1d232b}
svg.prof .pl.or{fill:#c94f12;font-weight:700}
svg.prof .sm{font:12px 'Roboto Condensed',Arial,sans-serif;fill:#56606b}
