/* ========================================================================
   operations.css — page-specific layout for /operations/
   Hormozi rules: one idea per screen, huge type, few words, FULL WIDTH.
   Tokens only. No hex. No external assets.
   ======================================================================== */

/* --- wider measure than the default container ------------------------- */
.wrap{max-width:1320px}
.nav-in{max-width:1320px}

/* --- vertical rhythm: one scale, everywhere --------------------------- */
.hero{padding:88px 0 68px}
.section{padding:72px 0}

/* --- hero: one line, big --------------------------------------------- */
h1{font-size:clamp(2.6rem,8vw,5.6rem);line-height:.98;letter-spacing:-.04em}
.hero-grid{
  display:grid;grid-template-columns:1.15fr 1fr;gap:20px 64px;align-items:end;
  margin-top:8px;
}
.hero .lede{
  font-size:clamp(1.25rem,2.2vw,1.9rem);
  line-height:1.24;
  letter-spacing:-.02em;
  color:var(--ink);
  font-weight:600;
  max-width:none;
  margin:0 0 .35em;
}
.hero .lede em{font-style:normal;color:var(--accent-deep)}

/* --- section heads: one scale ---------------------------------------- */
.sec-head{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:16px;margin-bottom:44px;
}
.sec-head h2{font-size:clamp(1.9rem,4.4vw,3.1rem);line-height:1.04;letter-spacing:-.035em}
.sec-head .sub{
  font-family:var(--mono);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--accent-deep);
}

/* ======================================================================
   DEPARTMENT GRID — 3 up, full width
   ====================================================================== */
.dgrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2px;
  background:var(--line);
  border:1px solid var(--line);
  border-radius:var(--r-xl);
  overflow:hidden;
}
.dcard{
  background:var(--surface);
  padding:34px 30px 32px;
  display:flex;flex-direction:column;
  gap:18px;
}
.dcard-num{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--accent-deep);
}
.dcard h3{
  font-size:clamp(1.3rem,1.9vw,1.7rem);line-height:1.1;letter-spacing:-.028em;
}
.ds{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
.ds-tag{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;color:var(--ink-soft);padding-top:4px;min-width:44px;
}
.ds p{font-size:1.02rem;line-height:1.42;color:var(--ink-soft)}
.ds-after .ds-tag{color:var(--accent-deep)}
.ds-after p{color:var(--ink);font-weight:650}
.ds-rule{height:1px;background:var(--line);border:0;margin:0;flex:0 0 auto}
/* lock the rule to a common line: reserve fixed rows above it */
.dcard h3{min-height:2.2em;display:flex;align-items:flex-start}
.dcard .ds p{min-height:4.26em}
.dcard h3{margin-bottom:2px}

/* ======================================================================
   WORTH BAND — two big statements, side by side, full width
   ====================================================================== */
.worth-band{
  display:grid;grid-template-columns:1fr 1fr;gap:2px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--r-xl);
  overflow:hidden;
}
.worth-cell{background:var(--accent-tint);padding:44px 40px 46px}
.worth-cell .wk{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--accent-deep);margin-bottom:18px;
}
.worth-cell p{
  font-family:var(--display);
  font-size:clamp(1.25rem,2.2vw,1.75rem);line-height:1.22;letter-spacing:-.025em;
  font-weight:700;color:var(--ink);
}

/* ======================================================================
   CYCLE TIME — 2 up cards, huge numbers
   ====================================================================== */
.ctgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.ctcard{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);
  padding:32px 34px 34px;
}
.ctcard h3{font-size:clamp(1.2rem,1.7vw,1.5rem);letter-spacing:-.025em;margin-bottom:26px}
.ctpair{display:grid;gap:18px}
.ctrow{display:grid;grid-template-columns:64px 1fr auto;align-items:center;gap:16px}
.ctrow .t{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;color:var(--ink-soft);
}
.ctrow.is-after .t{color:var(--accent-deep)}
.ctrow svg{display:block;height:18px;width:100%;min-width:0}
.ctrow .v{
  font-family:var(--display);font-weight:800;letter-spacing:-.03em;
  font-size:clamp(1.15rem,1.8vw,1.55rem);color:var(--ink);white-space:nowrap;
}
.ctrow.is-after .v{color:var(--accent-deep)}
.ct-note{
  margin-top:26px;font-family:var(--mono);font-size:.74rem;line-height:1.6;
  color:var(--ink-soft);
}

/* ======================================================================
   CLOSE — full width, huge, centred
   ====================================================================== */
.close{
  background:var(--bg-warm);border:1px solid var(--line);border-radius:var(--r-xl);
  padding:84px 40px 88px;text-align:center;margin:0;
}
.close h2{font-size:clamp(2.1rem,5.4vw,4rem);line-height:1;letter-spacing:-.04em}
.close p{
  font-size:clamp(1.1rem,2.2vw,1.6rem);line-height:1.3;letter-spacing:-.02em;
  color:var(--ink-soft);max-width:32ch;margin:26px auto 0;
}
.close p b{color:var(--ink)}
.cta-row{justify-content:center;margin-top:40px;gap:24px}

/* ======================================================================
   RESPONSIVE
   ====================================================================== */
@media (max-width:1080px){
  .dgrid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;align-items:start;gap:22px}
  .hero .lede{margin-bottom:0}
}
@media (max-width:860px){
  .hero{padding:52px 0 40px}
  .section{padding:56px 0}
  .sec-head{margin-bottom:30px}
  .dgrid{grid-template-columns:1fr}
  .dcard{padding:28px 22px}
  .worth-band{grid-template-columns:1fr}
  .worth-cell{padding:30px 22px 32px}
  .ctgrid{grid-template-columns:1fr;gap:16px}
  .ctcard{padding:24px 22px 26px}
  .close{padding:52px 22px 56px}
  .cta-row{flex-direction:column;align-items:stretch}
}
@media (max-width:420px){
  .ds{grid-template-columns:1fr;gap:4px}
  .ds-tag{padding-top:0}
  .ctrow{grid-template-columns:52px 1fr auto;gap:10px}
  .ctrow .v{font-size:1rem}
}