:root{
  --mf-green:#176b2a;
  --mf-whatsapp:#117a3e;
  --mf-paper:#f4ecd8;
  --mf-ink:#0e1014;
  --mf-yellow:#ffc72c;
  --mf-blue:#143b9c;
  --mf-orange:#eb5424;
}

.mf-hero{position:relative;overflow:hidden;background:var(--mf-paper);color:var(--mf-ink);padding:clamp(68px,9vw,122px) 0 clamp(88px,11vw,148px);isolation:isolate}
.mf-hero::before{content:"5";position:absolute;right:-.03em;bottom:-.34em;z-index:-1;font:900 clamp(340px,48vw,690px)/1 'Barlow',sans-serif;letter-spacing:-.13em;color:transparent;-webkit-text-stroke:1px rgba(14,16,20,.09)}
.mf-hero::after{content:"";position:absolute;width:min(430px,40vw);aspect-ratio:1;right:-7%;top:3%;z-index:-2;border-radius:50%;background:color-mix(in oklch,var(--mf-orange) 19%,transparent)}
.mf-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(310px,.66fr);gap:clamp(46px,7vw,96px);align-items:center}
.mf-hero .eyebrow{color:var(--mf-blue)}
.mf-hero .eyebrow::before{background:var(--mf-orange)}
.mf-hero h1{max-width:10ch;font-size:clamp(60px,7.8vw,116px);line-height:.9;margin-top:30px;overflow-wrap:normal;word-break:normal}
.mf-hero h1 em{display:block;color:var(--verde-escuro);font-family:'Barlow',sans-serif;font-weight:500}
.mf-dek{max-width:58ch;margin-top:34px;font-size:clamp(18px,2vw,23px);line-height:1.55;color:var(--tinta-2)}
.mf-start{margin-top:34px}

.mf-signal{position:relative;min-height:390px;padding:clamp(28px,4vw,42px);border:2px solid var(--mf-ink);background:var(--mf-yellow);display:flex;flex-direction:column;justify-content:space-between;box-shadow:14px 14px 0 var(--mf-blue)}
.mf-signal-head{display:flex;justify-content:space-between;gap:20px;align-items:center;font:800 10px/1.2 'Azeret Mono',monospace;text-transform:uppercase;letter-spacing:.14em;color:rgba(14,16,20,.68)}
.mf-signal-head strong{font-size:14px;color:var(--mf-blue)}
.mf-route{display:grid;grid-template-columns:repeat(6,1fr);align-items:center;margin:70px 0 60px;position:relative}
.mf-route::before{content:"";position:absolute;left:8%;right:8%;height:2px;background:linear-gradient(90deg,var(--verde-escuro),var(--mf-blue));transform-origin:left;animation:routeGrow 1.2s cubic-bezier(.16,1,.3,1) both}
.mf-route span{position:relative;z-index:1;display:grid;place-items:center;width:13px;height:13px;justify-self:center;border-radius:50%;background:var(--mf-paper);box-shadow:0 0 0 5px var(--mf-ink)}
.mf-route .is-origin,.mf-route .is-destination{width:56px;height:56px;background:var(--verde-escuro);color:var(--mf-paper);font:900 10px/1 'Azeret Mono',monospace;text-transform:uppercase;letter-spacing:.04em;box-shadow:0 0 0 7px var(--mf-yellow),0 0 0 9px var(--mf-ink)}
.mf-route .is-destination{background:var(--mf-paper);color:var(--mf-ink);font-size:24px;box-shadow:0 0 0 7px var(--mf-yellow),0 0 0 9px var(--mf-ink),0 0 0 22px rgba(14,16,20,.055),0 0 0 35px rgba(14,16,20,.03)}
.mf-signal p{max-width:29ch;font-size:18px;line-height:1.55;color:rgba(14,16,20,.76)}
.mf-signal p strong{display:block;color:var(--mf-ink);font-size:24px}
@keyframes routeGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.mf-compose-section{padding:clamp(76px,10vw,132px) 0;background:var(--mf-paper)}
.mf-compose-grid{display:grid;grid-template-columns:minmax(280px,.72fr) minmax(440px,1.28fr);gap:clamp(44px,7vw,94px);align-items:start}
.mf-compose-intro{position:relative}
.mf-compose-intro h2{font-size:clamp(42px,5.4vw,74px);max-width:10ch}
.mf-compose-intro>p{margin-top:24px;max-width:45ch;font-size:18px;color:var(--tinta-2)}
.mf-steps{list-style:none;margin-top:42px;border-top:2px solid var(--mf-ink)}
.mf-steps li{display:grid;grid-template-columns:42px 1fr;gap:16px;padding:20px 0;border-bottom:1px solid rgba(14,16,20,.18)}
.mf-steps li>span{font:900 12px/1 'Azeret Mono',monospace;color:var(--mf-orange)}
.mf-steps strong{display:block;font-size:17px}
.mf-steps p{margin-top:3px;color:var(--tinta-2);font-size:14px;line-height:1.5}

.mf-composer{background:var(--azul-escuro);color:var(--mf-paper);padding:clamp(20px,3vw,32px);border-top:7px solid var(--mf-yellow)}
.mf-composer-bar{display:flex;justify-content:space-between;gap:18px;padding:0 2px 16px;font:800 9px/1.4 'Azeret Mono',monospace;text-transform:uppercase;letter-spacing:.14em;color:rgba(244,236,216,.6)}
.mf-composer textarea{display:block;width:100%;min-height:460px;resize:vertical;border:1px solid rgba(244,236,216,.3);border-radius:0;background:rgba(14,16,20,.3);color:var(--mf-paper);padding:clamp(20px,3vw,28px);font:500 17px/1.58 'Barlow',sans-serif;caret-color:var(--mf-yellow)}
.mf-composer textarea:focus{border-color:var(--mf-yellow);outline:3px solid rgba(255,199,44,.28);outline-offset:3px}
.mf-composer-actions{display:grid;grid-template-columns:1fr auto;gap:12px;margin-top:18px}
.mf-whatsapp-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:58px;padding:15px 22px;background:var(--mf-whatsapp);color:#fff;text-decoration:none;font:900 12px/1 'Azeret Mono',monospace;letter-spacing:.06em;text-transform:uppercase;transition:transform .2s cubic-bezier(.16,1,.3,1),background .2s ease}
.mf-whatsapp-button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mf-whatsapp-button:hover{background:#176b2a;transform:translateY(-2px)}
.mf-reset{min-height:58px;border:1px solid rgba(244,236,216,.32);background:transparent;color:var(--mf-paper);padding:13px 18px;font:800 10px/1 'Azeret Mono',monospace;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.mf-reset:hover{border-color:var(--mf-yellow);color:var(--mf-yellow)}
.mf-status{min-height:20px;margin-top:16px;font:700 10px/1.5 'Azeret Mono',monospace;letter-spacing:.08em;color:rgba(244,236,216,.62)}
.mf-status.is-error{color:#ffb1a0}

.mf-principles{padding:clamp(76px,10vw,128px) 0;background:var(--papel-2)}
.mf-principles h2{max-width:12ch}
.mf-principles-grid{display:grid;grid-template-columns:1fr;margin-top:52px;border-top:2px solid var(--mf-ink)}
.mf-principles-grid article{display:grid;grid-template-columns:72px minmax(240px,.72fr) minmax(280px,1fr);gap:clamp(20px,4vw,56px);align-items:start;padding:clamp(26px,3vw,38px) 0;border-bottom:1px solid rgba(14,16,20,.22);background:transparent}
.mf-principles-grid article:nth-child(2),.mf-principles-grid article:nth-child(3){background:transparent;color:var(--mf-ink)}
.mf-principles-grid span{font:900 11px/1 'Azeret Mono',monospace;letter-spacing:.14em;color:#a83212}
.mf-principles-grid article:nth-child(2) span{color:var(--mf-ink)}
.mf-principles-grid article:nth-child(3) span{color:#a83212}
.mf-principles-grid h3{margin:0;font-size:clamp(25px,2.5vw,34px)}
.mf-principles-grid p{margin:0;max-width:48ch;line-height:1.65;color:var(--tinta-2)}

@media(max-width:900px){
  .mf-hero-grid,.mf-compose-grid{grid-template-columns:1fr}
  .mf-signal{min-height:350px;max-width:620px}
  .mf-compose-intro h2{max-width:13ch}
}

@media(max-width:720px){
  .mf-hero{padding-top:72px}
  .mf-hero h1{max-width:9ch;font-size:clamp(48px,14vw,66px)}
  .mf-signal{min-height:310px;box-shadow:7px 7px 0 var(--mf-blue)}
  .mf-route{margin:58px 0 44px}
  .mf-route .is-origin,.mf-route .is-destination{width:48px;height:48px}
  .mf-compose-grid{gap:38px}
  .mf-composer{margin-inline:-2px}
  .mf-composer textarea{min-height:440px;font-size:16px}
  .mf-composer-actions{grid-template-columns:1fr}
  .mf-principles-grid article{grid-template-columns:44px 1fr;gap:12px 14px}
  .mf-principles-grid article p{grid-column:2}
}

@media(prefers-reduced-motion:reduce){.mf-route::before{animation:none}.mf-whatsapp-button{transition:none}}