/* ==========================================================================
   PFE — Powerflow Engineering
   Design tokens
   ========================================================================== */

:root{
  --ink:        #1d1d1b;
  --ink-soft:   #46453f;
  --paper:      #efeeea;
  --paper-dim:  #e2e0d9;
  --navy:       #183b68;
  --navy-deep:  #0f2747;
  --orange:     #e9522c;
  --amber:      #fabd66;

  --text-on-dark:      #f3f2ee;
  --text-on-dark-soft: rgba(243,242,238,.62);
  --line-on-dark:      rgba(243,242,238,.14);
  --line-on-light:     rgba(29,29,27,.12);

  --font-body:    'Inter', -apple-system, "Segoe UI", sans-serif;
  --font-display: 'Archivo Expanded', var(--font-body);

  --container: 1240px;
  --pad: clamp(20px, 4vw, 64px);

  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:700; line-height:1.08; margin:0; letter-spacing:.01em; }
p{ margin:0; }
button{ font-family:inherit; cursor:pointer; }

::selection{ background:var(--orange); color:#fff; }

/* focus visibility */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:2px solid var(--orange);
  outline-offset:2px;
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ==========================================================================
   Layout helpers
   ========================================================================== */

.container{
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--pad);
}

.section{ padding-block: clamp(56px, 9vw, 120px); }
.section--tight{ padding-block: clamp(40px, 6vw, 80px); }

.section--dark{ background:var(--ink); color:var(--text-on-dark); }
.section--navy{ background:var(--navy-deep); color:var(--text-on-dark); }
.section--paper{ background:var(--paper); color:var(--ink); }
.section--dim{ background:var(--paper-dim); color:var(--ink); }

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.6em;
  font-family:var(--font-display);
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--orange);
}
.eyebrow::before{
  content:"";
  display:block;
  width:28px; height:2px;
  background:var(--orange);
}

.section--dark .eyebrow, .section--navy .eyebrow{ color:var(--amber); }
.section--dark .eyebrow::before, .section--navy .eyebrow::before{ background:var(--amber); }

h1{ font-size:clamp(2.6rem, 6vw, 4.6rem); }
h2{ font-size:clamp(1.9rem, 4.2vw, 3rem); margin-top:.5rem; }
h3{ font-size:clamp(1.2rem, 2.2vw, 1.5rem); }
h4{ font-size:1.05rem; }

.lede{
  font-size:clamp(1.05rem, 1.6vw, 1.25rem);
  color:var(--ink-soft);
  max-width:62ch;
}
.section--dark .lede, .section--navy .lede{ color:var(--text-on-dark-soft); }

.section-head{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px 48px;
  margin-bottom: clamp(32px, 5vw, 64px);
}
.section-head .lede{ margin-top:14px; }

/* ==========================================================================
   Buttons
   ========================================================================== */

.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 28px;
  font-family:var(--font-display);
  font-weight:600;
  font-size:.95rem;
  letter-spacing:.02em;
  border-radius:2px;
  border:1px solid transparent;
  transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-2px); }

.btn--primary{
  background:var(--orange);
  color:#fff;
}
.btn--primary:hover{ background:#d8431d; }

.btn--ghost-dark{
  border-color:var(--ink);
  color:var(--ink);
}
.btn--ghost-dark:hover{ background:var(--ink); color:var(--paper); }

.btn--ghost-light{
  border-color:rgba(243,242,238,.35);
  color:var(--text-on-dark);
}
.btn--ghost-light:hover{ border-color:var(--text-on-dark); background:rgba(243,242,238,.08); }

.btn--icon svg{ width:16px; height:16px; transition:transform .25s var(--ease); }
.btn:hover .btn--icon svg, .btn:hover svg.arrow{ transform:translateX(4px); }

/* ==========================================================================
   Header / Navigation
   ========================================================================== */

.site-header{
  position:fixed;
  inset-inline:0;
  top:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px var(--pad);
  background:rgba(29,29,27,.0);
  backdrop-filter:blur(0px);
  transition:background .35s var(--ease), backdrop-filter .35s var(--ease), padding .35s var(--ease), border-color .35s var(--ease);
  border-bottom:1px solid transparent;
}
.site-header.is-scrolled{
  background:rgba(29,29,27,.86);
  backdrop-filter:blur(10px);
  padding-block:12px;
  border-color:var(--line-on-dark);
}
.site-header .logo{ display:flex; align-items:center; gap:10px; }
.site-header .logo img{ height:30px; width:auto; }

.nav-toggle{
  display:none;
  background:none; border:0; padding:8px;
  color:var(--text-on-dark);
}
.nav-toggle svg{ width:26px; height:26px; }

.site-nav{
  display:flex;
  align-items:center;
  gap:clamp(20px, 2.4vw, 40px);
}
.site-nav a{
  font-family:var(--font-display);
  font-size:.85rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--text-on-dark-soft);
  position:relative;
  padding-block:6px;
  transition:color .2s var(--ease);
}
.site-nav a:hover, .site-nav a.is-active{ color:var(--text-on-dark); }
.site-nav a.is-active::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-2px;
  height:2px; background:var(--orange);
}
.site-nav .btn{ padding:10px 22px; font-size:.82rem; }

@media (max-width: 880px){
  .nav-toggle{ display:block; order:3; }
  .site-nav{
    position:fixed;
    inset:0;
    top:64px;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    gap:6px;
    padding:32px var(--pad);
    background:var(--ink);
    transform:translateX(100%);
    transition:transform .35s var(--ease);
  }
  .site-nav.is-open{ transform:translateX(0); }
  .site-nav a{ width:100%; padding:16px 0; border-bottom:1px solid var(--line-on-dark); font-size:1.1rem; }
  .site-nav .btn{ margin-top:18px; width:100%; justify-content:center; }
}

/* ==========================================================================
   Hero
   ========================================================================== */

.hero{
  position:relative;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  color:var(--text-on-dark);
  background:var(--ink);
  overflow:hidden;
}
.hero__media{
  position:absolute; inset:0;
  z-index:0;
}
.hero__media img{
  width:100%; height:100%; object-fit:cover;
  opacity:.55;
}
.hero__media::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(15,39,71,.35) 0%, rgba(13,13,12,.55) 55%, var(--ink) 100%),
    linear-gradient(100deg, rgba(13,13,12,.65) 0%, rgba(13,13,12,.1) 55%);
}
.hero__lines{
  position:absolute;
  right:-6%;
  top:8%;
  width:min(70vw, 900px);
  color:rgba(243,242,238,.10);
  z-index:1;
  pointer-events:none;
}
.hero__content{
  position:relative;
  z-index:2;
  padding: clamp(120px,18vw,200px) var(--pad) clamp(48px,7vw,90px);
}
.hero__tag{
  font-family:var(--font-display);
  font-size:.85rem;
  font-weight:600;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--amber);
  margin-bottom:18px;
}
.hero h1{
  max-width:16ch;
  margin:0 0 22px;
}
.hero h1 .accent{ color:var(--orange); }
.hero__sub{
  max-width:56ch;
  font-size:clamp(1.05rem,1.7vw,1.3rem);
  color:var(--text-on-dark-soft);
  margin-bottom:36px;
}
.hero__actions{
  display:flex; flex-wrap:wrap; gap:14px;
  margin-bottom: clamp(40px, 6vw, 72px);
}

.hero__stats{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px,1fr));
  border-top:1px solid var(--line-on-dark);
}
.hero__stats div{
  padding: 22px var(--pad) 22px 0;
  border-right:1px solid var(--line-on-dark);
}
.hero__stats div:last-child{ border-right:0; }
.hero__stats strong{
  display:block;
  font-family:var(--font-display);
  font-size:clamp(1.6rem,3vw,2.4rem);
  font-weight:700;
  color:var(--text-on-dark);
}
.hero__stats span{
  display:block;
  margin-top:4px;
  font-size:.85rem;
  color:var(--text-on-dark-soft);
}
@media (max-width: 720px){
  .hero__stats{ grid-template-columns:repeat(2,1fr); }
  .hero__stats div{ border-right:1px solid var(--line-on-dark); border-bottom:1px solid var(--line-on-dark); padding:18px 16px; }
}

/* Page header (non-home hero) */
.page-header{
  position:relative;
  background:var(--ink);
  color:var(--text-on-dark);
  padding: clamp(140px,18vw,200px) var(--pad) clamp(56px,8vw,96px);
  overflow:hidden;
}
.page-header__media{ position:absolute; inset:0; }
.page-header__media img{ width:100%; height:100%; object-fit:cover; opacity:.32; }
.page-header__media::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(13,13,12,.45), var(--ink) 92%);
}
.page-header__lines{
  position:absolute; right:-10%; top:0; width:min(60vw,760px);
  color:rgba(243,242,238,.08); z-index:0; pointer-events:none;
}
.page-header__content{ position:relative; z-index:1; }
.page-header .eyebrow{ margin-bottom:14px; }
.page-header h1{ max-width:18ch; }
.page-header__lede{ margin-top:18px; max-width:60ch; color:var(--text-on-dark-soft); font-size:clamp(1rem,1.5vw,1.2rem); }
.breadcrumb{
  margin-top:28px;
  font-family:var(--font-display);
  font-size:.78rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--text-on-dark-soft);
  display:flex; gap:10px; align-items:center;
}
.breadcrumb a:hover{ color:var(--amber); }

/* ==========================================================================
   Grids & cards
   ========================================================================== */

.grid{ display:grid; gap:24px; }
.grid--2{ grid-template-columns:repeat(2,1fr); }
.grid--3{ grid-template-columns:repeat(3,1fr); }
.grid--4{ grid-template-columns:repeat(4,1fr); }
.grid--6{ grid-template-columns:repeat(6,1fr); }
@media (max-width: 1000px){
  .grid--3, .grid--4{ grid-template-columns:repeat(2,1fr); }
  .grid--6{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width: 620px){
  .grid--2, .grid--3, .grid--4{ grid-template-columns:1fr; }
  .grid--6{ grid-template-columns:repeat(2,1fr); }
}

/* product / category cards */
.card{
  position:relative;
  display:flex; flex-direction:column;
  background:#fff;
  border:1px solid var(--line-on-light);
  padding:30px 28px;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px -24px rgba(29,29,27,.45); border-color:transparent; }
.card__num{
  font-family:var(--font-display);
  font-size:.78rem;
  letter-spacing:.18em;
  color:var(--orange);
  margin-bottom:18px;
}
.card h3{ margin-bottom:10px; }
.card p{ color:var(--ink-soft); font-size:.95rem; }
.card__icon{
  width:46px; height:46px;
  margin-bottom:22px;
  color:var(--navy);
}
.card__icon svg{ width:100%; height:100%; }

.card--dark{
  background:var(--ink);
  color:var(--text-on-dark);
  border-color:var(--line-on-dark);
}
.card--dark p{ color:var(--text-on-dark-soft); }
.card--dark .card__icon{ color:var(--amber); }
.card--dark:hover{ border-color:transparent; }

/* media card with image */
.media-card{
  position:relative;
  display:block;
  overflow:hidden;
  aspect-ratio:4/5;
  background:var(--ink);
}
.media-card img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .6s var(--ease);
  filter:saturate(.92);
}
.media-card:hover img{ transform:scale(1.05); }
.media-card::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(13,13,12,.92) 0%, rgba(13,13,12,.15) 60%);
}
.media-card__body{
  position:absolute; left:0; right:0; bottom:0;
  padding:26px;
  z-index:1;
  color:var(--text-on-dark);
}
.media-card__body .eyebrow{ margin-bottom:8px; }
.media-card__body p{ color:var(--text-on-dark-soft); font-size:.92rem; margin-top:8px; }

/* numbered process */
.process{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  border:1px solid var(--line-on-dark);
}
.process__step{
  padding:28px 22px;
  border-right:1px solid var(--line-on-dark);
  position:relative;
}
.process__step:last-child{ border-right:0; }
.process__step .num{
  font-family:var(--font-display);
  font-size:.85rem;
  color:var(--amber);
  letter-spacing:.1em;
  margin-bottom:18px;
  display:block;
}
.process__step h4{ margin-bottom:10px; }
.process__step ul{ font-size:.85rem; color:var(--text-on-dark-soft); display:flex; flex-direction:column; gap:6px; }
.process__step li::before{ content:"— "; color:var(--orange); }
@media (max-width: 980px){
  .process{ grid-template-columns:repeat(2,1fr); }
  .process__step{ border-bottom:1px solid var(--line-on-dark); }
  .process__step:nth-child(2n){ border-right:0; }
}
@media (max-width: 560px){
  .process{ grid-template-columns:1fr; }
}

/* stat blocks */
.stat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:1px;
  background:var(--line-on-light);
  border:1px solid var(--line-on-light);
}
.stat-grid div{ background:var(--paper); padding:26px 22px; }
.section--dark .stat-grid, .section--navy .stat-grid{ background:var(--line-on-dark); border-color:var(--line-on-dark); }
.section--dark .stat-grid div, .section--navy .stat-grid div{ background:var(--ink); }
.section--navy .stat-grid div{ background:var(--navy-deep); }
.stat-grid strong{
  display:block; font-family:var(--font-display); font-weight:700;
  font-size:clamp(1.6rem,3vw,2.6rem);
}
.stat-grid span{ display:block; margin-top:6px; font-size:.85rem; color:var(--ink-soft); }
.section--dark .stat-grid span, .section--navy .stat-grid span{ color:var(--text-on-dark-soft); }

/* logo strip */
.logo-strip{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:36px;
}
.logo-strip img{
  max-height:46px; width:auto;
  filter:grayscale(1) opacity(.55);
  transition:filter .3s var(--ease);
}
.logo-strip img:hover{ filter:grayscale(0) opacity(1); }
.section--dark .logo-strip img, .section--navy .logo-strip img{ filter:grayscale(1) opacity(.5) invert(1); }
.section--dark .logo-strip img:hover, .section--navy .logo-strip img:hover{ filter:grayscale(0) opacity(1) invert(0); }

/* partner card */
.partner-card{
  border:1px solid var(--line-on-dark);
  padding:32px;
  display:flex; flex-direction:column; gap:14px;
}
.partner-card .tag{
  font-family:var(--font-display); font-size:.75rem; letter-spacing:.18em; text-transform:uppercase; color:var(--amber);
}
.partner-card h3{ font-size:1.3rem; }
.partner-card p{ color:var(--text-on-dark-soft); font-size:.92rem; }

/* split / two-column feature */
.split{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:clamp(32px,6vw,80px);
  align-items:center;
}
.split--reverse{ grid-template-columns:.95fr 1.05fr; }
.split--reverse .split__media{ order:2; }
@media (max-width: 900px){
  .split, .split--reverse{ grid-template-columns:1fr; }
  .split--reverse .split__media{ order:0; }
}
.split__media{ position:relative; }
.split__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
.split__media .frame{
  position:absolute; inset:18px -18px -18px 18px;
  border:1px solid var(--orange);
  z-index:-1;
}
.section--dark .split__media .frame, .section--navy .split__media .frame{ border-color:var(--amber); }

.feature-list{ display:flex; flex-direction:column; gap:18px; margin-top:28px; }
.feature-list li{
  display:flex; gap:16px; align-items:flex-start;
  font-size:.98rem;
}
.feature-list .ico{
  flex:none;
  width:22px;height:22px; margin-top:2px;
  color:var(--orange);
}
.section--dark .feature-list .ico, .section--navy .feature-list .ico{ color:var(--amber); }
.feature-list .ico svg{ width:100%;height:100%; }
.feature-list b{ display:block; font-family:var(--font-display); font-size:1rem; margin-bottom:2px; }
.feature-list span{ color:var(--ink-soft); font-size:.9rem; }
.section--dark .feature-list span, .section--navy .feature-list span{ color:var(--text-on-dark-soft); }

/* table */
.table-wrap{ overflow-x:auto; border:1px solid var(--line-on-light); }
.section--dark .table-wrap, .section--navy .table-wrap{ border-color:var(--line-on-dark); }
table{ width:100%; border-collapse:collapse; font-size:.92rem; min-width:560px; }
th,td{ text-align:left; padding:14px 18px; border-bottom:1px solid var(--line-on-light); }
.section--dark th, .section--dark td, .section--navy th, .section--navy td{ border-color:var(--line-on-dark); }
th{ font-family:var(--font-display); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); background:var(--paper-dim); }
.section--dark th, .section--navy th{ color:var(--text-on-dark-soft); background:rgba(255,255,255,.04); }
tr:last-child td{ border-bottom:0; }
.hl{ color:var(--orange); font-weight:600; }
.section--dark .hl, .section--navy .hl{ color:var(--amber); }

/* product photo card */
.product-card{
  background:#fff;
  border:1px solid var(--line-on-light);
  display:flex; flex-direction:column;
  overflow:hidden;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.product-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px -24px rgba(29,29,27,.45); }
.product-card__media{
  aspect-ratio:4/3;
  display:flex; align-items:center; justify-content:center;
  padding:22px;
  background:#fff;
}
.product-card__media img{ max-width:100%; max-height:100%; object-fit:contain; }
.product-card__body{
  padding:16px 20px 22px;
  border-top:1px solid var(--line-on-light);
}
.product-card__body h3{ font-size:1.02rem; margin-bottom:4px; }
.product-card__body p{ font-size:.86rem; color:var(--ink-soft); }

/* tag pill */
.pill{
  display:inline-block;
  padding:6px 14px;
  border:1px solid var(--line-on-light);
  border-radius:999px;
  font-size:.82rem;
  font-family:var(--font-display);
}
.section--dark .pill, .section--navy .pill{ border-color:var(--line-on-dark); }
.pill-row{ display:flex; flex-wrap:wrap; gap:10px; }

/* CTA banner */
.cta-banner{
  position:relative;
  background:var(--navy-deep);
  color:var(--text-on-dark);
  padding:clamp(48px,8vw,100px) var(--pad);
  overflow:hidden;
}
.cta-banner__lines{
  position:absolute; left:-10%; bottom:-30%; width:min(70vw,820px);
  color:rgba(250,189,102,.08);
}
.cta-banner__inner{ position:relative; z-index:1; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:32px; }
.cta-banner h2{ max-width:14ch; }
.cta-banner__actions{ display:flex; gap:14px; flex-wrap:wrap; }

/* ==========================================================================
   Footer
   ========================================================================== */

.site-footer{
  background:var(--ink);
  color:var(--text-on-dark-soft);
  padding-top: clamp(48px,7vw,80px);
}
.site-footer .container{ padding-bottom:28px; }
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1.2fr;
  gap:40px;
  padding-bottom: clamp(40px,6vw,72px);
  border-bottom:1px solid var(--line-on-dark);
}
@media (max-width: 880px){
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 560px){
  .footer-grid{ grid-template-columns:1fr; }
}
.footer-grid img{ height:34px; margin-bottom:18px; }
.footer-grid p{ font-size:.92rem; max-width:34ch; }
.footer-col h4{
  font-family:var(--font-display);
  font-size:.78rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--text-on-dark); margin-bottom:18px;
}
.footer-col ul{ display:flex; flex-direction:column; gap:10px; font-size:.92rem; }
.footer-col a:hover{ color:var(--amber); }
.footer-bottom{
  display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between;
  padding-block:24px;
  font-size:.8rem;
  color:rgba(243,242,238,.4);
}

/* ==========================================================================
   Misc page bits
   ========================================================================== */

.reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }

.kicker-line{
  display:flex; align-items:center; gap:18px;
  color:var(--ink-soft);
  font-family:var(--font-display); font-size:.8rem; letter-spacing:.18em; text-transform:uppercase;
}
.kicker-line::after{ content:""; flex:1; height:1px; background:var(--line-on-light); }
.section--dark .kicker-line, .section--navy .kicker-line{ color:var(--text-on-dark-soft); }
.section--dark .kicker-line::after, .section--navy .kicker-line::after{ background:var(--line-on-dark); }

.industry-card{
  border:1px solid var(--line-on-light);
  padding:24px;
  display:flex; flex-direction:column; gap:14px;
  transition:border-color .25s var(--ease), background .25s var(--ease);
}
.industry-card:hover{ border-color:var(--orange); }
.industry-card .ico{ width:38px; height:38px; color:var(--navy); }
.industry-card .ico svg{ width:100%; height:100%; }
.industry-card .pct{ font-family:var(--font-display); font-size:1.6rem; font-weight:700; color:var(--orange); }

.contact-block{
  display:flex; flex-direction:column; gap:6px; padding:26px 0;
  border-top:1px solid var(--line-on-light);
}
.section--dark .contact-block, .section--navy .contact-block{ border-color:var(--line-on-dark); }
.contact-block:last-child{ border-bottom:1px solid var(--line-on-light); }
.section--dark .contact-block:last-child, .section--navy .contact-block:last-child{ border-color:var(--line-on-dark); }
.contact-block h4{
  font-family:var(--font-display); font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-soft);
}
.section--dark .contact-block h4, .section--navy .contact-block h4{ color:var(--text-on-dark-soft); }
.contact-block a, .contact-block span{ font-size:1.1rem; }
.contact-block a:hover{ color:var(--orange); }

/* form */
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width: 640px){ .form-grid{ grid-template-columns:1fr; } }
.field{ display:flex; flex-direction:column; gap:8px; }
.field.full{ grid-column:1/-1; }
.field label{ font-family:var(--font-display); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-on-dark-soft); }
.field input, .field textarea{
  background:transparent;
  border:1px solid var(--line-on-dark);
  color:var(--text-on-dark);
  padding:14px 16px;
  font-family:var(--font-body);
  font-size:.98rem;
  resize:vertical;
}
.field input::placeholder, .field textarea::placeholder{ color:rgba(243,242,238,.35); }
.field input:focus, .field textarea:focus{ border-color:var(--amber); outline:none; }

/* map placeholder */
.map-frame{
  position:relative;
  aspect-ratio:16/10;
  background:var(--ink);
  overflow:hidden;
  border:1px solid var(--line-on-dark);
}
.map-frame iframe{ width:100%; height:100%; border:0; filter:grayscale(.4) invert(.92) contrast(.92); }

/* utility */
.mt-0{ margin-top:0 !important; }
.text-center{ text-align:center; }
.muted{ color:var(--ink-soft); }
.section--dark .muted, .section--navy .muted{ color:var(--text-on-dark-soft); }

/* ==========================================================================
   Mobile — полный адаптив (375px–880px)
   ========================================================================== */

/* Глобальный запрет горизонтального скролла */
html{ overflow-x:hidden; }

/* --- 1. Декоративная рамка frame — убираем на мобильных ---
   inset:18px -18px -18px 18px → right:-18px создаёт горизонтальный скролл */
@media (max-width:900px){
  .split__media .frame{ display:none; }
}

/* --- 2. Hero — масштаб и отступы на телефонах --- */
@media (max-width:640px){
  .hero__content{
    padding-top:clamp(88px,24vw,120px);
    padding-bottom:clamp(28px,5vw,48px);
  }
  .hero h1{ font-size:clamp(1.85rem,7.5vw,2.6rem); }
  .hero__tag{ font-size:.74rem; letter-spacing:.14em; }
  .hero__sub{ font-size:.97rem; margin-bottom:22px; }
  .hero__actions{ gap:10px; margin-bottom:24px; flex-wrap:wrap; }
}

/* --- 3. Page header — внутренние страницы --- */
@media (max-width:640px){
  .page-header{
    padding-top:clamp(98px,24vw,140px);
    padding-bottom:clamp(32px,6vw,56px);
  }
  .page-header h1{ font-size:clamp(1.55rem,6.5vw,2.2rem); }
  .page-header__lede{ font-size:.93rem; }
}

/* --- 4. Кнопки — немного компактнее на маленьких --- */
@media (max-width:480px){
  .btn{ padding:12px 18px; font-size:.87rem; gap:8px; }
  .btn--icon svg{ width:14px; height:14px; }
}

/* --- 5. Cat-nav (каталог) — горизонтальный скролл вместо переноса --- */
@media (max-width:780px){
  .cat-nav{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .cat-nav::-webkit-scrollbar{ display:none; }
  .cat-nav a{
    flex:0 0 auto;
    white-space:nowrap;
    font-size:.71rem;
    padding:14px 14px;
  }
}

/* --- 6. Split внутри grid--2 (партнёры на about.html) ---
   Без фикса: при 620-900px каждая ячейка — 50%, split внутри 1-кол → очень узко */
@media (max-width:900px){
  .grid--2 > .split,
  .grid--2 > .split--reverse{
    grid-column:1 / -1;
    grid-template-columns:1fr;
  }
}

/* --- 7. Section head — плотнее на мобильных --- */
@media (max-width:640px){
  .section-head{ gap:14px 20px; margin-bottom:clamp(20px,4vw,36px); }
  h2{ font-size:clamp(1.55rem,5.5vw,1.9rem); }
  .lede{ font-size:1rem; }
}

/* --- 8. CTA banner — вертикальный стек на мобильных --- */
@media (max-width:640px){
  .cta-banner__inner{
    flex-direction:column;
    align-items:flex-start;
    gap:20px;
  }
  .cta-banner h2{
    max-width:none;
    font-size:clamp(1.35rem,5vw,1.85rem);
  }
  .cta-banner__actions{
    flex-direction:column;
    width:100%;
    gap:10px;
  }
  .cta-banner__actions .btn{
    width:100%;
    justify-content:center;
  }
}

/* --- 9. Карточки — меньше padding на мобильных --- */
@media (max-width:640px){
  .card{ padding:20px 18px; }
  .partner-card{ padding:20px 18px; }
  .industry-card{ padding:18px 16px; }
}

/* --- 10. Logo strip — центрирование на маленьких --- */
@media (max-width:560px){
  .logo-strip{ justify-content:center; gap:18px 28px; }
  .logo-strip img{ max-height:34px; }
}

/* --- 11. Stat grid — принудительно 2×2 на маленьких телефонах --- */
@media (max-width:480px){
  .stat-grid{ grid-template-columns:repeat(2,1fr); }
  .stat-grid div{ padding:16px 12px; }
  .stat-grid strong{ font-size:clamp(1.2rem,5vw,1.7rem); }
}

/* --- 12. Process — меньше padding в 1-кол --- */
@media (max-width:560px){
  .process__step{ padding:18px 16px; }
}

/* --- 13. Карта контактов — более квадратная на мобильных --- */
@media (max-width:640px){
  .map-frame{ aspect-ratio:4/3; }
}

/* --- 14. HVC valve showcase — уменьшенные отступы --- */
@media (max-width:640px){
  .hvc-valve-showcase{ padding:14px 18px 26px; }
  .hvc-valve-showcase img{ max-width:88%; }
}

/* --- 15. Лого в хедере — немного компактнее --- */
@media (max-width:480px){
  .site-header .logo img{ height:26px; }
}

/* --- 16. Feature list — компактнее --- */
@media (max-width:540px){
  .feature-list li{ gap:12px; }
  .feature-list b{ font-size:.94rem; }
  .feature-list span{ font-size:.87rem; }
}

/* --- 17. Pill row — перенос и gap на мобильных --- */
@media (max-width:540px){
  .pill-row{ gap:8px; }
  .pill{ font-size:.78rem; padding:5px 11px; }
}

/* --- 18. Footer — section lede короче --- */
@media (max-width:480px){
  .footer-grid p{ max-width:none; }
}

/* --- 19. Section отступы на совсем маленьких --- */
@media (max-width:400px){
  .section{ padding-block:clamp(44px,10vw,80px); }
  .section--tight{ padding-block:clamp(32px,8vw,56px); }
}

/* ==========================================================================
   Visit gallery (about page — field visits section)
   ========================================================================== */

/* ==========================================================================
   Field visits (about page) — компактный split: текст слева, коллаж справа
   ========================================================================== */

.field-visits{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:clamp(32px,6vw,72px);
  align-items:center;
}

.field-visits__text .eyebrow{ margin-bottom:14px; }
.field-visits__text h2{ font-size:clamp(1.5rem,3vw,2.1rem); }
.field-visits__text p{
  margin-top:16px;
  font-size:.97rem;
  color:var(--ink-soft,#555);
  line-height:1.65;
  max-width:44ch;
}

/* Правая колонка — коллаж из трёх фото */
.field-visits__photos{ display:flex; flex-direction:column; gap:5px; }

.field-visits__top{
  position:relative;
  overflow:hidden;
  height:170px;
}

.field-visits__bottom{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5px;
}

.field-visits__photo{
  position:relative;
  overflow:hidden;
  height:120px;
}

/* Все фото */
.field-visits__top img,
.field-visits__photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .6s var(--ease);
}

.field-visits__top:hover img,
.field-visits__photo:hover img{ transform:scale(1.05); }

/* Подписи */
.field-visits__top span,
.field-visits__photo span{
  position:absolute;
  bottom:0; left:0; right:0;
  padding:22px 12px 8px;
  font-size:.7rem;
  color:rgba(255,255,255,.85);
  background:linear-gradient(to top, rgba(15,39,71,.68) 0%, transparent 100%);
  font-family:var(--font-display);
  letter-spacing:.06em;
}

/* Mobile */
@media (max-width:780px){
  .field-visits{ grid-template-columns:1fr; gap:24px; }
  .field-visits__text p{ max-width:none; }
  .field-visits__top{ height:200px; }
  .field-visits__photo{ height:140px; }
}

/* ==========================================================================
   Certificate showcase (about page — quality section)
   ========================================================================== */

.cert-showcase{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(20px,4vw,40px);
  margin-top:24px;
}

.cert-showcase__frame{
  display:flex;
  align-items:center;
  justify-content:center;
  transition:opacity .3s var(--ease);
}

.cert-showcase__frame:hover{
  opacity:.88;
}

.cert-showcase__frame img{
  width:100%;
  height:auto;
  display:block;
}

.cert-showcase__caption{
  margin-top:14px;
  font-size:.8rem;
  color:var(--ink-soft, #666);
  line-height:1.55;
}

@media (max-width:640px){
  .cert-showcase{
    grid-template-columns:1fr;
    gap:28px;
  }
}