/* ===================================================================
   industries/ind.css — shared template for the four solutions pages.
   Extends site.css (loaded first); same press-proof system.
   =================================================================== */

/* ---- hero ---- */
.ind-hero{position:relative;max-width:var(--maxw);margin:0 auto;padding:158px clamp(18px,4vw,44px) 30px}
.ind-hero .pms{display:inline-flex;align-items:center;gap:8px;font:600 9.5px/1 var(--mono);
  letter-spacing:.16em;color:var(--mut);border:1px solid var(--line-2);border-radius:999px;
  padding:7px 13px;background:var(--card);margin-bottom:18px}
.ind-hero .pms::before{content:"";width:10px;height:10px;border-radius:2.5px;background:var(--chip,var(--teal))}
.ind-hero h1{font-size:clamp(2rem,4vw,3.2rem);font-weight:640;letter-spacing:-.03em;max-width:22ch;margin:0 0 18px}
.ind-hero .lead{font-size:clamp(1.02rem,1.6vw,1.18rem);color:var(--mut);max-width:56ch;line-height:1.6;margin-bottom:26px}
.ind-hero .hero-cta{margin:0}

/* ---- the terrain: researched pressure stats ---- */
.terrain{max-width:var(--maxw);margin:0 auto;padding:26px clamp(18px,4vw,44px) 6px}
.terrain-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-top:26px}
.tstat{border:1px solid var(--line);border-radius:14px;background:var(--card);padding:20px 22px;
  transition:border-color .25s,transform .3s var(--ease),box-shadow .3s var(--ease)}
.tstat:hover{transform:translateY(-3px);border-color:var(--line-2);box-shadow:0 18px 34px -26px rgba(22,24,29,.3)}
.tstat b{display:block;font:640 clamp(1.4rem,2.2vw,1.9rem)/1.1 var(--mono);letter-spacing:-.02em;color:var(--ink);margin-bottom:8px}
.tstat b i{font-style:normal;color:var(--teal-text)}
.tstat span{font-size:13px;color:var(--mut);line-height:1.5;display:block}
.terrain-note{font:500 10.5px/1.6 var(--mono);letter-spacing:.06em;color:var(--dim);margin-top:18px;max-width:72ch}

/* ---- where it breaks ---- */
.breaks{max-width:var(--maxw);margin:0 auto;padding:44px clamp(18px,4vw,44px) 10px;
  display:grid;grid-template-columns:1fr 1fr;gap:22px}
.brk{border:1px solid var(--line);border-radius:16px;padding:26px 28px;background:var(--card)}
.brk.bad h4{color:var(--coral)}
.brk.good{border-color:rgba(5,198,184,.4);background:linear-gradient(180deg,rgba(5,198,184,.05),var(--card))}
.brk.good h4{color:var(--teal-text)}
.brk h4{font:600 10px/1 var(--mono);letter-spacing:.2em;margin-bottom:16px}
.brk ul{list-style:none}
.brk li{position:relative;padding:7px 0 7px 26px;font-size:14.5px;color:var(--mut);border-bottom:1px dashed var(--line)}
.brk li:last-child{border-bottom:0}
.brk li b{color:var(--ink);font-weight:600}
.brk.bad li::before{content:"✕";position:absolute;left:2px;top:8px;color:var(--coral);font-size:12px;font-weight:700}
.brk.good li::before{content:"✓";position:absolute;left:2px;top:8px;color:var(--teal-text);font-size:12px;font-weight:700}

/* ---- PROBLEM → IN PACKOS pairs ---- */
.answers{max-width:var(--maxw);margin:0 auto;padding:44px clamp(18px,4vw,44px) 10px}
.pp{display:flex;align-items:stretch;flex-wrap:wrap;gap:0;margin-top:16px;max-width:820px}
.pp span{flex:1 1 240px;padding:13px 16px;font-size:13.5px;line-height:1.55}
.pp .q{background:var(--card);border:1px solid var(--line-2);border-radius:12px 0 0 12px;color:var(--mut)}
.pp .a{background:rgba(5,198,184,.07);border:1px solid rgba(5,198,184,.4);border-left:0;
  border-radius:0 12px 12px 0;color:var(--ink);position:relative;transition:background .25s,transform .25s var(--ease)}
.pp .q b,.pp .a b{display:block;font:600 8.5px/1 var(--mono);letter-spacing:.18em;margin-bottom:6px}
.pp .q b{color:var(--dim)}
.pp .a b{color:var(--teal-text)}
.pp .a::before{content:"→";position:absolute;left:-7px;top:50%;transform:translateY(-50%);
  width:14px;height:14px;border-radius:50%;background:var(--teal);color:var(--ink);
  font:700 9px/14px var(--font);text-align:center}
.pp:hover .a{background:rgba(5,198,184,.13);transform:translateX(2px)}
.pp .a .status{margin-left:8px;vertical-align:1px}

/* ---- signature interactive shell ---- */
.sig{max-width:var(--maxw);margin:0 auto;padding:44px clamp(18px,4vw,44px) 10px}
.sig-box{border:1px solid var(--line-2);border-radius:16px;background:var(--card);padding:26px;margin-top:26px;position:relative}
.sig-note{font:500 10px/1.6 var(--mono);letter-spacing:.06em;color:var(--dim);margin-top:16px;max-width:78ch}

/* ---- Calyx proof band ---- */
.proofband{max-width:var(--maxw);margin:26px auto 0;padding:0 clamp(18px,4vw,44px)}
.proof-in{border:1px solid var(--line);border-radius:16px;background:var(--paper-2);padding:26px 30px;
  display:flex;gap:26px;align-items:center;flex-wrap:wrap;justify-content:space-between}
.proof-in p{font-size:14.5px;color:var(--mut);max-width:56ch}
.proof-in p b{color:var(--ink)}
.proof-meta{display:flex;gap:16px;font:600 9.5px/1 var(--mono);letter-spacing:.14em;color:var(--dim);flex-wrap:wrap}
.proof-meta i{font-style:normal;color:var(--teal-text)}

/* ---- FAQ + close (reuses .faq-list from site.css/interact) ---- */
.ind-faq{max-width:var(--maxw);margin:0 auto;padding:44px clamp(18px,4vw,44px) 10px}
.ind-close{max-width:var(--maxw);margin:0 auto;padding:40px clamp(18px,4vw,44px) 110px;text-align:center}
.ind-close h2{font-size:clamp(1.5rem,2.8vw,2.2rem);font-weight:630;letter-spacing:-.025em;margin-bottom:12px}
.ind-close p{color:var(--mut);max-width:52ch;margin:0 auto 28px}
.ind-close .hero-cta{justify-content:center}

@media (max-width:860px){
  .ind-hero{padding-top:140px}
  .breaks{grid-template-columns:1fr}
}

/* ---- category photography: press-proof figure band ---- */
.ind-figure{max-width:var(--maxw);margin:34px auto 6px;padding:0 clamp(18px,4vw,44px)}
.ind-figure .crops{border-radius:14px}
.ind-figure img{width:100%;height:auto;display:block;border-radius:14px;border:1px solid var(--line)}
.ind-figure figcaption{display:flex;align-items:center;gap:8px;margin-top:12px;
  font:600 8.5px/1 var(--mono);letter-spacing:.18em;color:var(--dim)}
.ind-figure .reg{width:13px;height:13px;stroke:var(--dim);fill:none;stroke-width:1.5;flex:none}

/* ---- photographic accents: proof-band cutout ---- */
.proof-cut{width:clamp(90px,10vw,130px);height:auto;flex:none;pointer-events:none;user-select:none;
  align-self:flex-end;margin:-4px -6px -30px 0}
@media (max-width:720px){.proof-cut{display:none}}
