/* formedheads.com - industrial B2B, single stylesheet */
@font-face{font-family:Barlow;src:url(/assets/fonts/barlow-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Barlow;src:url(/assets/fonts/barlow-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Barlow;src:url(/assets/fonts/barlow-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(/assets/fonts/barlow-condensed-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(/assets/fonts/barlow-condensed-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(/assets/fonts/barlow-condensed-700.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --navy:#0f2b3d;
  --navy-2:#16405a;
  --steel:#8ea3b4;
  --line:#d7e0e7;
  --ink:#132029;
  --ink-soft:#4a5d6b;
  --paper:#ffffff;
  --paper-2:#f4f7f9;
  --paper-3:#e8eef2;
  --accent:#c8531f;
  --accent-2:#e2803f;
  --radius:10px;
  --wrap:1180px;
  --shadow:0 1px 2px rgba(15,43,61,.06),0 12px 32px -18px rgba(15,43,61,.35);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;font-family:Barlow,"Helvetica Neue",Arial,sans-serif;color:var(--ink);
  background:var(--paper);font-size:17px;line-height:1.6;
}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--navy-2);text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--accent)}
h1,h2,h3{font-family:"Barlow Condensed",Barlow,sans-serif;line-height:1.1;margin:0 0 .5em;letter-spacing:.01em}
h1{font-size:clamp(2.1rem,4.4vw,3.4rem);font-weight:700;text-transform:none}
h2{font-size:clamp(1.6rem,2.6vw,2.2rem);font-weight:600}
h3{font-size:1.2rem;font-weight:600}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-left:1.15em}
li{margin:.35em 0}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 20px}
.wrap.narrow{max-width:820px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:50}
.micro{font-size:.83rem;color:var(--ink-soft);margin:0}
.note{font-size:.92rem;color:var(--ink-soft);background:var(--paper-2);border-left:3px solid var(--steel);padding:12px 16px;border-radius:0 var(--radius) var(--radius) 0}
.hidden{position:absolute!important;left:-9999px!important}
.eyebrow{font-family:"Barlow Condensed",sans-serif;font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:.86rem;color:var(--accent);margin:0 0 .6em}
.lede{font-size:1.09rem;color:var(--ink-soft);max-width:60ch}
.section-lede{max-width:66ch;color:var(--ink-soft)}

/* header */
.site-head{background:var(--navy);color:#fff;position:sticky;top:0;z-index:30;border-bottom:1px solid rgba(255,255,255,.12)}
.head-inner{display:flex;align-items:center;gap:18px;min-height:66px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;color:#fff!important;font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:1.35rem;letter-spacing:.02em;text-decoration:none;padding:10px 0}
.brand-text{display:flex;flex-direction:column;line-height:1.05}
.brand-sub{font-family:Barlow,sans-serif;font-weight:400;font-size:.68rem;letter-spacing:.06em;color:#9fbccf;text-transform:none}
.brand-mark{width:22px;height:22px;border-radius:50%;background:conic-gradient(from 200deg,var(--accent),var(--accent-2) 45%,#fff 46%,#fff 62%,var(--accent) 63%);flex:0 0 auto}
.logo-pair{display:inline-flex;align-items:center;gap:10px}
.logo-pair img{display:block;width:auto}
.logo-pair.dark img{filter:none}
.logo-pair.big{gap:14px;margin-bottom:14px}
.logo-pair.big img{height:44px}
.letterhead{display:flex;align-items:center;gap:16px;margin:0 0 18px}
.letterhead img{height:52px;width:auto}
.site-nav{display:flex;gap:2px;flex:1 1 320px;flex-wrap:wrap;font-size:.92rem;justify-content:center}
.site-nav a{color:#dbe6ee!important;text-decoration:none;padding:8px 10px;border-radius:6px;white-space:nowrap}
.site-nav a:hover{background:rgba(255,255,255,.1);color:#fff!important}
.site-nav a[aria-current=page]{background:rgba(255,255,255,.16);color:#fff!important}
.head-cta{flex:0 0 auto}

/* mobile menu: the horizontal strip clipped items on phones, so below 700px the main
   nav is replaced by a collapsible list */
.nav-mobile{display:none;flex:1 0 100%;order:4;margin-bottom:10px}
.nav-mobile summary{
  cursor:pointer;list-style:none;padding:9px 14px;border:1.5px solid rgba(255,255,255,.45);
  border-radius:999px;font-weight:600;font-size:.95rem;width:fit-content;color:#fff
}
.nav-mobile summary::-webkit-details-marker{display:none}
.nav-mobile summary::after{content:" ▾"}
.nav-mobile[open] summary::after{content:" ▴"}
.nav-mobile nav{display:flex;flex-direction:column;gap:2px;margin-top:8px}
.nav-mobile nav a{color:#dbe6ee!important;text-decoration:none;padding:10px 12px;border-radius:6px;font-size:1rem}
.nav-mobile nav a:hover{background:rgba(255,255,255,.1);color:#fff!important}
.nav-mobile nav a[aria-current=page]{background:rgba(255,255,255,.16);color:#fff!important}

/* buttons */
.btn{display:inline-block;padding:12px 20px;border-radius:999px;font-weight:600;text-decoration:none;border:1.5px solid transparent;cursor:pointer;font-size:1rem;font-family:inherit;line-height:1.2}
.btn.primary{background:var(--accent);color:#fff!important}
.btn.primary:hover{background:#a9431a}
.btn.ghost{border-color:rgba(15,43,61,.25);color:var(--navy)!important;background:transparent}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent)!important}
.btn.small{padding:9px 16px;font-size:.92rem}

/* hero */
.hero{background:linear-gradient(160deg,var(--navy) 0%,var(--navy-2) 62%,#1d5375 100%);color:#fff;padding:56px 0 48px}
.hero h1{max-width:20ch}
.hero .lede{color:#cfe0ec;font-size:1.14rem}
.hero-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:32px 40px;align-items:start;
  grid-template-areas:"copy art" "facts art"}
.hero-copy{grid-area:copy}
.hero-art{grid-area:art}
.hero-facts{grid-area:facts}
.hero-art img{border-radius:8px;width:100%;height:auto;display:block}
.hero-points{list-style:none;padding:0;margin:0 0 1.4em;display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;font-size:.96rem;color:#cfe0ec}
.hero-points strong{color:#fff;font-weight:600;display:block;font-family:"Barlow Condensed",sans-serif;font-size:1.12rem;letter-spacing:.02em}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:0}
.hero .btn.ghost{border-color:rgba(255,255,255,.45);color:#fff!important}
.hero .btn.ghost:hover{border-color:#fff;background:rgba(255,255,255,.12);color:#fff!important}
.hero-art{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:var(--radius);padding:18px}
.hero-art .micro{color:#a9c3d6;margin-top:8px}
.hero-svg .svg-body{fill:rgba(255,255,255,.09);stroke:#e7f0f6;stroke-width:2.4}
.hero-svg .svg-flange{fill:none;stroke:var(--accent-2);stroke-width:2.4}
.hero-svg .svg-axis{stroke:rgba(255,255,255,.4);stroke-width:1}
.hero-svg .svg-dim{stroke:rgba(255,255,255,.75);stroke-width:1}
.hero-art .hero-svg .svg-label{fill:#dceaf4;font-size:11px;font-family:Barlow,sans-serif}
.hero-art .hero-svg .svg-label.mid{fill:#a9c6da}

/* bands */
.band{padding:56px 0;border-top:1px solid var(--line)}
.band.alt{background:var(--paper-2)}
.band:first-child{border-top:0}
.page-head{background:var(--paper-3);padding:52px 0 44px;border-bottom:1px solid var(--line)}
.page-head h1{max-width:26ch}

/* grids + cards */
.grid{display:grid;gap:22px;margin-top:26px}
.grid.two{grid-template-columns:repeat(2,1fr)}
.grid.three{grid-template-columns:repeat(3,1fr)}
.grid.four{grid-template-columns:repeat(4,1fr)}
.two-col{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:start}
.two-col.form-col{grid-template-columns:1.4fr .6fr}
.gap-top{margin-top:26px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.card h3{margin-bottom:.4em}
.card p:last-child{margin-bottom:0}
.card.mini{padding:20px}
.card.mini h3{font-size:1.08rem}
.card.mini p{font-size:.95rem;color:var(--ink-soft)}
.track-card{padding:28px}
.tag{font-family:"Barlow Condensed",sans-serif;font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.78rem;color:var(--accent);margin:0 0 .4em}
.card-link{font-weight:600;font-size:.95rem;display:inline-block;margin-top:.4em}
.product-card ul{font-size:.94rem}
.card-art{background:var(--paper-2);border-radius:8px;padding:12px;margin-bottom:14px}
.panel{background:var(--paper);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:0 var(--radius) var(--radius) 0;padding:24px;box-shadow:var(--shadow)}
.panel .micro{margin-top:10px}

/* stats */
.stat{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.band.alt .stat{background:var(--paper)}
.stat-num{font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:1.85rem;color:var(--navy);margin:0 0 .2em;letter-spacing:.01em}
.stat-label{font-size:.93rem;color:var(--ink-soft);margin:0}

/* lists */
.check{list-style:none;padding:0}
.check li{position:relative;padding-left:26px;margin:.5em 0}
.check li::before{content:"";position:absolute;left:0;top:.55em;width:11px;height:6px;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(-45deg)}
.check.compact li{margin:.35em 0;font-size:.95rem}
.steps{counter-reset:s;list-style:none;padding:0}
.steps li{counter-increment:s;position:relative;padding-left:34px;margin:.55em 0}
.steps li::before{content:counter(s);position:absolute;left:0;top:.1em;width:24px;height:24px;border-radius:50%;background:var(--navy);color:#fff;font-size:.8rem;font-weight:600;display:grid;place-items:center;font-family:"Barlow Condensed",sans-serif}
.contact-list{list-style:none;padding:0;margin:0;font-size:.95rem}
.contact-list li{margin:.4em 0}

/* svg diagrams */
.profile-svg .svg-body{fill:#eef3f7;stroke:var(--navy);stroke-width:2.2}
.profile-svg .svg-flange{fill:none;stroke:var(--accent);stroke-width:2.4}
.profile-svg .svg-axis{stroke:var(--steel);stroke-width:1;stroke-dasharray:5 4}
.profile-svg .svg-axis.dim{stroke-dasharray:2 5;opacity:.5}
.profile-svg .svg-dim{stroke:var(--ink-soft);stroke-width:1}
.profile-svg .svg-label{fill:var(--ink-soft);font-size:11px;font-family:Barlow,sans-serif}
.profile-svg .svg-label.mid{font-size:10px}
.svg-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.svg-cell{background:var(--paper-2);border-radius:8px;padding:6px}

/* tables */
.photo-grid{display:grid;gap:14px;margin-top:26px}
.photo-grid img{width:100%;height:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.photo-grid.cols-3{grid-template-columns:repeat(3,1fr)}
.photo-caption{margin-top:14px;font-size:.85rem;color:var(--ink-soft)}
.model-codes{font-family:"Barlow Condensed",sans-serif;font-weight:600;font-size:1.15rem;
  letter-spacing:.03em;color:var(--navy);background:var(--paper);border:1px solid var(--line);
  border-left:3px solid var(--accent);border-radius:0 var(--radius) var(--radius) 0;
  padding:16px 18px;line-height:1.9}

.table-wrap{overflow-x:auto;margin-top:24px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper)}
table.spec{border-collapse:collapse;width:100%;min-width:760px;font-size:.92rem}
table.spec th,table.spec td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:top}
table.spec thead th{background:var(--navy);color:#fff;font-family:"Barlow Condensed",sans-serif;font-weight:600;letter-spacing:.03em;font-size:.95rem;white-space:nowrap}
table.spec tbody tr:nth-child(even){background:var(--paper-2)}
table.spec td:first-child{white-space:nowrap}

/* faq */
.faq{margin-top:22px}
.faq details{border:1px solid var(--line);border-radius:var(--radius);margin-bottom:10px;background:var(--paper)}
.faq summary{cursor:pointer;padding:15px 18px;font-weight:600;font-family:"Barlow Condensed",sans-serif;font-size:1.1rem;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";float:right;color:var(--accent);font-size:1.3rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq-body{padding:0 18px 16px;color:var(--ink-soft);font-size:.97rem}
.faq-body p:last-child{margin-bottom:0}

/* forms */
.rfq-form{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.rfq-form label{display:block;margin-bottom:14px;font-weight:500;font-size:.95rem}
.rfq-form input,.rfq-form select,.rfq-form textarea{
  display:block;width:100%;margin-top:6px;padding:11px 12px;border:1px solid #c3d0da;border-radius:8px;
  font:inherit;font-size:1rem;color:var(--ink);background:#fff
}
.rfq-form input:focus,.rfq-form select:focus,.rfq-form textarea:focus{outline:2px solid var(--accent-2);outline-offset:1px;border-color:var(--accent)}
.rfq-form textarea{resize:vertical}
.req{color:var(--accent)}
.form-note{font-size:.88rem;color:var(--ink-soft);background:var(--paper-2);padding:12px 14px;border-radius:8px}
.form-status{margin:10px 0 0;font-weight:600;font-size:.95rem;min-height:1.2em}
.form-status.ok{color:#1c6b3f}
.form-status.err{color:#a5231c}
.form-aside{background:var(--paper-3);border-radius:var(--radius);padding:24px}
.form-aside h2{font-size:1.5rem}
.form-aside h3{margin-top:1.2em}
.form-aside .steps li{font-size:.95rem;color:var(--ink-soft)}

/* cta band */
.cta-band{background:var(--navy);color:#fff;border-top:0}
.cta-band h2{color:#fff}
.cta-band p{color:#cfe0ec;max-width:56ch}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap;margin:1.2em 0 .8em}
.cta-band .btn.ghost{border-color:rgba(255,255,255,.45);color:#fff!important}
.cta-band .btn.ghost:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff!important}
.cta-band .micro{color:#9fbbcf}

/* footer */
.site-foot{background:#0b2130;color:#b9cdda;padding:44px 0 24px;font-size:.93rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:28px}
.foot-brand{font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:1.3rem;color:#fff;margin:0 0 .5em}
.foot-head{font-family:"Barlow Condensed",sans-serif;font-weight:600;color:#fff;letter-spacing:.06em;text-transform:uppercase;font-size:.85rem;margin:0 0 .7em}
.site-foot ul{list-style:none;padding:0;margin:0}
.site-foot li{margin:.35em 0}
.site-foot a{color:#d7e5ee!important;text-decoration:none}
.site-foot a:hover{color:#fff!important;text-decoration:underline}
.site-foot .micro{color:#8aa6b8}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:30px;padding-top:16px}

@media (max-width:980px){
  .hero-inner{grid-template-columns:1fr;grid-template-areas:"copy" "art" "facts"}
  .two-col,.two-col.form-col{grid-template-columns:1fr}
  .grid.four{grid-template-columns:repeat(2,1fr)}
  .grid.three{grid-template-columns:repeat(2,1fr)}
  .photo-grid.cols-3{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body{font-size:16px}
  .band{padding:40px 0}
  /* compact header + hero so a real photo lands on the first screen */
  .head-inner{min-height:0;display:grid;grid-template-columns:auto auto;
    grid-template-areas:"brand brand" "cta menu";justify-content:start;gap:6px 10px}
  .brand{grid-area:brand;font-size:1.05rem;gap:8px;padding:6px 0;white-space:nowrap}
  .logo-pair img{height:18px!important}
  .brand-sub{font-size:.6rem}
  .head-cta{grid-area:cta;margin:0;padding:7px 14px;font-size:.85rem}
  .nav-mobile{grid-area:menu;flex:none;margin:0}
  .nav-mobile summary{padding:7px 13px;font-size:.88rem}
  .hero{padding:18px 0 26px}
  .hero h1{font-size:1.85rem;margin-bottom:.35em}
  .hero .lede{font-size:.98rem;margin-bottom:.6em}
  .hero-inner{gap:14px}
  .hero-points{font-size:.9rem;gap:6px}
  .hero-points strong{font-size:1rem}
  .grid.two,.grid.three,.grid.four,.field-row,.foot-grid{grid-template-columns:1fr}
  .hero-points{grid-template-columns:1fr}
  .site-nav{display:none}
  .nav-mobile{display:block}
  .head-cta{margin-left:auto}
}
