/* CT Anderson Nunes — página de entrada (hub) */
:root{
  --ink:#0E0E0E;--ink-2:#171513;--cream:#F4EFE6;
  --rust:#C2531B;--rust-hi:#E0733A;--muted:#B9B0A2;
  --wa:#25D366;--wa-hi:#1FBF5B;--wa-ink:#07210F;
  --f-display:"Barlow Condensed","Arial Narrow",Impact,sans-serif;
  --f-body:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  --rowh:clamp(104px,21svh,280px);
  --gap:10px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--cream);font-family:var(--f-body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--rust-hi);outline-offset:3px;border-radius:3px}

.hub{min-height:100svh;display:grid;grid-template-rows:var(--rowh) 1fr var(--rowh)}

/* ——— Carrosséis ——— */
.mq{position:relative;overflow:hidden;height:var(--rowh);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%)}
.mq__track{display:flex;width:max-content;height:100%;animation:mq var(--dur,90s) linear infinite;will-change:transform}
.mq--rev .mq__track{animation-direction:reverse}
.mq__set{display:flex;gap:var(--gap);padding-right:var(--gap);height:100%}
.mq img{height:100%;width:auto;flex:none;border-radius:3px;background:var(--ink-2)}
@keyframes mq{to{transform:translateX(-50%)}}
.mq:hover .mq__track{animation-play-state:paused}

/* ——— Conteúdo central ——— */
.mid{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:clamp(14px,3svh,44px) 18px;gap:0}
.mid__logo{width:clamp(70px,11svh,120px);height:auto;margin-bottom:clamp(8px,1.6svh,16px)}
.eyebrow{display:inline-flex;align-items:center;gap:12px;font-family:var(--f-display);font-weight:600;font-size:clamp(13px,1.9svh,15px);letter-spacing:.22em;text-transform:uppercase;color:var(--rust-hi);margin:0 0 clamp(8px,1.6svh,14px)}
.eyebrow::before,.eyebrow::after{content:"";width:24px;height:2px;background:currentColor}
h1{font-family:var(--f-display);font-weight:700;text-transform:uppercase;letter-spacing:.012em;line-height:.95;margin:0 0 clamp(10px,1.8svh,18px);font-size:clamp(40px,7.4svh,88px)}
h1 em{font-style:normal;color:var(--rust-hi)}
.mid p.lead{margin:0 auto clamp(16px,3svh,30px);max-width:520px;color:rgba(244,239,230,.86);font-size:clamp(15px,2.2svh,19px)}

.cta{display:flex;flex-direction:column;gap:12px;width:100%;max-width:440px}
@media (min-width:760px){.cta{flex-direction:row;max-width:760px;justify-content:center}}
.btn{display:flex;align-items:center;justify-content:center;gap:12px;font-family:var(--f-display);font-weight:700;font-size:clamp(17px,2.4svh,20px);letter-spacing:.07em;text-transform:uppercase;text-decoration:none;line-height:1.1;text-align:left;padding:14px 24px;border-radius:4px;border:2px solid transparent;transition:transform .2s ease,background .2s ease,color .2s ease,border-color .2s ease;min-height:58px}
@media (min-width:760px){.btn{flex:1 1 0}}
.btn svg{width:26px;height:26px;flex:none}
.btn small{display:block;font-family:var(--f-body);font-weight:500;font-size:13px;letter-spacing:.01em;text-transform:none;opacity:.82;margin-top:2px}
.btn--wa{background:var(--wa);color:var(--wa-ink)}
.btn--wa:hover{background:var(--wa-hi);transform:translateY(-2px)}
.btn--site{background:var(--cream);color:var(--ink)}
.btn--site:hover{background:var(--rust);color:#fff;transform:translateY(-2px)}
.btn--site svg{width:22px;height:22px}

.credit{margin:clamp(14px,2.6svh,26px) 0 0;font-size:12px;color:var(--muted);letter-spacing:.02em;max-width:560px}

/* entrada suave */
.rise{opacity:0;transform:translateY(18px);animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:var(--d,0s)}
@keyframes rise{to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  .mq{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
  .mq__track{animation:none}
  .rise{animation:none;opacity:1;transform:none}
}
@media (max-height:560px) and (orientation:landscape){
  :root{--rowh:clamp(90px,22svh,150px)}
  .mid__logo{display:none}
}

/* celular: tudo numa tela só */
@media (max-width:700px){
  :root{--rowh:clamp(92px,17svh,170px);--gap:8px}
  .mid{padding:clamp(10px,2svh,24px) 16px}
  .mid__logo{width:clamp(54px,8.5svh,78px);margin-bottom:6px}
  .eyebrow{font-size:12px;letter-spacing:.14em;margin-bottom:8px}
  .eyebrow::before,.eyebrow::after{display:none}
  h1{font-size:clamp(34px,6.2svh,52px);margin-bottom:8px}
  .mid p.lead{font-size:14.5px;line-height:1.45;margin-bottom:14px}
  .cta{gap:10px}
  .btn{min-height:54px;padding:9px 16px;font-size:17px;gap:10px}
  .btn svg{width:24px;height:24px}
  .btn small{font-size:12px}
  .credit{font-size:11px;margin-top:10px;line-height:1.4}
}