/* ============================================================
   Dom Pagamentos — site institucional
   Design language: BRAND system (paper canvas + midnight/forest dark bands,
   lime signal). Type: Articulat CF (self-hosted). Utilities: Tailwind CDN.
   Taste-skill dials: VARIANCE 7 / MOTION 5 / DENSITY 4.
   Radius: one soft system (14-24px), pills for interactive.
   ============================================================ */

@font-face { font-family:"Articulat CF"; src:url("../fonts/ArticulatCF-Light.otf") format("opentype");    font-weight:300; font-display:swap; }
@font-face { font-family:"Articulat CF"; src:url("../fonts/ArticulatCF-Regular.otf") format("opentype");  font-weight:400; font-display:swap; }
@font-face { font-family:"Articulat CF"; src:url("../fonts/ArticulatCF-Medium.otf") format("opentype");   font-weight:500; font-display:swap; }
@font-face { font-family:"Articulat CF"; src:url("../fonts/ArticulatCF-DemiBold.otf") format("opentype"); font-weight:600; font-display:swap; }
@font-face { font-family:"Articulat CF"; src:url("../fonts/ArticulatCF-Bold.otf") format("opentype");     font-weight:700; font-display:swap; }
@font-face { font-family:"Articulat CF"; src:url("../fonts/ArticulatCF-ExtraBold.otf") format("opentype");font-weight:800; font-display:swap; }
@font-face { font-family:"Articulat CF"; src:url("../fonts/ArticulatCF-Heavy.otf") format("opentype");    font-weight:900; font-display:swap; }

html { scroll-behavior: smooth; }
body { font-family:"Articulat CF", system-ui, -apple-system, "Segoe UI", sans-serif; background:#FFFFFF; color:#091E16; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
::selection { background:#87C12D; color:#091E16; }

/* Motion (dial 5): reveal on scroll via IntersectionObserver, hover lifts. No scroll listeners. */
.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity:1; transform:none; }
.reveal-d1 { transition-delay:.08s; } .reveal-d2 { transition-delay:.16s; } .reveal-d3 { transition-delay:.24s; }
.lift { transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s cubic-bezier(.16,1,.3,1), border-color .35s; }
.lift:hover { transform:translateY(-4px); }
.tap:active { transform:translateY(1px); }

/* Client marquee */
.marquee { display:flex; gap:3.5rem; width:max-content; animation:scroll-x 34s linear infinite; }
@keyframes scroll-x { to { transform:translateX(-50%); } }

/* Range slider (receita calculator) */
input[type=range]{ -webkit-appearance:none; appearance:none; height:6px; border-radius:999px; background:linear-gradient(90deg,#87C12D var(--pct,40%), rgba(9,30,22,.12) var(--pct,40%)); outline:none; }
input[type=range]::-webkit-slider-thumb{ -webkit-appearance:none; height:26px; width:26px; border-radius:999px; background:#091E16; border:4px solid #87C12D; cursor:pointer; box-shadow:0 6px 18px -6px rgba(9,30,22,.6); }
input[type=range]::-moz-range-thumb{ height:22px; width:22px; border-radius:999px; background:#091E16; border:4px solid #87C12D; cursor:pointer; }

/* Nav: transparent over dark hero, solid paper on scroll */
/* O fundo faz transicao; a cor do texto troca na hora, senao ele
   atravessa tons de cinza ilegiveis enquanto a barra clareia. */
#nav { color:#fff; transition:background .3s, box-shadow .3s; }
#nav.nav-solid { background:#FFFFFF; color:#091E16; box-shadow:0 1px 0 rgba(9,30,22,.06); }
/* Sobre o branco os itens vao a opacidade cheia: 80% vira cinza lavado. */
#nav.nav-solid nav > div > button,
#nav.nav-solid nav > a { opacity:1; }

/* Horizontal scroll row (hidden scrollbar) */
.hscroll { scrollbar-width:none; -ms-overflow-style:none; }
.hscroll::-webkit-scrollbar { display:none; }

/* Mobile menu */
.mobmenu { display:none; }
.mobmenu.open { display:block; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity:1 !important; transform:none !important; transition:none; }
  .marquee { animation:none; }
  html { scroll-behavior:auto; }
}


/* ══ Depoimentos - carrossel spotlight à esquerda ══ */
#depoimentos{overflow:hidden}
.depo-stage{position:relative;min-height:500px}
.depo-panel{position:absolute;top:50%;transform:translateY(-50%);left:calc((100% - min(1240px, 100%)) / 2 + 20px);background:#091E16;border-radius:20px;padding:24px 44px 24px 28px;width:268px;height:180px;display:flex;flex-direction:column;justify-content:center;z-index:5;box-shadow:0 26px 54px -30px rgba(9,30,22,.55)}
.depo-panel-brand{display:block;height:34px;max-width:150px;object-fit:contain;object-position:left center;margin-bottom:18px}
.depo-panel-meta b{display:block;font-size:21px;font-weight:800;color:#fff;letter-spacing:-.02em;line-height:1.15}
.depo-panel-meta span{display:block;font-size:14.5px;font-weight:600;color:rgba(255,255,255,.72);margin-top:8px}
.depo-panel-meta i{display:block;font-size:13.5px;color:rgba(255,255,255,.5);font-style:normal;margin-top:5px}
.depo-viewport{position:relative;width:100%;overflow:visible}
.depo-track{display:flex;align-items:center;gap:26px;position:relative;left:0;transition:left .55s cubic-bezier(.22,1,.36,1);will-change:left}
.depo-slide{--sw:281px;--sh:500px;flex:0 0 var(--sw);width:var(--sw);height:var(--sh);position:relative;z-index:1;border-radius:22px;overflow:hidden;background:#091E16;cursor:pointer;opacity:.32;transform:scale(.8);transition:opacity .5s ease,transform .55s cubic-bezier(.22,1,.36,1),box-shadow .5s ease;box-shadow:0 14px 34px -22px rgba(9,30,22,.5)}
.depo-slide.is-active{opacity:1;transform:scale(1);cursor:default;z-index:10;box-shadow:0 36px 72px -32px rgba(9,30,22,.6)}
.depo-video{position:absolute;inset:0}
.depo-vid{position:absolute;inset:0;height:100%;width:100%;object-fit:cover;background:#091E16;display:block}
.ico-pause{display:none}
.depo-slide.is-playing .ico-play{display:none}
.depo-slide.is-playing .ico-pause{display:block}
.depo-slide.is-active.is-playing .depo-play{opacity:0}
.depo-slide.is-active.is-playing:hover .depo-play{opacity:1}
.depo-bar{position:absolute;left:0;right:0;bottom:0;height:6px;background:rgba(255,255,255,.5);z-index:4;opacity:0;transition:opacity .3s ease}
.depo-slide.is-active .depo-bar{opacity:1}
.depo-bar i{display:block;height:100%;width:0;background:#0D634D;transition:width .12s linear}
.depo-video::after{content:"";position:absolute;left:0;right:0;bottom:0;height:56px;background:linear-gradient(to top,rgba(9,30,22,.45),transparent);z-index:3;pointer-events:none}
.depo-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);height:58px;width:58px;border-radius:50%;border:none;background:rgba(255,255,255,.94);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3;opacity:0;pointer-events:none;transition:opacity .4s,transform .2s;box-shadow:0 10px 30px -8px rgba(0,0,0,.5)}
.depo-slide.is-active .depo-play{opacity:1;pointer-events:auto}
.depo-play:hover{transform:translate(-50%,-50%) scale(1.06)}
.depo-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:38px}
.depo-arrow{height:46px;width:46px;border-radius:50%;border:1px solid rgba(9,30,22,.15);background:#fff;color:#091E16;font-size:22px;line-height:0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s}
.depo-arrow:hover{border-color:rgba(9,30,22,.35);background:#F6F8F3}
.depo-dots{display:flex;gap:8px;align-items:center}
.depo-dot{height:8px;width:8px;border-radius:999px;border:none;background:rgba(9,30,22,.2);cursor:pointer;padding:0;transition:width .3s,background .3s}
.depo-dot.is-active{width:22px;background:#0D634D}
@media(max-width:820px){
  .depo-stage{min-height:0;display:flex;flex-direction:column-reverse;align-items:center;gap:16px}
  .depo-panel{position:static;transform:none;left:auto;width:auto;height:auto;padding:16px 22px;display:flex;align-items:center;justify-content:flex-start;gap:14px;flex-direction:row}
  .depo-panel-brand{margin-bottom:0;height:30px}
  .depo-viewport{-webkit-mask-image:none;mask-image:none}
  .depo-slide{--sw:76vw;--sh:auto;aspect-ratio:9/16}
}
@media(prefers-reduced-motion:reduce){.depo-track,.depo-slide{transition-duration:.001s}}
