/* AI Automation Consultant page. */
.st3 { grid-area: mvp; position: relative; background: #fff; border: var(--line); border-radius: 22px; box-shadow: 10px 10px 0 var(--ink); overflow: hidden; }
.st3-top { display: flex; justify-content: space-between; align-items: center; padding: .8rem 1.1rem; background: var(--ink); color: var(--paper); font-weight: 800; }
.st3-hrs { font-family: var(--f-mono); font-size: .76rem; color: rgba(255, 253, 247, .75); font-weight: 400; }
.st3-hrs em { font-style: normal; font-family: var(--f-sans); font-weight: 800; font-size: 1.1rem; color: var(--yellow); font-variant-numeric: tabular-nums; }
.st3-body { position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: .55rem; min-height: 400px; padding: 1.2rem 1.4rem 1.6rem; background-color: var(--paper); background-image: radial-gradient(rgba(13, 20, 33, .1) 1px, transparent 1.2px); background-size: 18px 18px; border-bottom: 5px solid var(--ink); }
.lay { position: relative; display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; align-items: center; gap: .1rem 1rem; width: 100%; padding: 1rem 1.2rem; border: var(--line); border-radius: 16px; text-align: left; box-shadow: 5px 5px 0 var(--ink); transform: translateY(-460px) rotate(var(--r, 0deg)); opacity: 0; transition: box-shadow .25s; cursor: pointer; }
.lay.in { transform: translate(var(--x, 0), var(--y, 0)) rotate(var(--r, 0deg)); opacity: 1; transition: transform 800ms cubic-bezier(.34, 1.45, .64, 1), opacity .2s, box-shadow .25s; }
.lay:hover { box-shadow: 8px 8px 0 var(--ink); }
.l1 { background: var(--yellow); } .l2 { background: #d6f7ec; } .l3 { background: #fbe6dc; }
.ly-n { grid-row: 1 / 3; display: grid; place-items: center; width: 3.6rem; height: 3.6rem; border: var(--line); border-radius: 12px; background: #fff; font-family: var(--f-mono); font-size: .6rem; font-weight: 700; text-align: center; line-height: 1.1; padding: .2rem; }
.ly-t { font-size: 1.4rem; font-weight: 800; letter-spacing: -.035em; line-height: 1; }
.ly-d { grid-column: 2; font-size: .84rem; color: var(--ink-2); }
.ly-i { grid-row: 1 / 3; grid-column: 3; display: flex; gap: .4rem; }
.ly-i img { height: 26px; width: auto; }
.st3.pull .l1 { --x: 115%; --r: 4deg; transition: transform 500ms cubic-bezier(.7, 0, .3, 1); }
.st3.pull .l2 { --y: 70px; --r: -9deg; --x: -4%; }
.st3.pull .l3 { --y: 64px; --r: 12deg; --x: 6%; }
.st3.pull .l2.in, .st3.pull .l3.in { transition: transform 700ms cubic-bezier(.5, 0, .75, 0) .18s; }
.st3-toast { position: absolute; left: 1rem; right: 1rem; top: 1rem; padding: .8rem 1rem; border: var(--line); border-radius: 14px; background: var(--ink); color: var(--paper); font-weight: 600; font-size: .9rem; opacity: 0; transform: translateY(-10px); transition: opacity .3s, transform .5s var(--spring); pointer-events: none; }
.st3-toast b { color: var(--yellow); }
.st3.pull .st3-toast { opacity: 1; transform: none; }
.st3-hint { position: absolute; right: 1.1rem; bottom: .5rem; font-family: var(--f-mono); font-size: .6rem; letter-spacing: .08em; text-transform: uppercase; color: var(--paper); }

/* leak */
.leak { position: sticky; top: 100px; padding: 1.5rem; border: var(--line); border-radius: 22px; background: var(--ink); color: var(--paper); box-shadow: 10px 10px 0 var(--pink); }
.lk-l { font-family: var(--f-mono); font-size: .66rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--pink); }
.lk-big { font-size: clamp(3rem, 2rem + 3vw, 4.6rem); font-weight: 800; letter-spacing: -.06em; line-height: 1; margin-top: .4rem; }
.lk-s { color: rgba(255, 253, 247, .78); margin-top: .4rem; }
.lk-live { margin-top: 1.2rem; padding: 1rem; border: 1.5px solid rgba(255, 253, 247, .25); border-radius: 14px; }
.lk-live label { display: grid; grid-template-columns: 1fr auto; gap: .2rem .8rem; font-size: .85rem; font-weight: 600; }
.lk-live output { color: var(--yellow); font-weight: 800; }
.lk-live input { grid-column: 1 / -1; width: 100%; accent-color: var(--yellow); }
.lk-t { margin-top: .8rem; font-size: .95rem; }
.lk-t b { color: var(--pink); font-size: 1.25rem; font-variant-numeric: tabular-nums; }
.lk-m { margin-top: .3rem; font-family: var(--f-mono); font-size: .6rem; color: rgba(255, 253, 247, .55); }
.lk-c { margin-top: 1rem; font-size: .92rem; color: rgba(255, 253, 247, .78); }
.lk-c b { color: var(--paper); }

/* stages */
.stages { padding: clamp(5rem, 12vh, 8rem) var(--gut); background: var(--paper); border-top: var(--line); }
.stg-p { margin-top: 1.1rem; color: var(--ink-2); max-width: 64ch; }
.stg-list { display: flex; flex-direction: column-reverse; gap: .9rem; margin-top: 2.4rem; }
.stg { display: grid; grid-template-columns: 7rem 1fr auto; grid-template-rows: auto auto; gap: .2rem 1.4rem; align-items: center; padding: 1.4rem 1.6rem; border: var(--line); border-radius: 20px; text-decoration: none; box-shadow: 6px 6px 0 var(--ink); transition: transform .5s var(--spring), box-shadow .3s; }
.stg:hover { transform: translate(-4px, -4px); box-shadow: 10px 10px 0 var(--ink); }
.stg.s1 { background: var(--yellow); } .stg.s2 { background: #d6f7ec; margin-inline: clamp(0rem, 3vw, 3rem); } .stg.s3 { background: #fbe6dc; margin-inline: clamp(0rem, 6vw, 6rem); }
.stg-n { grid-row: 1 / 3; font-family: var(--f-mono); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.stg h3 { font-size: clamp(1.8rem, 1.2rem + 1.8vw, 3rem); font-weight: 800; letter-spacing: -.05em; line-height: 1; }
.stg p { grid-column: 2; color: var(--ink-2); max-width: 60ch; }
.stg b { grid-row: 1 / 3; grid-column: 3; white-space: nowrap; }

/* world clocks */
.world { padding: clamp(5rem, 12vh, 8rem) var(--gut); background: var(--ink); color: var(--paper); border-top: var(--line); }
.world .eyebrow { color: rgba(255, 253, 247, .6); }
.wd-copy > p:not(.eyebrow) { margin-top: 1.1rem; color: rgba(255, 253, 247, .75); max-width: 66ch; }
.zones { margin-top: 2.6rem; padding: 1.4rem; border: 2px solid rgba(255, 253, 247, .3); border-radius: 22px; background: #111a28; }
.zn-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 1rem; }
.zn-head b { display: block; font-size: 1.15rem; }
.zn-head span { font-size: .86rem; color: rgba(255, 253, 247, .65); }
.zn-dl { font-family: var(--f-mono); font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: rgba(255, 253, 247, .65); }
.zn-dl b { display: inline; font-family: var(--f-sans); font-size: 1.5rem; letter-spacing: -.03em; text-transform: none; color: var(--yellow); margin-left: .4rem; }
.zn-ruler, .zn-track { margin-left: 13rem; }
.zn-ruler { display: flex; justify-content: space-between; margin-top: 1.4rem; font-family: var(--f-mono); font-size: .6rem; color: rgba(255, 253, 247, .5); }
.zn-rows { display: grid; gap: .5rem; margin-top: .5rem; }
.zn-row { position: relative; display: grid; grid-template-columns: 13rem 1fr; align-items: center; }
.zn-row .zn-track { margin-left: 0; }
.zn-who { display: grid; gap: .1rem; padding-right: 1rem; }
.zn-who small { font-family: var(--f-mono); font-size: .64rem; color: rgba(255, 253, 247, .6); }
.zn-who .zn-t { margin-left: .35rem; color: var(--yellow); }
.zn-who b { font-size: 1rem; }
.zn-who span { font-family: var(--f-mono); font-size: .72rem; color: rgba(255, 253, 247, .6); font-variant-numeric: tabular-nums; }
.zn-who i { font-style: normal; }
.zn-track { position: relative; height: 34px; border-radius: 10px; background: repeating-linear-gradient(90deg, rgba(255, 253, 247, .06) 0 calc(100% / 24 - 1px), rgba(255, 253, 247, .14) calc(100% / 24 - 1px) calc(100% / 24)); overflow: hidden; }
.zn-bar { position: absolute; top: 5px; bottom: 5px; border-radius: 7px; background: var(--c, var(--blue)); border: 1.5px solid var(--paper); display: flex; align-items: center; padding: 0 .5rem; font-family: var(--f-mono); font-size: .58rem; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; transform-origin: 0 50%; animation: barIn .9s var(--ease-out) both; }
@keyframes barIn { from { transform: scaleX(0); } }
.zn-row.me .zn-who b::after { content: " · you"; color: var(--yellow); font-weight: 700; }
.zn-row.me .zn-track { box-shadow: 0 0 0 2px var(--yellow); }
.zn-now { position: absolute; top: -.3rem; bottom: -.3rem; width: 2px; background: var(--yellow); left: calc(13rem + (100% - 13rem) * var(--p, 0)); pointer-events: none; }
.zn-now::before { content: "now"; position: absolute; top: -1.1rem; left: 50%; transform: translateX(-50%); font-family: var(--f-mono); font-size: .56rem; color: var(--yellow); }
.zn-rows { position: relative; }
.zn-note { margin-top: 1.2rem; font-size: .9rem; color: rgba(255, 253, 247, .7); }
.zn-note b { color: var(--paper); }
.promise { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 2.6rem; }
.promise li { padding: 1.2rem; border: 1.5px solid rgba(255, 253, 247, .3); border-radius: 16px; color: rgba(255, 253, 247, .8); font-size: .94rem; }
.promise b { display: block; color: var(--yellow); font-size: 1.05rem; margin-bottom: .3rem; }

/* buyer's guide */
.guide { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(2rem, 5vw, 5rem); padding: clamp(5rem, 12vh, 8rem) var(--gut); background: var(--cream); border-top: var(--line); }
.gd-copy { position: sticky; top: 100px; align-self: start; }
.gd-copy > p:not(.eyebrow):not(.gd-score) { margin-top: 1.1rem; color: var(--ink-2); max-width: 50ch; }
.gd-score { margin-top: 1.6rem; display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; font-weight: 800; }
.gd-n { font-size: 3.4rem; letter-spacing: -.06em; line-height: 1; }
.gd-v { font-family: var(--f-mono); font-size: .74rem; font-weight: 700; padding: .3rem .6rem; border: 1.5px solid var(--ink); border-radius: 8px; background: #fff; }
.gd-list { border-top: var(--line); }
.gd-list button { width: 100%; display: flex; align-items: center; gap: 1rem; text-align: left; padding: 1.15rem .6rem 1.15rem 0; border-bottom: var(--line); font-size: clamp(1rem, .95rem + .4vw, 1.25rem); font-weight: 700; letter-spacing: -.015em; line-height: 1.3; transition: background-color var(--d-fast), padding var(--d-std) var(--spring); }
.gd-list button i { flex: none; position: relative; width: 30px; height: 30px; border: var(--line); border-radius: 8px; background: #fff; transition: background-color var(--d-fast), transform 420ms var(--spring); }
.gd-list button i::after { content: "✓"; position: absolute; inset: 0; display: grid; place-items: center; font-style: normal; font-weight: 800; transform: scale(0); transition: transform 420ms var(--spring); }
.gd-list button:hover { background: #fff; padding-left: .6rem; }
.gd-list button[aria-pressed="true"] { background: #d6f7ec; padding-left: .6rem; }
.gd-list button[aria-pressed="true"] i { background: var(--mint); transform: rotate(-8deg); }
.gd-list button[aria-pressed="true"] i::after { transform: scale(1); }

/* terms */
.terms { padding: clamp(5rem, 12vh, 8rem) var(--gut); background: var(--paper); border-top: var(--line); }
.kt { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 2.2rem; }
.kt div { padding: 1.3rem; border: var(--line); border-radius: 18px; background: #fff; box-shadow: 5px 5px 0 var(--ink); }
.kt dt { font-size: 1.25rem; font-weight: 800; letter-spacing: -.025em; }
.kt dt::before { content: "§ "; color: var(--purple); }
.kt dd { margin: .5rem 0 0; color: var(--ink-2); font-size: .94rem; }
.kt-more { margin-top: 1.8rem; color: var(--ink-2); max-width: 90ch; line-height: 1.8; }
.kt-more a { color: var(--ink); font-weight: 700; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; }

@media (max-width: 900px) {
  .guide { grid-template-columns: 1fr; } .gd-copy { position: static; }
  .kt, .promise { grid-template-columns: 1fr; }
  .leak { position: static; }
  .stg { grid-template-columns: 1fr; } .stg-n, .stg b, .stg p { grid-row: auto; grid-column: 1; }
  .stg.s2, .stg.s3 { margin-inline: 0; }
}
@media (max-width: 600px) {
  .zn-ruler { margin-left: 0; } .zn-row { grid-template-columns: 1fr; gap: .25rem; } .zn-now { left: calc(100% * var(--p, 0)); } .zn-now::before { display: none; }
  .lay { grid-template-columns: auto 1fr; } .ly-i { display: none; }
  .ly-t { font-size: 1.15rem; }
  .st3-body { min-height: 340px; }
}
.page-cons .aie-h { font-size: clamp(2.4rem, 1rem + 3.6vw, 5.4rem); }