/* ============================================================
   Wooneya Editora — Design System v2 (moderno / futurista)
   Paleta da marca: azul #1F6398 · laranja #F09E2E · verde #3FA34D
   ============================================================ */
:root{
  --verde:#2074A9;            /* azul Wooneya (do logótipo) */
  --verde2:#185A85;
  --navy:#123C5C;             /* azul profundo (derivado da marca) */
  --navy2:#0D2E48;
  --ouro:#F2A340;             /* laranja do símbolo */
  --ouro2:#F8C878;
  --acento:#2E9E44;           /* verde do símbolo */
  --cinza:#F3F6FA;
  --borda:#E3EAF2;
  --texto:#15222E;
  --suave:#5C6C7A;
  --r:18px;
  --sombra:0 10px 30px rgba(12,42,68,.08);
  --sombra2:0 18px 44px rgba(12,42,68,.16);
  --grad:linear-gradient(135deg,#2074A9,#185A85);
  --grad-cta:linear-gradient(135deg,#F2A340,#E8842B);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,Arial,sans-serif;background:var(--cinza);color:var(--texto);font-size:15.5px;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5{font-family:'Sora','Inter',sans-serif;letter-spacing:-.01em}
a{color:var(--verde)} button{cursor:pointer;font-family:inherit}
::selection{background:var(--ouro2)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#B9C7D4;border-radius:8px}
::-webkit-scrollbar-track{background:transparent}

/* ---------- cabeçalho (vidro) ---------- */
header{position:sticky;top:0;z-index:40;background:rgba(24,90,133,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.1)}
.hcx{max-width:1180px;margin:auto;padding:0 18px;display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.logo{font-size:19px;font-weight:800;padding:14px 12px 14px 0;text-decoration:none;color:#fff;font-family:'Sora',sans-serif}
.logo span{color:var(--ouro2)}
.lgfull{height:40px;width:auto;display:block;background:#fff;border-radius:10px;padding:5px 12px;box-shadow:0 3px 10px rgba(0,0,0,.18)}
.lgtxt{color:var(--ouro2);font-family:'Sora',sans-serif;font-weight:800;font-size:18px;letter-spacing:.01em}
@media(max-width:760px){.lgfull{height:34px;padding:4px 9px}.lgtxt{font-size:15px}}
nav{display:flex;flex-wrap:wrap;gap:2px}
nav a{color:#B9CBDA;text-decoration:none;padding:8px 13px;margin:10px 0;font-size:13.5px;font-weight:600;border-radius:999px;transition:.2s}
nav a.on,nav a:hover{color:#fff;background:rgba(255,255,255,.12)}
.hdir{margin-left:auto;display:flex;align-items:center;gap:10px}
.hdir input{padding:9px 16px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.1);color:#fff;border-radius:999px;font-size:13px;width:170px;outline:none;transition:.25s}
.hdir input::placeholder{color:#9FB4C6}
.hdir input:focus{background:#fff;color:var(--texto);width:210px}
.bcar{background:var(--grad-cta);color:#fff;border:none;border-radius:999px;padding:9px 16px;font-size:13.5px;font-weight:700;text-decoration:none;box-shadow:0 6px 16px rgba(240,158,46,.35);transition:.2s}
.bcar:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(240,158,46,.45)}

/* ---------- estrutura ---------- */
main{max-width:1180px;margin:0 auto;padding:26px 18px 70px;min-height:60vh}

/* ---------- herói ---------- */
.hero{position:relative;overflow:hidden;background:radial-gradient(1100px 500px at 85% -10%,rgba(46,158,68,.28),transparent 60%),radial-gradient(900px 500px at -10% 110%,rgba(242,163,64,.25),transparent 55%),linear-gradient(135deg,#2074A9,#123C5C);color:#fff;border-radius:28px;padding:72px 46px;margin-bottom:44px;box-shadow:var(--sombra2)}
.hero::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(700px 380px at 30% 20%,#000 30%,transparent 75%);-webkit-mask-image:radial-gradient(700px 380px at 30% 20%,#000 30%,transparent 75%);pointer-events:none}
.hero>*{position:relative;z-index:1}
.hero .etiq{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:7px 16px;font-size:12.5px;font-weight:600;color:var(--ouro2);margin-bottom:20px}
.hero h1{font-size:clamp(30px,4.6vw,48px);max-width:640px;line-height:1.12;font-weight:800}
.hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--ouro2),var(--ouro));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{color:#C4D4E2;margin:18px 0 30px;max-width:560px;font-size:16.5px}
.hero .stats{display:flex;gap:34px;margin-top:38px;flex-wrap:wrap}
.hero .stats div b{display:block;font-size:24px;font-family:'Sora';color:#fff}
.hero .stats div span{font-size:12.5px;color:#9FB4C6}

/* ---------- botões ---------- */
.btn{display:inline-block;background:var(--grad-cta);color:#fff;border:none;border-radius:14px;padding:14px 26px;font-weight:700;font-size:14.5px;text-decoration:none;box-shadow:0 8px 20px rgba(240,158,46,.35);transition:.22s}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(240,158,46,.45)}
.btn.b2{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.35);box-shadow:none;backdrop-filter:blur(4px)}
.btn.b2:hover{background:rgba(255,255,255,.2)}
main .artigo .btn.b2,main .caixa-pag .btn.b2{background:#fff;color:var(--verde);border:1.5px solid var(--verde)}
.btn.mini{padding:8px 15px;font-size:12.5px;border-radius:10px}

/* ---------- títulos de secção ---------- */
h2.sec{color:var(--navy);font-size:26px;margin:52px 0 22px;border:none;padding:0;font-weight:800}
h2.sec::after{content:"";display:block;width:52px;height:4px;border-radius:4px;background:var(--grad-cta);margin-top:10px}

/* ---------- grelhas e cartões ---------- */
.grelha{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:20px}
.cartao{background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--borda);box-shadow:var(--sombra);text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
.cartao:hover{transform:translateY(-6px);box-shadow:var(--sombra2)}
.capa{height:250px;background:linear-gradient(160deg,#E8EFF6,#D7E3EE) center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:#8CA2B5;font-size:12px;transition:transform .45s}
.cartao:hover .capa{transform:scale(1.045)}
.capa.red{height:165px}
.capa.circ{height:210px;background-position:center top}
.fotop{background-position:center top !important}
.ci{padding:15px 16px 18px;flex:1;display:flex;flex-direction:column;background:#fff;position:relative;z-index:1}
.ci h3{font-size:15px;color:var(--navy);line-height:1.35;font-weight:700}
.ci .sub{color:var(--ouro);font-size:12px;font-weight:700;margin:5px 0 8px;text-transform:uppercase;letter-spacing:.04em}
.ci p{font-size:13px;color:var(--suave);line-height:1.5;flex:1}
.preco{margin-top:10px;font-weight:800;color:var(--verde);font-size:16px;font-family:'Sora'}
.btnver{margin-top:12px;display:inline-block;color:var(--verde);font-weight:700;font-size:13px;border:1.5px solid #CBDCEA;border-radius:10px;padding:8px 14px;transition:.2s;text-align:center}
.cartao:hover .btnver{background:var(--verde);color:#fff;border-color:var(--verde)}

/* ---------- faixa CTA ---------- */
.cta-band{position:relative;overflow:hidden;background:var(--grad);color:#fff;border-radius:24px;padding:46px 40px;margin:56px 0 10px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;box-shadow:var(--sombra2)}
.cta-band::after{content:"";position:absolute;right:-60px;top:-60px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(240,158,46,.35),transparent 70%)}
.cta-band h3{font-size:24px;font-weight:800;max-width:520px;line-height:1.25}
.cta-band p{color:#C4D4E2;margin-top:8px;font-size:14.5px;max-width:520px}
.cta-band .btn{flex-shrink:0;position:relative;z-index:1}

/* ---------- artigo / página de livro ---------- */
.artigo{background:#fff;border-radius:24px;padding:38px;max-width:860px;margin:auto;border:1px solid var(--borda);box-shadow:var(--sombra)}
.artigo h1{color:var(--navy);font-size:30px;margin-bottom:8px;font-weight:800;line-height:1.2}
.artigo .meta{color:var(--ouro);font-size:13px;font-weight:700;margin-bottom:18px;text-transform:uppercase;letter-spacing:.05em}
.artigo img.hero-img{width:100%;max-height:400px;object-fit:cover;border-radius:16px;margin-bottom:20px}
.artigo .corpo{line-height:1.75;font-size:15.5px;white-space:pre-wrap;color:#2A3A48}
.fl{display:flex;gap:30px;flex-wrap:wrap}
.fl .capa-g{width:230px;min-height:320px;background:linear-gradient(160deg,#E8EFF6,#D7E3EE) center/cover no-repeat;border-radius:16px;flex-shrink:0}
.capa-img{width:min(260px,100%);height:auto;border-radius:14px;box-shadow:0 20px 40px rgba(12,42,68,.25);align-self:flex-start;flex-shrink:0}
.det{flex:1;min-width:260px}
.det h1{color:var(--navy);font-size:28px;font-weight:800}
.det .aut{color:var(--ouro);font-weight:700;margin:8px 0 16px;text-transform:uppercase;font-size:13px;letter-spacing:.05em}
.det p{line-height:1.7;color:#2A3A48}
.specs{margin:16px 0;font-size:13.5px;color:var(--suave)}
.specs b{color:var(--texto)}

/* ---------- estados e formulários ---------- */
.vazio{text-align:center;color:var(--suave);padding:70px 20px;background:#fff;border-radius:var(--r);border:1px dashed var(--borda)}
input.f,textarea.f{width:100%;padding:13px 15px;border:1.5px solid var(--borda);border-radius:12px;margin-top:10px;font-size:14.5px;font-family:inherit;transition:.2s;outline:none;background:#fff}
input.f:focus,textarea.f:focus{border-color:var(--verde);box-shadow:0 0 0 4px rgba(31,99,152,.12)}
.caixa-pag{background:#fff;border-radius:20px;padding:26px;margin-top:20px;border:1px solid var(--borda);border-top:5px solid var(--ouro);box-shadow:var(--sombra)}
table.cart{width:100%;background:#fff;border-radius:16px;border-collapse:separate;border-spacing:0;overflow:hidden;box-shadow:var(--sombra)}
table.cart th{background:var(--grad);color:#fff;padding:13px;text-align:left;font-size:13px}
table.cart td{padding:12px 13px;border-bottom:1px solid var(--borda);font-size:14px}

/* ---------- notificações ---------- */
#toasts{position:fixed;right:18px;bottom:18px;z-index:99;display:flex;flex-direction:column;gap:10px;max-width:340px}
.tst{background:var(--navy);color:#fff;border-left:4px solid var(--ouro);padding:14px 16px;border-radius:14px;font-size:13.5px;box-shadow:var(--sombra2);animation:tin .3s}
@keyframes tin{from{opacity:0;transform:translateY(10px)}to{opacity:1}}

/* ---------- mapas e contactos ---------- */
.mapa{width:100%;height:200px;border:0;border-radius:12px;margin-top:12px}
.ct-link{display:flex;align-items:center;gap:8px;padding:8px 0;font-weight:700;color:var(--verde);text-decoration:none}
.ct-link:hover{color:var(--verde2)}

/* ---------- revelar ao rolar ---------- */
.rev{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}
.rev.on{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rev{opacity:1;transform:none;transition:none}}

/* ---------- rodapé ---------- */
footer{background:linear-gradient(180deg,var(--navy),var(--navy2));color:#B9CBDA;padding:52px 18px 30px;font-size:14px;margin-top:40px}
.fcx{max-width:1180px;margin:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:30px}
footer h4{color:#fff;margin-bottom:12px;font-size:15px}
footer a{color:var(--ouro2);text-decoration:none;display:block;padding:3px 0;transition:.15s}
footer a:hover{color:#fff}
.copy{text-align:center;margin-top:34px;border-top:1px solid rgba(255,255,255,.1);padding-top:20px;color:#7E93A6;font-size:12.5px}

@media(max-width:760px){
  .hero{padding:46px 26px;border-radius:20px}
  nav{order:3;width:100%;overflow-x:auto;flex-wrap:nowrap;padding-bottom:6px}
  .cta-band{padding:32px 24px}
}