/* Rebar Detailing theme: bending schedule */
:root{
  --bg:#F4F6F7;--paper:#FFFFFF;--alt-bg:#E7EBEE;--clients-bg:#FFFFFF;
  --ink:#0F1B26;--ink-soft:#33414D;--muted:#566571;--line:#CFD7DD;
  --heading:#013466;--link:#013466;--link-hover:#B8461A;
  --accent:#F26B1D;--accent-hover:#FF8340;--accent-ink:#0F1B26;--focus:#F26B1D;--ghost-hover:rgba(255,255,255,.08);
  --step-num:#D9571A;--figure-bg:#DDE3E7;
  --font-display:"Barlow Condensed","Arial Narrow",system-ui,sans-serif;--font-body:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  --display-stretch:100%;--display-weight:700;--display-tracking:0;
  --radius:2px;--radius-btn:2px;--radius-field:2px;
  --header-bg:#013466;--header-solid:#013466;--header-ink:#FFFFFF;--header-line:rgba(255,255,255,.16);
  --contact-bg:#013466;--contact-ink:#FFFFFF;--contact-line:rgba(255,255,255,.22);--field-line:#A7B3BC;
  --footer-bg:#F4F6F7;--footer-ink:#33414D;
}
body{font-size:1.09rem}
h2{font-size:clamp(2.2rem,4.2vw,3.4rem);line-height:1}
h3{font-weight:600}
.brand-name{font-size:1.45rem;font-weight:700}
.steps li::before{font-size:3rem}
.client-list li{font-family:var(--font-body);font-weight:600;font-size:1.02rem}

/* Hero */
.hero{background:#013466;color:#fff;padding-block:clamp(3rem,7vw,5.5rem) clamp(3.5rem,7vw,6rem);border-top:1px solid rgba(255,255,255,.12)}
.hero-grid{display:grid;grid-template-columns:minmax(0,10fr) minmax(0,13fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero h1{font-family:var(--font-display);font-weight:700;font-size:clamp(3rem,6.4vw,5.6rem);line-height:.93;letter-spacing:-.005em;margin-bottom:1.5rem;text-wrap:balance}
.hero .lead{font-size:clamp(1.08rem,1.4vw,1.22rem);color:rgba(255,255,255,.84);max-width:33rem;margin:0}
.hero-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}

/* Bending schedule */
.bbs{margin:0;border:1px solid rgba(255,255,255,.3);background:rgba(0,20,45,.28)}
.bbs-head{display:flex;justify-content:space-between;gap:1rem;padding:.8rem 1rem;border-bottom:1px solid rgba(255,255,255,.3);font-family:var(--font-display);font-size:1.15rem;font-weight:600}
.bbs-head span:last-child{font-family:var(--font-body);font-weight:400;font-size:.88rem;color:rgba(255,255,255,.7);align-self:center}
.bbs table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.bbs th{font-size:.8rem;font-weight:500;color:rgba(255,255,255,.66);text-align:left;padding:.55rem 1rem;border-bottom:1px solid rgba(255,255,255,.18)}
.bbs td{padding:.45rem 1rem;border-top:1px solid rgba(255,255,255,.12);font-size:1rem;vertical-align:middle}
.bbs td:first-child{font-family:var(--font-display);font-weight:600;font-size:1.12rem}
.bbs .num{text-align:right}
.bbs td.shape{width:42%;padding-block:.3rem}
.bbs td.shape svg{width:100%;max-width:170px;height:auto}
.bbs .bar{fill:none;stroke:#FF7A2F;stroke-width:3.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;animation:bbs-draw 1.1s cubic-bezier(.65,0,.3,1) both;animation-delay:var(--d,0s)}
.bbs .row{animation:bbs-fade .5s ease-out both;animation-delay:calc(var(--d,0s) - .2s)}
.bbs figcaption{padding:.7rem 1rem;border-top:1px solid rgba(255,255,255,.3);font-size:.85rem;color:rgba(255,255,255,.7)}
@keyframes bbs-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes bbs-fade{from{opacity:0}to{opacity:1}}

.reasons h3 a{color:inherit}
.clients .client-list{gap:.75rem 1.5rem}
.client-list img{width:128px;height:auto;filter:none;opacity:1}
@media (max-width:680px){.client-list img{width:96px}}

@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr}
}
@media (max-width:520px){
  .bbs th,.bbs td{padding-inline:.6rem}
  .bbs .col-len{display:none}
}