/* Arkanum Games — sistema visual oficial (skill arkanum-games-design).
   Tinta quase-preta, dourado como acento do dia a dia, vinho reservado ao lacre
   e a ações de risco. Special Elite para display, Courier Prime para o resto. */
@import url('https://fonts.googleapis.com/css2?family=Special+Elite&family=Courier+Prime:ital,wght@0,400;0,700;1,400&display=swap');

:root{
  --gold-50:#f4ecd3; --gold-200:#e0c684; --gold-400:#c9a84f; --gold-500:#b6923d; --gold-700:#8a6f2c; --gold-900:#4d3c17;
  --wine-300:#a8434f; --wine-500:#7a1f2b; --wine-700:#551620; --wine-900:#2e0c12;
  --ink-000:#1a1610; --ink-050:#221c14; --ink-100:#2a231a; --ink-200:#332b1f; --ink-300:#443a29; --ink-900:#100d08;
  --cream-100:#efe6cd; --cream-300:#c9b48a; --cream-500:#a99873; --cream-700:#7d715a;
  --alert-400:#d97b6c; --alert-600:#b8503f; --success-400:#8a9a6b;

  --color-bg-canvas: linear-gradient(180deg,var(--ink-000) 0%,var(--ink-900) 100%);
  --color-surface:var(--ink-050); --color-surface-raised:var(--ink-100); --color-surface-sunken:var(--ink-900);
  --color-border-hairline:rgba(201,168,79,0.28); --color-border-strong:rgba(201,168,79,0.55); --color-border-wine:rgba(122,31,43,0.55);
  --color-accent:var(--gold-400); --color-accent-hover:var(--gold-200); --color-accent-active:var(--gold-700);
  --color-text-primary:var(--cream-300); --color-text-secondary:var(--cream-700);
  --color-text-on-accent:var(--ink-900); --color-text-on-wine:var(--cream-100);
  --color-danger:var(--alert-400); --color-success:var(--success-400); --color-focus-ring:rgba(201,168,79,0.65);

  --font-display:'Special Elite','Courier New',monospace;
  --font-mono:'Courier Prime','Courier New',monospace;
  --tracking-label:0.14em; --tracking-title:0.02em;
  --text-display-xl:clamp(40px,5vw,72px); --text-display-lg:clamp(30px,3.6vw,48px);
  --text-display-md:28px; --text-display-sm:22px;
  --text-body-lg:18px; --text-body-md:15px; --text-body-sm:13px; --text-label:12px;
  --leading-tight:1.15; --leading-title:1.3; --leading-body:1.72;

  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px; --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px;
  --radius-sm:2px; --radius-md:4px; --radius-lg:8px; --radius-round:999px;
  --container-max:1180px;

  --shadow-card:0 12px 32px rgba(0,0,0,0.55), 0 1px 0 rgba(201,168,79,0.06) inset;
  --shadow-raised:0 4px 14px rgba(0,0,0,0.45);
  --ease-standard:cubic-bezier(.4,0,.2,1); --duration-fast:120ms; --duration-base:200ms;
  --gradient-vignette:radial-gradient(ellipse at 50% 20%, rgba(201,168,79,0.07), transparent 60%);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--color-bg-canvas);
  background-attachment:fixed;
  color:var(--color-text-primary);
  font-family:var(--font-mono);
  line-height:var(--leading-body);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:var(--color-accent);text-decoration:none;}
a:hover{color:var(--color-accent-hover);}
h1,h2,h3{font-family:var(--font-display);font-weight:400;letter-spacing:var(--tracking-title);margin:0;}
.eyebrow, .tag, .k, .label{
  font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:var(--tracking-label);
  text-transform:uppercase;color:var(--color-accent);
}
.wrap{max-width:var(--container-max);margin:0 auto;padding-inline:20px;}

/* topbar / nav */
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  padding-block:var(--space-4);border-bottom:1px solid var(--color-border-hairline);
}
.brand{display:flex;align-items:center;gap:14px;}
.brandmark{width:40px;height:40px;flex:none;display:flex;align-items:center;justify-content:center;}
.brandmark img{
  width:100%;height:100%;object-fit:cover;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cdefs%3E%3Cfilter id='f'%3E%3CfeGaussianBlur stdDeviation='4'/%3E%3C/filter%3E%3C/defs%3E%3Crect x='5' y='5' width='30' height='30' rx='3' fill='white' filter='url(%23f)'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cdefs%3E%3Cfilter id='f'%3E%3CfeGaussianBlur stdDeviation='4'/%3E%3C/filter%3E%3C/defs%3E%3Crect x='5' y='5' width='30' height='30' rx='3' fill='white' filter='url(%23f)'/%3E%3C/svg%3E");
  mask-size:100% 100%;-webkit-mask-size:100% 100%;
  mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;
}
.brand b{font-family:var(--font-display);font-size:var(--text-body-md);letter-spacing:.08em;color:var(--cream-100);display:block;line-height:1.2;}
.brand span{font-size:10px;color:var(--color-text-secondary);letter-spacing:.12em;text-transform:uppercase;}

.nav{display:flex;align-items:center;gap:var(--space-6);flex-wrap:wrap;}
.nav a{
  font-size:var(--text-label);letter-spacing:var(--tracking-label);text-transform:uppercase;
  color:var(--color-text-secondary);border-bottom:none;
}
.nav a:hover{color:var(--color-accent);}

.langtoggle{display:flex;gap:2px;background:var(--color-surface);border:1px solid var(--color-border-hairline);border-radius:var(--radius-sm);padding:3px;}
.langtoggle button{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  border:none;background:transparent;color:var(--color-text-secondary);padding:6px 10px;border-radius:2px;cursor:pointer;
}
.langtoggle button.active{background:var(--gold-400);color:var(--color-text-on-accent);}

/* buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--font-mono);font-weight:700;text-transform:uppercase;letter-spacing:var(--tracking-label);
  font-size:var(--text-body-sm);padding:13px 26px;border-radius:var(--radius-sm);cursor:pointer;
  transition:filter var(--duration-base) var(--ease-standard), transform var(--duration-fast);
  background:linear-gradient(180deg,var(--gold-200),var(--gold-500));color:var(--color-text-on-accent);
  border:1px solid var(--gold-700);
}
.btn:hover{filter:brightness(1.18);}
.btn:active{transform:scale(.97);}
.btn:disabled{opacity:.4;cursor:not-allowed;filter:none;}
.btn.secondary{background:transparent;color:var(--color-accent);border:1px solid var(--color-border-strong);}
.btn.wine{background:linear-gradient(180deg,var(--wine-300),var(--wine-700));color:var(--color-text-on-wine);border:1px solid var(--wine-900);}

/* hero */
.hero{
  position:relative;padding-block:var(--space-9) var(--space-8);text-align:center;
  background:var(--gradient-vignette), var(--ink-000);
  border-bottom:1px solid var(--color-border-hairline);
  overflow:hidden;
}
.hero::before{
  content:'';position:absolute;inset:0;background:url('../assets/arkanum/poster-hero.webp') 12% 30%/cover no-repeat;
  opacity:.22;filter:saturate(.75) blur(1px);
}
.hero::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(16,13,8,.55) 0%, var(--ink-000) 82%), radial-gradient(ellipse at 50% 32%, transparent 0%, var(--ink-000) 72%);
}
.hero-inner{position:relative;z-index:1;max-width:760px;margin:0 auto;padding-inline:20px;}
.hero-seal-frame{width:150px;height:150px;margin:0 auto var(--space-6);}
.hero-seal-frame img{
  width:100%;height:100%;object-fit:cover;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cdefs%3E%3Cfilter id='f'%3E%3CfeGaussianBlur stdDeviation='14'/%3E%3C/filter%3E%3C/defs%3E%3Crect x='22' y='22' width='106' height='106' rx='8' fill='white' filter='url(%23f)'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cdefs%3E%3Cfilter id='f'%3E%3CfeGaussianBlur stdDeviation='14'/%3E%3C/filter%3E%3C/defs%3E%3Crect x='22' y='22' width='106' height='106' rx='8' fill='white' filter='url(%23f)'/%3E%3C/svg%3E");
  mask-size:100% 100%;-webkit-mask-size:100% 100%;
  mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;
}
.hero-tagline{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--color-text-secondary);margin:0 0 var(--space-6);}
h1.headline{font-size:var(--text-display-lg);line-height:var(--leading-tight);color:var(--cream-100);margin-bottom:var(--space-4);text-wrap:balance;}
.hero-sub{font-size:var(--text-body-md);color:var(--color-text-secondary);max-width:46ch;margin:0 auto var(--space-6);}

/* sections */
main{padding-block:var(--space-8);}
section{margin-bottom:var(--space-9);}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-6);flex-wrap:wrap;}
.section-head h2{font-size:var(--text-display-sm);color:var(--cream-100);}
.section-head .see-all{font-size:var(--text-label);letter-spacing:var(--tracking-label);text-transform:uppercase;}
.section-lede{color:var(--color-text-secondary);max-width:60ch;margin:-8px 0 var(--space-6);font-size:var(--text-body-md);}

/* grão sutil sobre superfícies escuras — papel/couro, não ruído de câmera */
.arkanum-texture{position:relative;}
.arkanum-texture::before{
  content:'';position:absolute;inset:0;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* filtro do catálogo */
.filter-chips{display:flex;gap:var(--space-3);flex-wrap:wrap;margin-bottom:var(--space-6);}
.chip{
  font-family:var(--font-mono);font-size:var(--text-body-sm);color:var(--color-text-secondary);
  background:transparent;border:1px solid var(--color-border-hairline);border-radius:var(--radius-round);
  padding:7px 18px;cursor:pointer;min-height:36px;transition:border-color var(--duration-base), color var(--duration-base);
}
.chip.active{color:var(--wine-300);border-color:var(--color-border-wine);}
.chip:hover{color:var(--gold-200);}

/* catalog cards */
.catalogo{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-6);margin-bottom:var(--space-7);}
.card{
  background:var(--ink-000);border:1px solid var(--color-border-hairline);border-radius:var(--radius-sm);
  overflow:hidden;box-shadow:var(--shadow-card);display:flex;flex-direction:column;
  transition:border-color var(--duration-base) var(--ease-standard), transform var(--duration-base);
}
.card:hover{border-color:var(--color-border-strong);transform:translateY(-2px);}
.card .cover{aspect-ratio:4/3;background:var(--ink-900);overflow:hidden;position:relative;}
.card .cover img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.card .cover-scrim{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(16,13,8,.92) 100%);}
.card .badge{
  position:absolute;top:16px;left:16px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;padding:4px 12px;border-radius:var(--radius-round);border:1px solid;
}
.card .badge-gold{color:var(--gold-200);border-color:var(--gold-700);background:rgba(201,168,79,.14);}
.card .badge-wine{color:var(--wine-300);border-color:var(--wine-700);background:rgba(122,31,43,.18);}
.card .cover-caption{position:absolute;left:20px;right:20px;bottom:16px;}
.card .cover-caption .eyebrow{display:block;margin-bottom:6px;}
.card .cover-caption .t{font-size:var(--text-display-sm);}
.card .body{padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-4);flex:1;}
.card .t{font-family:var(--font-display);font-size:var(--text-display-sm);color:var(--cream-100);line-height:1.25;margin:0;}
.card .d{font-size:var(--text-body-md);color:var(--color-text-secondary);margin:0;}
.card .meta{font-size:var(--text-label);letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-secondary);}
.card .meta-footer{
  margin-top:auto;padding-top:var(--space-4);border-top:1px solid var(--color-border-hairline);
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;
}
.card .price{font-family:var(--font-display);font-size:22px;color:var(--cream-100);}
.card .price-soon{font-family:var(--font-mono);font-size:var(--text-body-sm);color:var(--color-text-secondary);}
.card .payment-note{
  font-size:11px;letter-spacing:.04em;color:var(--color-text-secondary);
  display:flex;gap:8px;flex-wrap:wrap;
}

/* estado de erro do catálogo */
.catalog-error{
  text-align:center;padding:var(--space-8) var(--space-5);border:1px solid var(--color-border-hairline);
  border-radius:var(--radius-sm);background:var(--ink-000);margin-bottom:var(--space-7);
}
.catalog-error .eyebrow{display:block;margin-bottom:var(--space-3);}

/* funil pós-compra */
.funnel{text-align:center;}
.funnel-title{display:block;margin-bottom:var(--space-5);}
.funnel-steps{display:flex;justify-content:center;align-items:flex-start;gap:var(--space-3);flex-wrap:wrap;}
.funnel-step{max-width:150px;}
.funnel-step .n{
  width:36px;height:36px;border:1px solid var(--color-border-hairline);border-radius:50%;
  display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-3);
  font-family:var(--font-display);color:var(--gold-400);
}
.funnel-step .l{font-size:var(--text-body-sm);color:var(--color-text-secondary);line-height:1.4;}
.funnel-arrow{color:var(--color-border-hairline);font-size:20px;padding-top:6px;}
@media (max-width:640px){ .funnel-arrow{display:none;} }

/* quem investiga */
.team-card{
  display:flex;gap:var(--space-6);align-items:center;flex-wrap:wrap;
  background:var(--color-surface);border:1px solid var(--color-border-hairline);border-radius:var(--radius-sm);
  padding:var(--space-6);box-shadow:var(--shadow-card);
}
.team-mark{width:64px;height:64px;flex:none;}
.team-mark img{
  width:100%;height:100%;object-fit:cover;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cdefs%3E%3Cfilter id='f'%3E%3CfeGaussianBlur stdDeviation='6'/%3E%3C/filter%3E%3C/defs%3E%3Crect x='8' y='8' width='48' height='48' rx='4' fill='white' filter='url(%23f)'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Cdefs%3E%3Cfilter id='f'%3E%3CfeGaussianBlur stdDeviation='6'/%3E%3C/filter%3E%3C/defs%3E%3Crect x='8' y='8' width='48' height='48' rx='4' fill='white' filter='url(%23f)'/%3E%3C/svg%3E");
  mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;
}
.team-card p{margin:0;color:var(--color-text-secondary);max-width:640px;}

/* como funciona */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--space-5);}
.step{text-align:center;padding:var(--space-5) var(--space-3);}
.step .n{font-family:var(--font-display);font-size:var(--text-display-sm);color:var(--wine-300);margin-bottom:var(--space-2);}
.step .i{width:34px;height:34px;margin:0 auto var(--space-3);color:var(--gold-400);}
.step .t{font-size:var(--text-label);letter-spacing:.1em;text-transform:uppercase;color:var(--cream-100);}

/* quote / about */
.about{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8);align-items:center;
  background:var(--color-surface);border:1px solid var(--color-border-hairline);border-radius:var(--radius-md);
  padding:var(--space-8);box-shadow:var(--shadow-card);
}
@media (max-width:760px){ .about{grid-template-columns:1fr;padding:var(--space-6);} }
.about blockquote{font-family:var(--font-display);font-size:var(--text-display-sm);color:var(--cream-100);
  line-height:var(--leading-title);margin:0;border-left:2px solid var(--wine-500);padding-left:var(--space-5);}
.about .about-copy .eyebrow{margin-bottom:var(--space-3);display:block;}
.about h2{font-size:var(--text-display-md);color:var(--cream-100);margin-bottom:var(--space-4);}
.about p{color:var(--color-text-secondary);margin-bottom:var(--space-5);}

/* product / buy */
.product-hero{display:grid;grid-template-columns:280px 1fr;gap:var(--space-8);align-items:start;}
@media (max-width:760px){ .product-hero{grid-template-columns:1fr;} }
.product-hero .frame{border:1px solid var(--color-border-hairline);box-shadow:var(--shadow-card);border-radius:var(--radius-sm);overflow:hidden;}
.stamp{
  display:inline-block;border:1px solid var(--color-border-wine);color:var(--wine-300);padding:5px 14px;
  font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;font-size:11px;margin-bottom:var(--space-4);border-radius:var(--radius-sm);
}
.lede{max-width:60ch;color:var(--color-text-secondary);margin:0 0 var(--space-3);}
.sub{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-400);margin:0 0 var(--space-4);}

.buybox{border-top:1px solid var(--color-border-hairline);margin-top:var(--space-7);padding-top:var(--space-6);}
.buybox .price{font-family:var(--font-mono);font-size:28px;color:var(--gold-200);margin:0 0 var(--space-4);}
.buybox form{display:flex;gap:var(--space-3);flex-wrap:wrap;align-items:center;}
.buybox input[type=email]{
  font-family:var(--font-mono);font-size:var(--text-body-sm);padding:13px 14px;border-radius:var(--radius-sm);
  border:1px solid var(--color-border-hairline);background:var(--ink-900);color:var(--cream-100);min-width:240px;flex:1;
}
.buybox input[type=email]::placeholder{color:var(--color-text-secondary);}
.buybox input[type=email]:focus{outline:none;border-color:var(--color-focus-ring);box-shadow:0 0 0 3px rgba(201,168,79,.15);}
.buybox .msg{width:100%;font-size:var(--text-body-sm);margin-top:var(--space-2);}
.buybox .msg.err{color:var(--color-danger);}
.buybox .msg.ok{color:var(--color-success);}

.detalhes{border-top:1px solid var(--color-border-hairline);margin-top:var(--space-7);padding-top:var(--space-6);}
.detalhes h2{font-size:11px;text-transform:uppercase;letter-spacing:var(--tracking-label);color:var(--color-accent);margin:0 0 var(--space-4);font-family:var(--font-mono);}
.detalhes ul{margin:0;padding-left:1.15em;color:var(--color-text-secondary);font-size:var(--text-body-md);max-width:66ch;}
.detalhes li{margin-bottom:.6em;}
.detalhes strong{color:var(--cream-100);}

/* status pages */
.status-card{
  max-width:520px;margin:var(--space-8) auto;text-align:center;background:var(--color-surface);
  border:1px solid var(--color-border-hairline);border-radius:var(--radius-md);padding:var(--space-8) var(--space-6);
  box-shadow:var(--shadow-card);
}
.status-icon{width:40px;height:40px;margin:0 auto var(--space-4);color:var(--gold-400);}
.spinner{display:inline-block;width:16px;height:16px;border:2px solid var(--color-border-hairline);border-top-color:var(--gold-400);
  border-radius:50%;animation:spin .8s linear infinite;vertical-align:-3px;margin-right:8px;}
@keyframes spin{to{transform:rotate(360deg);}}

/* faq */
.faq-list{display:flex;flex-direction:column;gap:var(--space-3);max-width:74ch;}
.faq-list details{
  background:var(--color-surface);border:1px solid var(--color-border-hairline);border-radius:var(--radius-sm);
  padding:var(--space-4) var(--space-5);
}
.faq-list summary{
  cursor:pointer;font-family:var(--font-mono);font-weight:700;color:var(--cream-100);
  font-size:var(--text-body-md);list-style:none;display:flex;justify-content:space-between;align-items:center;
}
.faq-list summary::-webkit-details-marker{display:none;}
.faq-list summary::after{content:'+';color:var(--gold-400);font-size:18px;}
.faq-list details[open] summary::after{content:'–';}
.faq-list details p{color:var(--color-text-secondary);margin:var(--space-3) 0 0;font-size:var(--text-body-sm);}

/* newsletter */
.newsletter{display:flex;gap:var(--space-3);flex-wrap:wrap;}
.newsletter input[type=email]{
  font-family:var(--font-mono);font-size:var(--text-body-sm);padding:11px 13px;border-radius:var(--radius-sm);
  border:1px solid var(--color-border-hairline);background:var(--ink-900);color:var(--cream-100);min-width:200px;flex:1;
}
.newsletter .btn{padding:11px 18px;font-size:12px;}
.newsletter .msg{width:100%;font-size:12px;margin-top:6px;}

/* footer */
footer.site-footer{border-top:1px solid var(--color-border-hairline);padding-block:var(--space-7);margin-top:var(--space-8);}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:var(--space-7);}
@media (max-width:720px){ .footer-grid{grid-template-columns:1fr;gap:var(--space-6);} }
.footer-brand{display:flex;gap:12px;align-items:flex-start;}
.footer-brand .brandmark{width:36px;height:36px;}
.footer-brand b{font-family:var(--font-display);font-size:var(--text-body-md);color:var(--cream-100);letter-spacing:.06em;}
.footer-brand p{font-size:11px;color:var(--color-text-secondary);letter-spacing:.06em;text-transform:uppercase;margin-top:4px;}
.footer-links{display:flex;flex-direction:column;gap:var(--space-2);}
.footer-links a{font-size:var(--text-body-sm);color:var(--color-text-secondary);}
.footer-links a:hover{color:var(--color-accent);}
.footer-bottom{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3);
  margin-top:var(--space-7);padding-top:var(--space-5);border-top:1px solid var(--color-border-hairline);
  font-size:11px;color:var(--color-text-secondary);letter-spacing:.04em;
}

@media (prefers-reduced-motion:reduce){*{transition-duration:.001ms !important;animation-duration:.001ms !important;}}