/* RISE Contábil — site institucional
   Tema claro com quadriculado; fundo escuro só onde o logo aparece (.dark-zone).
   Sem estilo inline: a CSP do site não permite (style-src 'self'). */

:root{
  --bg:#F4F6FA;--bg2:#EBEFF6;--surf:#FFFFFF;--surf2:#F1F4F9;--line:#DCE3EE;
  --text:#0A1122;--text2:#2E3A50;--muted:#4E5B72;--dim:#66728A;
  --acc:#FF6A2B;--acc2:#FFC24B;--accText:#C2410C;--ok:#1FB57A;
  --grid:rgba(10,17,34,.055);
}
.dark-zone{
  --bg:#060A14;--bg2:#0A1020;--surf:#0E1628;--surf2:#131D33;--line:#1D2944;
  --text:#F2F5FA;--text2:#C5CEDC;--muted:#9DAAC0;--dim:#6F7C94;--accText:#FFC24B;--ok:#3DDC97;
  --grid:rgba(120,150,200,.07);
  background-color:var(--bg);color:var(--text);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background-color:var(--bg);color:var(--text);font-family:Manrope,system-ui,sans-serif;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
body,.dark-zone,.alt{background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:40px 40px}
.alt{background-color:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
a{color:inherit;text-decoration:none}
svg{display:block}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px;top:8px;z-index:50;background:var(--acc);color:#140800;padding:10px 16px;border-radius:8px;font-weight:700}
.skip:focus{left:16px}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

.eyebrow{font-family:'JetBrains Mono',monospace;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--accText)}
h1,h2,h3{font-family:Sora,sans-serif;margin:0;letter-spacing:-.02em}
h2{font-size:clamp(30px,4vw,44px);line-height:1.12}
.lead{color:var(--muted);font-size:19px;max-width:660px;margin:0}
section{padding:96px 0}
.sec-head{display:flex;flex-direction:column;gap:14px;margin-bottom:48px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:12px;font-weight:700;font-size:16px;border:1px solid transparent;cursor:pointer;font-family:inherit;transition:transform .15s,background .15s,border-color .15s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--acc);color:#140800}
.btn-primary:hover{background:#ff7d45}
.btn-ghost{background:var(--surf);border-color:var(--line);color:var(--text)}
.btn-ghost:hover{border-color:var(--muted)}
.btn[aria-disabled="true"]{opacity:.55;pointer-events:none}
.tag{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--surf);font-size:13px;color:var(--muted)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ok);display:inline-block;flex-shrink:0}
.dot.wait{background:var(--acc2)}
.dot.soon{background:var(--dim)}

/* logo */
.logo{display:flex;align-items:flex-end;gap:12px}
.logo svg{height:66px;width:auto}
.logo .sub{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted);padding-bottom:4px}
.logo-lg svg{height:128px}

/* nav */
header.nav{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line)}
.nav .wrap{height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:28px;font-size:15px;color:var(--muted)}
.nav ul a:hover{color:var(--text)}
.nav .right{display:flex;gap:12px;align-items:center}
.nav .btn{min-height:44px;padding:0 18px;font-size:15px}
.menu-btn{display:none;width:44px;height:44px;border-radius:10px;border:1px solid var(--line);background:var(--surf);color:var(--text);cursor:pointer;align-items:center;justify-content:center}
.mobile-menu{display:none;border-top:1px solid var(--line);padding:8px 24px 20px}
.mobile-menu a{display:block;padding:12px 0;border-bottom:1px solid var(--line);color:var(--muted)}
.mobile-menu.open{display:block}
@media (max-width:980px){.nav ul,.nav .login{display:none}.menu-btn{display:inline-flex}}
@media (max-width:640px){.nav .wrap{gap:10px}.nav .btn-primary{padding:0 12px;font-size:14px;min-height:42px}.logo .sub{display:none}.logo svg{height:56px}}

/* hero */
.hero{padding:88px 0 96px}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
@media (max-width:980px){.hero .wrap{grid-template-columns:1fr}}
@media (max-width:640px){.hero{padding-top:48px}}
.hero h1{font-size:clamp(40px,6vw,68px);line-height:1.04;margin:22px 0}
.hero h1 em{font-style:normal;background:linear-gradient(90deg,#F2541B,#FF8A00);-webkit-background-clip:text;background-clip:text;color:transparent}
.ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.trust{margin-top:30px;display:flex;gap:18px;flex-wrap:wrap;color:var(--dim);font-size:14px}
.trust span{display:inline-flex;gap:8px;align-items:center}
.trust svg{stroke:var(--ok)}
.hero-visual{position:relative}
.trace{position:absolute;right:-40px;top:-70px;pointer-events:none}
@media (max-width:640px){.trace{display:none}}
.panel{position:relative;background:var(--surf);border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:0 30px 70px rgba(10,17,34,.12)}
.panel-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.panel-top b{font-family:Sora;font-size:16px}
.panel-top .tag{padding:4px 10px}
.row{display:flex;align-items:center;gap:14px;padding:14px;border-radius:14px;background:var(--bg2);border:1px solid var(--line);margin-bottom:10px}
.ico{width:44px;height:44px;border-radius:12px;background:var(--acc);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ico svg{stroke:#140800}
.ico.warn{background:var(--acc2)}
.row .t{flex:1;display:flex;flex-direction:column;line-height:1.35}
.row .t b{font-family:Sora;font-size:15px}
.row .t small{color:var(--muted);font-size:13px}
.chart{padding:16px;border-radius:14px;background:var(--bg2);border:1px solid var(--line)}
.chart small{color:var(--muted);font-size:13px}
.bars{height:110px;display:flex;align-items:flex-end;gap:10px;margin-top:10px}
.bars i{flex:1;border-radius:6px 6px 2px 2px;background:linear-gradient(0deg,var(--acc),var(--acc2))}
.bars i:nth-child(1){height:30%;opacity:.4}.bars i:nth-child(2){height:40%;opacity:.5}.bars i:nth-child(3){height:38%;opacity:.55}
.bars i:nth-child(4){height:55%;opacity:.65}.bars i:nth-child(5){height:66%;opacity:.75}.bars i:nth-child(6){height:82%;opacity:.88}.bars i:nth-child(7){height:100%}

/* sistemas */
.systems{padding:38px 0}
.systems .wrap{display:flex;align-items:center;gap:36px;flex-wrap:wrap;justify-content:space-between}
.systems p{margin:0;color:var(--muted);font-size:14px;max-width:280px}
.systems ul{list-style:none;margin:0;padding:0;display:flex;gap:28px;flex-wrap:wrap;font-family:Sora;font-weight:700;font-size:18px;color:var(--text2)}

/* como funciona */
.circuit{height:2px;background:linear-gradient(90deg,var(--acc),var(--acc2));margin:0 0 28px;border-radius:2px;position:relative}
.circuit::before,.circuit::after{content:"";position:absolute;top:-4px;width:10px;height:10px;border-radius:50%;background:var(--acc)}
.circuit::before{left:0}.circuit::after{right:0;background:var(--acc2)}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
@media (max-width:900px){.steps{grid-template-columns:1fr}}
.step{background:var(--surf);border:1px solid var(--line);border-radius:20px;padding:28px;position:relative}
.step .n{font-family:'JetBrains Mono',monospace;color:var(--accText);font-size:13px;letter-spacing:.2em}
.step h3{font-size:22px;margin:12px 0 8px}
.step p{margin:0;color:var(--muted)}
.step .node{position:absolute;top:32px;right:28px;width:14px;height:14px;border-radius:50%;background:var(--acc2);box-shadow:0 0 0 6px rgba(255,194,75,.14),0 0 18px rgba(255,194,75,.6)}
.note{margin-top:24px;display:flex;gap:14px;align-items:flex-start;padding:18px 22px;border:1px dashed var(--line);border-radius:16px;background:var(--surf);color:var(--muted);font-size:15.5px}
.note b{color:var(--text)}
.note a{color:var(--accText);font-weight:700;white-space:nowrap}
.note a:hover{text-decoration:underline}

/* módulos */
.mods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:980px){.mods{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.mods{grid-template-columns:1fr}}
.mod{background:var(--surf);border:1px solid var(--line);border-radius:20px;padding:26px;display:flex;flex-direction:column;gap:14px;transition:border-color .2s,transform .2s}
.mod:hover{border-color:#F3B59A;transform:translateY(-2px)}
.mod h3{font-size:22px}
.mod h3 span,.mod .h3-like span{font-weight:600;color:var(--muted)}
.mod .h3-like{font-size:22px}
.mod p{margin:0;color:var(--muted);font-size:15.5px}
.mod ul{margin:0;padding-left:18px;color:var(--text2);font-size:14.5px;flex:1}
.mod li+li{margin-top:4px}
.mod .foot{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px;color:var(--muted);flex-wrap:wrap}
.mod .foot span{display:inline-flex;gap:6px;align-items:center}
.mod .foot a{color:var(--accText);font-weight:700}
.mod.soon{background:var(--surf2)}
.mod.soon .ico{background:var(--surf);border:1px solid var(--line)}
.mod.soon .ico svg{stroke:var(--muted)}
.mod .spacer{flex:1}
.mod.cta-tile{justify-content:space-between;border-color:var(--line)}
.mod.cta-tile h3{font-size:24px;line-height:1.2}
.mod.cta-tile p{color:var(--muted)}
.mod.cta-tile:hover{border-color:var(--acc)}

/* por que */
.why{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@media (max-width:860px){.why{grid-template-columns:1fr}}
.card{background:var(--surf);border:1px solid var(--line);border-radius:20px;padding:28px}
.card h3{font-size:20px;margin:14px 0 8px}
.card p{margin:0;color:var(--muted)}
.compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--line);border-radius:20px;overflow:hidden;margin-top:36px}
.compare>div{padding:26px}
.compare>div:first-child{background:var(--bg2);color:var(--muted)}
.compare>div:last-child{background:linear-gradient(180deg,rgba(255,106,43,.10),rgba(255,106,43,0)),var(--surf);border-left:1px solid var(--line)}
.compare h3{margin:0 0 12px;font-size:17px;color:var(--text)}
.compare ul{margin:0;padding-left:18px}
@media (max-width:700px){.compare{grid-template-columns:1fr}.compare>div:last-child{border-left:0;border-top:1px solid var(--line)}}

/* planos */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
@media (max-width:980px){.plans{grid-template-columns:1fr}}
.plan{background:var(--surf);border:1px solid var(--line);border-radius:22px;padding:30px;display:flex;flex-direction:column;gap:16px}
.plan.hl{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc),0 30px 70px rgba(255,106,43,.12)}
.plan .price{font-family:Sora;font-size:26px;font-weight:800}
.plan .price small{display:block;font-family:Manrope;font-size:14px;color:var(--muted);font-weight:500}
.plan ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;color:var(--text2);font-size:15px;flex:1}
.plan li{display:flex;gap:10px}
.plan li::before{content:"";width:18px;height:18px;flex-shrink:0;margin-top:3px;border-radius:50%;background:rgba(31,181,122,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231FB57A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E") center/12px no-repeat}
.badge-pop{align-self:flex-start;font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;background:var(--acc);color:#140800;padding:5px 10px;border-radius:999px;font-weight:500}

/* faq */
.faq{max-width:860px}
details{border-bottom:1px solid var(--line);padding:20px 0}
summary{cursor:pointer;font-family:Sora;font-weight:700;font-size:19px;list-style:none;display:flex;justify-content:space-between;gap:20px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--accText);font-family:'JetBrains Mono',monospace;font-size:22px;line-height:1}
details[open] summary::after{content:"–"}
details p{color:var(--muted);margin:12px 0 0}

/* demonstração */
.demo{padding-top:0}
.cta{border-radius:28px;border:1px solid var(--line);padding:56px;display:grid;grid-template-columns:1fr 1fr;gap:48px}
@media (max-width:900px){.cta{grid-template-columns:1fr;padding:32px}}
.cta h2{margin:14px 0 16px}
.cta .lead{font-size:17px}
.cta .logo{margin-top:34px}
form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-content:start}
form .full{grid-column:1/-1}
@media (max-width:560px){form{grid-template-columns:1fr}}
label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}
input,select,textarea{min-height:50px;border-radius:12px;border:1px solid var(--line);background:var(--bg2);color:var(--text);padding:0 14px;font-family:inherit;font-size:16px}
textarea{padding:12px 14px;min-height:96px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--acc);outline-offset:1px}
.hp{position:absolute;left:-9999px}
.consent{font-size:13px;color:var(--dim);margin:0}
.consent a{text-decoration:underline}

/* entrar */
.page-head{padding-top:72px;padding-bottom:32px}
.page-head h1{font-size:clamp(34px,5vw,52px);line-height:1.08;margin:14px 0}
.access{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding-bottom:96px}
@media (max-width:980px){.access{grid-template-columns:1fr}}
.access .mod .btn{margin-top:8px}

/* texto corrido (privacidade) */
.prose{max-width:760px;padding:64px 24px 96px}
.prose h1{font-size:clamp(32px,4vw,44px);margin:12px 0 20px}
.prose h2{font-size:22px;margin:32px 0 8px}
.prose p,.prose li{color:var(--text2)}

footer{border-top:1px solid var(--line);padding:48px 0;color:var(--muted);font-size:14px}
footer .wrap{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;align-items:flex-start}
footer .brand{display:flex;flex-direction:column;gap:12px;max-width:340px}
footer .brand .logo svg{height:60px}
footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
footer li.h{color:var(--text);font-weight:700}
footer a:hover{color:var(--text)}
footer .by{color:var(--text2)}
footer .by b{color:var(--text)}
