/* ==========================================================================
   Tema India, os mesmos tokens de app/globals.css convertidos para hex.
   Fonte da conversão: MDs Learning Engine/20260807_..._Guia India.
   Regra de contraste que restringe a página inteira: coral sobre fundo claro
   dá 3,63:1, então coral só em título. Corpo em preto, apoio em #525252.
   ========================================================================== */
:root{
  color-scheme: light;
  --bg:#FDFDFD; --fg:#000; --card:#FFF; --muted:#525252;
  --primary:#F2470C; --primary-btn:#D93D08; --accent:#FFF0EB; --accent-fg:#CB3706;
  --border:#E7E7EE; --secondary:#EDF0F4;
  --etapa-1:#FFCDBE; --etapa-2:#FFD5C8; --etapa-3:#FFDCD2; --etapa-4:#FFE4DB;
  --etapa-5:#FFEBE5; --etapa-6:#FFF3EF; --etapa-fg:#961F00;
  --chart-4:#3276E4;
  --r:22px; --r-sm:14px; --r-xs:10px;
  --sans:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --serif:"Lora",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --shell:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;margin:0}
h1{font-size:clamp(1.95rem,3.2vw,2.7rem);line-height:1.16}
h2{font-size:clamp(1.7rem,3vw,2.5rem);line-height:1.18}
h3{font-size:1.06rem;line-height:1.3;font-weight:600}
p{margin:0}
.shell{max-width:var(--shell);margin:0 auto;padding:0 24px}
.lead{font-size:1.06rem;color:var(--muted);max-width:60ch}
.kicker{font-family:var(--mono);font-size:.68rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--accent-fg)}
section{padding:clamp(72px,9vw,128px) 0;scroll-margin-top:78px}
.rule{height:1px;background:var(--border);border:0;margin:0}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  white-space:nowrap;font-family:var(--sans);font-weight:600;font-size:.94rem;
  padding:13px 24px;border-radius:999px;border:1px solid transparent;
  text-decoration:none;cursor:pointer;transition:background .18s ease,
  border-color .18s ease,transform .12s ease,box-shadow .18s ease}
.btn-primary{background:var(--primary-btn);color:#fff;
  box-shadow:0 1px 3px rgb(242 71 12 / .28), 0 6px 18px rgb(242 71 12 / .16)}
.btn-primary:hover{background:#BF3405}
.btn-primary:active{transform:translateY(1px)}
.btn-ghost{background:transparent;color:var(--fg);border-color:var(--border)}
.btn-ghost:hover{border-color:#C9C9D4;background:#fff}
.btn-lg{padding:15px 30px;font-size:1rem}

/* ---------- header ---------- */
header{position:sticky;top:0;z-index:50;background:rgb(253 253 253 / .88);
  backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--border)}
.nav{height:70px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
/* PLACEHOLDER: a marca gráfica do Learning Engine ainda não existe.
   Enquanto não existir, o canto leva wordmark em Plus Jakarta Bold. */
.brand .mark{width:30px;height:30px;border-radius:9px;border:1.5px dashed #F2470C66;
  display:grid;place-items:center;font-family:var(--mono);font-size:.5rem;
  color:#F2470C99;line-height:1;text-align:center}
.brand .word{font-weight:700;font-size:1.02rem;letter-spacing:-.02em}
.nav-cta .entrar{font-size:.9rem;font-weight:500;color:var(--muted);text-decoration:none;
  padding:6px 0;border-bottom:2px solid transparent;transition:color .18s ease}
.nav-cta .entrar:hover{color:var(--fg)}
.nav-cta{display:flex;align-items:center;gap:16px}

/* ---------- hero ---------- */
.hero{padding-top:clamp(56px,6vw,88px);padding-bottom:clamp(64px,7vw,104px);
  position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;inset:auto -10% -60% 40%;height:520px;
  background:radial-gradient(closest-side,#FFF0EB,transparent 72%);z-index:-1}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(32px,5vw,72px);
  align-items:center}
.hero h1{margin:18px 0 20px;text-wrap:balance}
.hero h1 em{font-style:normal;color:var(--primary)}
.hero .lead{font-size:1.12rem;max-width:44ch}
.hero .actions{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap}

/* ---------- moldura de aparelho ---------- */
/* A moldura é a imagem enviada, recortada no corpo do aparelho (310x636).
   A proporção não é tocada: a tela é posicionada em porcentagem da própria
   imagem, medida pixel a pixel no arquivo. A faixa do topo fica transparente
   de propósito, para a ilha do aparelho continuar aparecendo. */
.device{position:relative;width:100%;max-width:292px;
  filter:drop-shadow(0 22px 36px rgb(0 0 0 / .24)) drop-shadow(0 2px 4px rgb(0 0 0 / .12))}
.device>img{width:100%;height:auto;display:block;border-radius:15.48% / 7.55%}
.device-screen{position:absolute;left:7.1%;top:3.62%;width:86.13%;height:93.87%;
  border-radius:11.6% / 5.19%;overflow:hidden;background:transparent;
  display:flex;flex-direction:column}
.screen-top{height:8.6%;flex:none}
.phone-bar{display:flex;align-items:center;gap:8px;padding:10px 14px 10px;
  border-bottom:1px solid var(--border);background:#fff;flex:none}
.phone-bar .dot{width:26px;height:26px;border-radius:8px;background:var(--accent);
  display:grid;place-items:center;font-family:var(--mono);font-size:.6rem;
  font-weight:600;color:var(--accent-fg);flex:none}
.phone-bar b{font-size:.78rem;font-weight:600;white-space:nowrap}
.phone-bar span{font-family:var(--mono);font-size:.6rem;color:var(--muted);margin-left:auto}
.thread{padding:14px 12px;display:flex;flex-direction:column;gap:9px;flex:1;
  overflow:hidden;background:#fff}
.bubble{background:#FCFCFD;border:1px solid var(--border);border-radius:var(--r-sm);
  border-bottom-left-radius:5px;padding:11px 13px;font-size:.79rem;line-height:1.5;
  max-width:95%}
.bubble.me{align-self:flex-end;background:var(--accent);border-color:#FFD9CC;
  border-bottom-left-radius:var(--r-sm);border-bottom-right-radius:5px;color:#3A1608}
.bubble b{font-weight:600}
.bubble ul{margin:7px 0 0;padding-left:16px;color:var(--muted)}
.bubble li{margin:2px 0}
.bubble .task-label{font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent-fg);display:block;margin-bottom:5px}
.phone-foot{padding:8px 12px 12px;border-top:1px solid var(--border);background:#fff;flex:none}
.phone-foot .fake-input{border:1px solid var(--border);border-radius:999px;
  padding:8px 13px;font-size:.72rem;color:#71717F;display:flex;justify-content:space-between;
  align-items:center;gap:8px}
.phone-foot .send{width:22px;height:22px;border-radius:50%;background:var(--primary-btn);
  display:grid;place-items:center;flex:none}
.phone-foot .send svg{width:12px;height:12px;stroke:#fff;fill:none;stroke-width:2.2}

/* ---------- composição do hero ---------- */
.stage{position:relative;min-height:520px}
.stage .desk{position:absolute;left:37%;top:6%;width:106%;border-radius:var(--r);
  background:#fff;border:1px solid var(--border);
  box-shadow:0 1px 3px rgb(0 0 0 / .06), 0 24px 48px -24px rgb(0 0 0 / .28);
  overflow:hidden}
.stage .device{position:relative;z-index:2;margin:0}

/* ---------- painel do RH ---------- */
.panel-bar{display:flex;align-items:center;gap:6px;padding:11px 14px;
  border-bottom:1px solid var(--border);background:#FCFCFD}
.panel-bar i{width:9px;height:9px;border-radius:50%;background:#E4E4EC;display:block}
.panel-bar b{margin-left:8px;font-size:.74rem;font-weight:600}
.panel-bar em{font-style:normal;font-family:var(--mono);font-size:.62rem;color:var(--muted);margin-left:auto}
.panel-body{padding:16px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.stat{border:1px solid var(--border);border-radius:var(--r-sm);padding:11px 12px;background:#fff}
.stat .label{font-family:var(--mono);font-size:.55rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.stat .value{font-family:var(--mono);font-size:1.32rem;font-weight:600;
  font-variant-numeric:tabular-nums;margin-top:3px;line-height:1.1}
.stat .value.up{color:var(--primary)}
.stat .hint{font-family:var(--mono);font-size:.55rem;color:var(--muted);margin-top:2px}
.spark{margin-top:14px;border:1px solid var(--border);border-radius:var(--r-sm);
  padding:12px 14px 10px;background:#fff}
.spark-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.spark-head b{font-size:.72rem;font-weight:600}
.spark-head span{font-family:var(--mono);font-size:.58rem;color:var(--muted)}
.bars{display:flex;align-items:flex-end;gap:5px;height:64px}
.desk-static .bars{height:104px;gap:6px}
.panel-cols{display:grid;grid-template-columns:1.4fr .6fr;gap:10px;margin-top:10px}
.panel-cols .spark{margin-top:0}
.panel-cols .spark:last-child{display:flex;flex-direction:column}
.panel-cols .rubric{grid-template-columns:1fr;grid-template-rows:repeat(3,1fr);gap:8px;margin-top:0;flex:1}
.panel-cols .crit{display:flex;flex-direction:column;justify-content:center}
@media (max-width:1000px){.panel-cols{grid-template-columns:1fr}}
.desk-static .bars i{border-radius:6px 6px 3px 3px}
.bars i{flex:1;background:var(--etapa-2);border-radius:4px 4px 2px 2px;display:block}
.bars i.on{background:var(--primary)}
.weeks{display:flex;gap:5px;margin-top:6px}
.weeks span{flex:1;text-align:center;font-family:var(--mono);font-size:.5rem;color:var(--muted)}
.mock-tag{font-family:var(--mono);font-size:.58rem;color:var(--muted);
  margin-top:12px;display:flex;align-items:center;gap:7px}
.mock-tag::before{content:"";width:14px;height:1px;background:var(--border);flex:none}

/* ---------- dores ---------- */
.pains{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:52px;
  position:relative}
.pains::before{content:"";position:absolute;left:8%;right:8%;top:31px;height:1px;
  background:linear-gradient(90deg,var(--border),var(--primary),var(--border))}
.pain{padding:0 26px;position:relative}
.pain:first-child{padding-left:0}
.pain:last-child{padding-right:0}
.pain .node,.choice .node{width:62px;height:62px;border-radius:20px;background:#fff;
  border:1px solid var(--border);display:grid;place-items:center;position:relative;
  z-index:1;margin-bottom:22px}
.pain .node svg,.choice .node svg{width:26px;height:26px;stroke:var(--primary);fill:none;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.pain .who,.choice .who{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.pain blockquote{margin:0 0 14px;font-family:var(--serif);font-size:1.16rem;
  line-height:1.34;font-weight:500;max-width:19ch}
.pain p{color:var(--muted);font-size:.94rem;max-width:34ch}
.pain .take{margin-top:14px;padding-top:14px;border-top:1px solid var(--border);
  color:var(--fg);font-weight:600;font-size:.92rem;max-width:32ch}
.pains + .actions{margin-top:56px;display:flex;justify-content:center}

/* ---------- entrada: escolha do público ---------- */
.fork{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:44px}
.choice{display:flex;flex-direction:column;align-items:flex-start;background:#fff;
  border:1px solid var(--border);border-radius:var(--r);padding:clamp(28px,3.4vw,44px);
  text-decoration:none;color:var(--fg);
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.choice:hover{border-color:var(--primary);transform:translateY(-2px);
  box-shadow:0 22px 44px -30px rgb(242 71 12 / .5)}
.choice:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
.choice h3{font-size:clamp(1.4rem,2.2vw,1.8rem);margin-bottom:12px}
.choice p{color:var(--muted);max-width:40ch}
.choice .go{margin-top:auto;padding-top:26px;display:inline-flex;align-items:center;gap:8px;
  font-weight:600;font-size:.94rem;color:var(--accent-fg)}
.choice .go svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;
  transition:transform .18s ease}
.choice:hover .go svg{transform:translateX(3px)}
/* Seção em coral: só o título fica direto sobre a cor, e é texto grande
   (branco sobre #F2470C dá 3,70:1, acima dos 3:1 exigidos para esse tamanho).
   O resto vive dentro dos cartões brancos. O foco não pode ser coral sobre coral. */
.coral{background:var(--primary)}
.coral h2{color:#fff}
.coral .choice{border-color:transparent}
.coral .choice:hover{border-color:transparent;box-shadow:0 26px 50px -28px rgb(90 25 0 / .6)}
.coral .choice:focus-visible{outline-color:#fff}

/* ---------- diagrama do ciclo ---------- */
.cycle{background:#0A0A0A;color:#F0F0F0;border-radius:var(--r);
  padding:clamp(32px,4.4vw,56px);margin-top:48px}
.cycle h3{color:#F0F0F0;font-family:var(--sans);font-size:.82rem;font-weight:600;
  letter-spacing:.02em;margin-bottom:26px}
.cycle .sub{display:block;color:#969696;font-size:.86rem;margin-top:6px;font-weight:400}
.week{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;position:relative}
.day{background:#121212;border:1px solid #1F1F1F;border-radius:var(--r-sm);
  padding:20px 20px 22px;position:relative}
.day .d{font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;
  text-transform:uppercase;color:#969696}
.day .n{font-family:var(--serif);font-size:1.34rem;color:var(--primary);
  margin:8px 0 10px;font-weight:600}
.day p{color:#D4D4D4;font-size:.86rem;line-height:1.52}
.day::after{content:"";position:absolute;right:-13px;top:50%;width:8px;height:8px;
  border-top:1.5px solid #F2470C;border-right:1.5px solid #F2470C;
  transform:translateY(-50%) rotate(45deg)}
.day:last-child::after{display:none}
.loop{display:flex;align-items:center;gap:12px;margin-top:22px;
  font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;
  text-transform:uppercase;color:#969696}
.loop .line{flex:1;height:1px;background:linear-gradient(90deg,#F2470C,#1F1F1F)}
.long{margin-top:44px;padding-top:40px;border-top:1px solid #1F1F1F}
.phases{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:24px}
.phase{border-radius:var(--r-sm);padding:16px 16px 18px;color:var(--etapa-fg)}
.phase:nth-child(1){background:var(--etapa-4)}
.phase:nth-child(2){background:var(--etapa-3)}
.phase:nth-child(3){background:var(--etapa-2)}
.phase:nth-child(4){background:var(--etapa-1)}
.phase .w{font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;
  text-transform:uppercase;opacity:.8}
.phase b{display:block;font-family:var(--serif);font-size:1.06rem;margin:6px 0 6px;font-weight:600}
.phase p{font-size:.79rem;line-height:1.45;color:#7A1900}

/* ---------- features em carrossel ---------- */
.carousel{position:relative;margin-top:24px}
.slides{display:grid;grid-auto-flow:column;grid-auto-columns:100%;
  overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;
  scrollbar-width:none;-ms-overflow-style:none}
.slides::-webkit-scrollbar{display:none}
.slide{scroll-snap-align:center;scroll-snap-stop:always;
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,64px);
  align-items:start;padding:clamp(16px,2vw,28px) 4px}
.slide .copy{padding-top:clamp(8px,5vw,72px)}
.slide.wide .copy{padding-top:0}
.slide.flip .copy{order:2}
.slide.wide{grid-template-columns:1fr;gap:28px;align-items:start}
.slide .copy h3{font-size:clamp(1.3rem,2.1vw,1.75rem);margin-bottom:14px}
.slide .copy p{color:var(--muted);max-width:44ch}
.slide .art{display:flex;justify-content:center;align-items:center}
.slide.wide .art{width:100%}
.dots{display:flex;justify-content:center;align-items:center;gap:9px;margin-top:10px}
.dots button{width:9px;height:9px;padding:0;border:0;border-radius:999px;cursor:pointer;
  background:#D3D3DD;transition:background .2s ease,width .2s ease}
.dots button:hover{background:#B6B6C4}
.dots button[aria-current="true"]{background:var(--primary);width:28px}
.dots button:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
.desk-static{width:100%;border-radius:var(--r);background:#fff;
  border:1px solid var(--border);overflow:hidden;
  box-shadow:0 1px 3px rgb(0 0 0 / .05), 0 18px 40px -26px rgb(0 0 0 / .22)}

/* nota da rubrica, no lugar certo: o painel do RH, não o celular */
.rubric{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.crit{border:1px solid var(--border);border-radius:var(--r-sm);padding:11px 12px}
.crit .label{font-family:var(--mono);font-size:.55rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted)}
.crit .value{font-family:var(--mono);font-size:1.1rem;font-weight:600;margin-top:3px}
.crit .value small{font-size:.62rem;font-weight:500;color:var(--muted);margin-left:2px}

/* faixa do gestor */
.band{background:var(--accent);border-radius:var(--r);padding:clamp(28px,3.6vw,44px);
  display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,56px);
  align-items:center;margin-top:16px}
.band h3{font-size:1.42rem;margin-bottom:12px;color:var(--accent-fg)}
.band p{color:#5A2814;max-width:42ch}
.gestor-card{background:#fff;border-radius:var(--r-sm);padding:18px 20px;
  box-shadow:0 12px 30px -20px rgb(0 0 0 / .3)}
.gestor-card .head{font-size:.82rem;font-weight:600;margin-bottom:12px}
.gestor-card .row{display:flex;align-items:baseline;gap:10px;
  padding-bottom:12px;border-bottom:1px solid var(--border);margin-bottom:12px}
.gestor-card .row .big{font-family:var(--mono);font-size:1.6rem;font-weight:600;
  color:var(--primary);line-height:1}
.gestor-card .row span{font-size:.8rem;color:var(--muted)}
.gestor-card .tip{font-family:var(--mono);font-size:.56rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.gestor-card q{font-size:.86rem;line-height:1.5;display:block}
.measure{font-size:.86rem;color:var(--muted);margin-top:30px;text-align:center}

/* ---------- parede de logos ---------- */
.wall{max-width:1100px;margin:44px auto 44px}
.wall img{width:100%;height:auto;display:block}

.origin{max-width:62ch;margin:0 auto;text-align:center}
.origin p{color:var(--muted)}
.origin .q{font-family:var(--serif);font-size:clamp(1.3rem,2.4vw,1.85rem);
  line-height:1.3;color:var(--primary);margin-top:18px;font-weight:600}


/* ---------- conversão ---------- */
.convert{background:var(--secondary);border-radius:var(--r);
  padding:clamp(36px,4.6vw,72px);display:grid;grid-template-columns:.92fr 1.08fr;
  gap:clamp(32px,5vw,72px)}
.convert h2{max-width:20ch}
.convert .lead{margin-top:16px;color:#3F4550}
.form{background:#fff;border-radius:var(--r);padding:clamp(24px,2.6vw,32px);
  box-shadow:0 1px 3px rgb(0 0 0 / .06), 0 18px 44px -28px rgb(0 0 0 / .3)}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.field label{font-size:.8rem;font-weight:600}
.field label .opt{font-weight:500;color:var(--muted);font-size:.74rem}
.field input,.field textarea{font-family:var(--sans);font-size:.94rem;color:var(--fg);
  background:#fff;border:1px solid #D8D8E2;border-radius:var(--r-xs);padding:11px 13px;
  transition:border-color .16s ease,box-shadow .16s ease}
.field textarea{min-height:88px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:#6B6B78}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--primary);
  box-shadow:0 0 0 3px rgb(242 71 12 / .16)}
.field .help{font-size:.76rem;color:var(--muted)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form .btn{width:100%;margin-top:6px}
.form .legal{font-size:.76rem;color:var(--muted);margin-top:12px;text-align:center}
.direct{margin-top:34px;padding-top:26px;border-top:1px solid #DDE1E8}
.direct .kicker{color:#5A6070}
.direct ul{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-direction:column;gap:10px}
.direct a{display:inline-flex;align-items:center;gap:10px;text-decoration:none;
  font-size:.94rem;font-weight:500;color:var(--fg)}
.direct a:hover{color:var(--primary)}
.direct svg{width:17px;height:17px;stroke:var(--muted);fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- rodapé ---------- */
footer{border-top:1px solid var(--border);padding:44px 0 56px;margin-top:24px}
.foot{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap}
.foot nav{display:flex;gap:26px;flex-wrap:wrap}
.foot a{font-size:.88rem;color:var(--muted);text-decoration:none}
.foot a:hover{color:var(--fg)}
.foot .copy{font-size:.82rem;color:var(--muted);width:100%;margin-top:26px}

/* ---------- responsivo ---------- */
@media (max-width:1000px){
  .hero-grid{grid-template-columns:1fr;gap:48px}
  .stage{min-height:0;display:flex;flex-direction:column;gap:26px;margin-top:38px}
  .stage .desk{position:static;width:100%;order:2;margin:0}
  .stage .device{order:1;margin:0 auto}
  .pains{grid-template-columns:1fr;gap:36px}
  .fork{grid-template-columns:1fr}
  .pains::before{display:none}
  .pain{padding:0}
  .pain .node,.choice .node{margin-bottom:16px}
  .week{grid-template-columns:1fr}
  .day::after{right:auto;left:26px;top:auto;bottom:-13px;transform:rotate(135deg)}
  .phases{grid-template-columns:1fr 1fr}
  .slide,.slide.flip{grid-template-columns:1fr;gap:28px}
  .slide.flip .copy{order:0}
  .band{grid-template-columns:1fr}
  .convert{grid-template-columns:1fr}
}
@media (max-width:640px){
  .shell{padding:0 20px}
  .stats{grid-template-columns:1fr 1fr}
  .rubric{grid-template-columns:1fr}
  .phases{grid-template-columns:1fr}
  .wall{overflow-x:auto;padding-bottom:8px}
  .wall img{min-width:580px}
  .duo{grid-template-columns:1fr}
  .stage .desk{margin-left:0}
  .hero .actions .btn{width:100%}
  .kicker{font-size:.62rem;letter-spacing:.12em}
}