/* ==========================================================================
   VELAS LUZ — Design System
   Curitiba/PR — velas artesanais e de linha comercial
   Paleta: preto profundo + dourado/âmbar (chama de vela), tipografia luxuosa
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,500&family=Jost:wght@300;400;500;600;700&display=swap');

:root{
  --bg:            #0a0704;
  --bg-alt:        #120d08;
  --bg-card:       #16110a;
  --line:          rgba(212,175,55,.18);
  --line-soft:     rgba(255,255,255,.08);

  --gold:          #d4af37;
  --gold-2:        #f3d675;
  --gold-deep:     #a8791f;
  --flame:         #ff8a2b;
  --flame-2:       #ff5a1f;
  --ember:         #7a1f0d;

  --ink:           #f5efe3;
  --ink-soft:      #d8cdb8;
  --ink-mute:      #a89a80;

  --font-display:  'Cormorant Garamond', Georgia, serif;
  --font-body:     'Jost', Arial, sans-serif;

  --container:     1240px;
  --radius:        14px;
  --radius-sm:     8px;

  --shadow-deep:   0 30px 80px -20px rgba(0,0,0,.85);
  --ease:          cubic-bezier(.16,.84,.44,1);
}

/* ---------- reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-weight:300;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:600;
  color:var(--gold-2);
  margin:0 0 .5em;
  letter-spacing:.01em;
}
p{ margin:0 0 1em; color:var(--ink-soft); }
button{ font-family:inherit; cursor:pointer; }
input,textarea,select{ font-family:inherit; }
.container{ max-width:var(--container); margin:0 auto; padding:0 24px; }
section{ position:relative; padding:110px 0; }
@media(max-width:768px){ section{ padding:70px 0; } }

.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-body); font-size:.78rem; letter-spacing:.32em;
  text-transform:uppercase; color:var(--gold);
  margin-bottom:14px;
}
.eyebrow::before{
  content:""; width:28px; height:1px; background:var(--gold);
}
.section-head{ max-width:760px; margin-bottom:56px; }
.section-head h2{ font-size:clamp(2rem,4vw,2.9rem); }
.section-head p{ font-size:1.05rem; }
.center{ text-align:center; margin-left:auto; margin-right:auto; }

/* ---------- ambient flame particles (lightweight, css-only) ---------- */
.ember-field{ position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
.ember{
  position:absolute; bottom:-10%; width:3px; height:3px; border-radius:50%;
  background:var(--flame); box-shadow:0 0 8px 2px var(--flame);
  opacity:0; animation:emberRise linear infinite;
}
@keyframes emberRise{
  0%{ transform:translateY(0) translateX(0); opacity:0; }
  10%{ opacity:.85; }
  90%{ opacity:.4; }
  100%{ transform:translateY(-110vh) translateX(var(--drift,20px)); opacity:0; }
}

/* ==========================================================================
   HEADER / NAV
   Mobile (<=992px): dark transparent-to-solid header + fullscreen hamburger menu
   Desktop (>=993px): standard white header bar with an inline horizontal menu
   ========================================================================== */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 28px;
  background:#fffaf2;
  box-shadow:0 4px 22px rgba(20,12,4,.10);
  border-bottom:1px solid rgba(212,175,55,.25);
  transition:background .4s var(--ease), padding .4s var(--ease), box-shadow .4s var(--ease);
}
.site-header.is-scrolled{
  background:#fffaf2;
  padding:8px 28px;
  box-shadow:0 6px 26px rgba(20,12,4,.14);
}
.brand{ display:flex; align-items:center; gap:12px; position:relative; z-index:2; }
.brand img{ height:66px; width:auto; transition:height .4s var(--ease); }
.site-header.is-scrolled .brand img{ height:52px; }
.brand-name{ font-family:var(--font-display); font-size:1.15rem; color:var(--ink); letter-spacing:.04em; display:none; }

.header-actions{ display:flex; align-items:center; gap:18px; }

/* hamburger — mobile only (desktop uses the standard inline menu below) */
.hamburger{
  width:52px; height:52px; border-radius:50%;
  border:1px solid rgba(36,23,8,.22);
  background:rgba(36,23,8,.04);
  display:flex; align-items:center; justify-content:center;
  position:relative; z-index:1002; flex-shrink:0;
}
.hamburger .bars{ position:relative; width:22px; height:16px; }
.hamburger .bars span{
  position:absolute; left:0; width:100%; height:2px; background:#241708;
  border-radius:2px; transition:transform .4s var(--ease), opacity .3s var(--ease), background .3s;
}
.hamburger .bars span:nth-child(1){ top:0; }
.hamburger .bars span:nth-child(2){ top:7px; }
.hamburger .bars span:nth-child(3){ top:14px; }
.hamburger.is-active .bars span{ background:var(--flame); }
.hamburger.is-active .bars span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.hamburger.is-active .bars span:nth-child(2){ opacity:0; }
.hamburger.is-active .bars span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ---------- standard desktop menu ---------- */
.desktop-nav{ display:none; }

@media(min-width:993px){
  .site-header{
    background:#fffaf2;
    padding:14px 40px;
    box-shadow:0 4px 22px rgba(20,12,4,.10);
    border-bottom:1px solid rgba(212,175,55,.25);
  }
  .site-header.is-scrolled{
    background:#fffaf2;
    padding:8px 40px;
    box-shadow:0 6px 26px rgba(20,12,4,.14);
  }
  .brand img{ height:99px; }
  .site-header.is-scrolled .brand img{ height:74px; }

  .desktop-nav{ display:flex; align-items:center; gap:30px; }
  .desktop-nav > a{
    font-family:var(--font-body); font-size:.92rem; font-weight:500; letter-spacing:.02em;
    color:#241708; position:relative; padding:6px 0;
  }
  .desktop-nav > a::after{
    content:""; position:absolute; left:0; right:100%; bottom:0; height:2px;
    background:linear-gradient(90deg,var(--flame),var(--gold)); transition:right .3s var(--ease);
  }
  .desktop-nav > a:hover{ color:var(--flame-2); }
  .desktop-nav > a:hover::after{ right:0; }

  .dnav-dropdown{ position:relative; }
  .dnav-toggle{
    display:flex; align-items:center; gap:7px; background:none; border:none;
    font-family:var(--font-body); font-size:.92rem; font-weight:500; letter-spacing:.02em;
    color:#241708; padding:6px 0;
  }
  .dnav-toggle .chev{ width:13px; height:13px; transition:transform .3s var(--ease); }
  .dnav-toggle:hover{ color:var(--flame-2); }
  .dnav-dropdown.is-open .dnav-toggle .chev{ transform:rotate(180deg); }
  .dnav-panel{
    position:absolute; top:calc(100% + 18px); left:50%; transform:translateX(-50%) translateY(-8px);
    background:rgba(255,122,41,.8); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
    border-radius:var(--radius-sm); border:1px solid rgba(212,175,55,.3);
    box-shadow:0 20px 50px -14px rgba(20,12,4,.3);
    display:flex; flex-direction:column; padding:10px; min-width:220px;
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .28s var(--ease), transform .28s var(--ease), visibility 0s linear .28s;
  }
  .dnav-dropdown.is-open .dnav-panel{
    opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0);
    transition:opacity .28s var(--ease), transform .28s var(--ease);
  }
  .dnav-panel a{
    padding:10px 14px; border-radius:6px; font-size:.88rem; color:#241708; font-weight:600;
    white-space:nowrap;
  }
  .dnav-panel a:hover{ background:rgba(255,138,43,.22); color:#170c04; }

  .hamburger{ display:none; }
  .hero{ padding-top:210px; }
  .page-hero{ padding-top:240px; }
}

@media(max-width:992px){
  .desktop-nav{ display:none !important; }
}

/* fullscreen nav overlay — same markup/behaviour on desktop and mobile */
.nav-overlay{
  position:fixed; inset:0; z-index:1001;
  background:radial-gradient(ellipse at 70% 20%, #1c1107 0%, #070502 62%);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transform:scale(1.04);
  transition:opacity .5s var(--ease), transform .6s var(--ease), visibility 0s linear .5s;
}
.nav-overlay.is-open{ opacity:1; visibility:visible; transform:scale(1); transition:opacity .5s var(--ease), transform .6s var(--ease); }
.nav-overlay-inner{ width:100%; max-width:980px; padding:40px; max-height:90vh; overflow-y:auto; }
.nav-brand{ display:flex; justify-content:center; margin-bottom:28px; }
.nav-brand img{ height:70px; width:auto; }

.nav-links{ display:grid; grid-template-columns:1fr 1fr; gap:6px 40px; }
@media(max-width:760px){ .nav-links{ grid-template-columns:1fr; gap:2px; } }
.nav-links > li{ border-bottom:1px solid var(--line-soft); }
.nav-links > li > a, .nav-links .nav-parent-toggle{
  display:flex; align-items:center; gap:14px;
  padding:14px 6px; font-family:var(--font-display); font-size:1.5rem;
  color:var(--ink); transition:color .3s, padding-left .3s; background:none; border:none; width:100%; text-align:left;
}
.nav-links > li > a:hover, .nav-links .nav-parent-toggle:hover{ color:var(--gold-2); padding-left:14px; }
.nav-ico{ width:22px; height:22px; flex-shrink:0; color:var(--gold); }
.nav-ico svg{ width:100%; height:100%; }

.nav-parent{ position:relative; }
.nav-parent-toggle{ justify-content:space-between; }
.nav-parent-toggle .chev{ margin-left:auto; width:14px; height:14px; transition:transform .35s var(--ease); color:var(--gold); }
.nav-parent.is-open .nav-parent-toggle .chev{ transform:rotate(180deg); }
.nav-sub{
  max-height:0; overflow:hidden; transition:max-height .45s var(--ease);
  padding-left:36px;
}
.nav-parent.is-open .nav-sub{ max-height:560px; }
.nav-sub li a{
  display:block; padding:8px 6px; font-family:var(--font-body); font-size:.92rem;
  letter-spacing:.03em; color:var(--ink-mute); text-transform:uppercase;
}
.nav-sub li a:hover{ color:var(--gold-2); }

.nav-meta{
  margin-top:32px; padding-top:24px; border-top:1px solid var(--line-soft);
  display:flex; flex-wrap:wrap; gap:16px 28px; justify-content:center;
  font-size:.85rem; color:var(--ink-mute);
}
.nav-meta a{ color:var(--ink-soft); }
.nav-meta a:hover{ color:var(--gold-2); }

.nav-close{
  position:absolute; top:26px; right:28px; z-index:1003;
  width:52px; height:52px; border-radius:50%; border:1px solid var(--line);
  background:rgba(255,255,255,.03); color:var(--gold-2);
  display:flex; align-items:center; justify-content:center; font-size:1.4rem;
}

body.nav-is-open{ overflow:hidden; }

/* ==========================================================================
   NEON COMET BORDER (SVG stroke-dashoffset traveling beam)
   ========================================================================== */
.neon-frame{ position:relative; }
.neon-frame > .frame-svg{
  position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:2;
  overflow:visible;
}
.neon-frame > .frame-svg rect{
  fill:none; stroke:var(--gold-2); stroke-width:1.5;
  filter:drop-shadow(0 0 6px var(--gold)) drop-shadow(0 0 14px var(--flame));
}
.neon-frame.always > .frame-svg rect{
  stroke-dasharray:26 380; stroke-dashoffset:0;
  animation:cometTravel 4.5s linear infinite;
}
.neon-frame.on-open > .frame-svg{ opacity:0; transition:opacity .4s; }
.neon-frame.on-open.is-open > .frame-svg{ opacity:1; }
.neon-frame.on-open.is-open > .frame-svg rect{
  stroke-dasharray:26 380; animation:cometTravel 3.2s linear infinite;
}
@keyframes cometTravel{ to{ stroke-dashoffset:-406; } }

/* ==========================================================================
   BUTTONS — solid "flame" (primary) + ghost "outline" (secondary), both
   pill-shaped with a thin, separated outer ring — white label text throughout.
   ========================================================================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:14px 30px; border-radius:999px;
  font-family:var(--font-body); font-weight:700; font-size:.88rem;
  letter-spacing:.01em; text-transform:none; white-space:nowrap; flex:0 0 auto;
  position:relative; isolation:isolate;
  color:#fff;
  transition:transform .3s var(--ease), filter .3s var(--ease),
             background .3s var(--ease), border-color .3s var(--ease);
}
.btn::after{
  content:""; position:absolute; inset:-9px; border-radius:999px;
  border:1.5px solid rgba(255,145,55,.6);
  pointer-events:none; z-index:-1;
  transition:border-color .3s var(--ease);
}
.btn:hover{ transform:translateY(-2px); }
.btn:hover::after{ border-color:rgba(255,175,85,.9); }
.btn svg{ color:#fff; }

.btn-flame, .btn-header-cta{
  background:linear-gradient(180deg,var(--flame-2),var(--flame) 90%);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 8px 18px -9px rgba(0,0,0,.55);
}
.btn-flame:hover{ filter:brightness(1.08); }

.btn-outline{
  background:rgba(10,6,2,.4);
  border:1px solid rgba(255,255,255,.4);
}
.btn-outline:hover{
  background:rgba(255,140,40,.14);
  border-color:rgba(255,190,110,.75);
}
.btn .flame-ico{ width:15px; height:15px; }

/* discreet flame-lick animation sitting on whatsapp-style buttons */
.wa-flick{
  position:absolute; width:10px; height:14px; left:14px; top:50%;
  transform:translateY(-50%); pointer-events:none; opacity:.9; z-index:-1;
}
.wa-flick svg{ width:100%; height:100%; animation:flicker 1.6s ease-in-out infinite; transform-origin:50% 100%; }
@keyframes flicker{
  0%,100%{ transform:scaleY(1) rotate(0deg); opacity:.9; }
  25%{ transform:scaleY(1.08) rotate(-3deg); opacity:1; }
  50%{ transform:scaleY(.94) rotate(2deg); opacity:.85; }
  75%{ transform:scaleY(1.05) rotate(-2deg); opacity:1; }
}

/* ==========================================================================
   WHATSAPP FLOATING BUTTON
   ========================================================================== */
.wa-float{
  position:fixed; right:22px; bottom:22px; z-index:900;
  width:64px; height:64px; border-radius:50%;
  background:linear-gradient(145deg,var(--flame),var(--flame-2));
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 30px -6px rgba(255,110,30,.65);
  animation:waPulse 2.8s ease-in-out infinite;
}
.wa-float svg{ width:30px; height:30px; color:#170c04; }
.wa-float .flame-top{
  position:absolute; top:-13px; left:50%; transform:translateX(-50%); width:16px; height:20px;
}
.wa-float .flame-top svg{ width:100%; height:100%; color:var(--gold-2); animation:flicker 1.4s ease-in-out infinite; }
@keyframes waPulse{
  0%,100%{ box-shadow:0 12px 30px -6px rgba(255,110,30,.65); }
  50%{ box-shadow:0 12px 42px -4px rgba(255,150,40,.9); }
}
.wa-float .wa-tip{
  position:absolute; right:76px; top:50%; transform:translateY(-50%);
  background:var(--bg-card); border:1px solid var(--line); color:var(--ink);
  padding:8px 14px; border-radius:8px; font-size:.78rem; white-space:nowrap;
  opacity:0; pointer-events:none; transition:opacity .3s;
}
.wa-float:hover .wa-tip{ opacity:1; }
@media(max-width:600px){ .wa-float{ width:56px; height:56px; right:14px; bottom:14px; } .wa-float svg{ width:26px; height:26px; } .wa-tip{ display:none; } }

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{
  position:relative; min-height:100vh; display:flex; align-items:flex-end;
  padding:160px 0 100px; overflow:hidden; background:#050402;
}
.hero-bg{
  position:absolute; inset:0; z-index:0;
}
.hero-bg img{ width:100%; height:100%; object-fit:cover; opacity:.55; }
.hero-bg::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(5,4,2,.55) 0%, rgba(5,4,2,.35) 40%, rgba(5,4,2,.95) 100%),
    linear-gradient(90deg, rgba(5,4,2,.85) 0%, rgba(5,4,2,.15) 55%);
}
#kinetic-canvas{ position:absolute; inset:0; z-index:1; opacity:.55; }
.hero-content{ position:relative; z-index:2; max-width:760px; }
.hero-content .eyebrow{ color:var(--gold-2); }
.smoky-text{ font-family:var(--font-display); font-weight:600; font-size:clamp(2.6rem,6.4vw,5.2rem); line-height:1.04; color:var(--ink); margin-bottom:22px; }
.smoky-text .char{ display:inline-block; opacity:0; white-space:pre; }
.smoky-text .char.in{ animation:smokeIn 1.1s var(--ease) forwards; }
@keyframes smokeIn{
  0%{ opacity:0; filter:blur(14px); transform:translate3d(-14px,10px,0) scale(1.4); }
  60%{ filter:blur(3px); }
  100%{ opacity:1; filter:blur(0); transform:none; }
}
.hero-content .lede{ font-size:1.15rem; max-width:560px; margin-bottom:34px; color:var(--ink-soft); }
.hero-cta{ display:flex; gap:18px; flex-wrap:wrap; }
.hero-stats{ display:flex; gap:40px; margin-top:56px; flex-wrap:wrap; }
.hero-stats div strong{ display:block; font-family:var(--font-display); font-size:2.1rem; color:var(--gold-2); }
.hero-stats div span{ font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute); }
.scroll-cue{
  position:absolute; left:50%; bottom:34px; transform:translateX(-50%); z-index:2;
  width:26px; height:42px; border:1px solid var(--line); border-radius:14px;
}
.scroll-cue::before{
  content:""; position:absolute; top:8px; left:50%; width:4px; height:8px; margin-left:-2px;
  background:var(--gold-2); border-radius:2px; animation:cueDrop 1.8s ease-in-out infinite;
}
@keyframes cueDrop{ 0%{ opacity:1; top:8px; } 70%{ opacity:0; top:22px; } 100%{ opacity:0; top:8px; } }

/* interior page hero (subpages) */
.page-hero{
  position:relative; padding:210px 0 90px; overflow:hidden; background:#050402;
  border-bottom:1px solid var(--line);
}
.page-hero-bg img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.38; }
.prod-hero .page-hero-bg img{ opacity:.48; }
.page-hero-bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(5,4,2,.55), rgba(5,4,2,.96)); }
.page-hero .container{ position:relative; z-index:1; }
.breadcrumb{ font-size:.8rem; color:var(--ink-mute); margin-bottom:18px; letter-spacing:.03em; }
.breadcrumb a:hover{ color:var(--gold-2); }
.page-hero h1{ font-size:clamp(2.2rem,5vw,3.6rem); max-width:820px; }
.page-hero .lede{ max-width:640px; font-size:1.08rem; }

/* ==========================================================================
   QUEM SOMOS
   ========================================================================== */
.about{ background:var(--bg); }
.about-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:70px; align-items:center; }
@media(max-width:900px){ .about-grid{ grid-template-columns:1fr; gap:44px; } }
.about-photo{ position:relative; border-radius:var(--radius); overflow:hidden; }
.about-photo img{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/5; }
.about-photo .frame-svg{ z-index:2; }
.about-copy .lead{ font-family:var(--font-display); font-size:1.35rem; color:var(--ink); font-style:italic; }
.about-values{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:30px; }
.about-values li{
  padding:18px; border:1px solid var(--line-soft); border-radius:var(--radius-sm);
  background:rgba(255,255,255,.02);
}
.about-values strong{ display:block; color:var(--gold-2); font-family:var(--font-display); font-size:1.15rem; margin-bottom:4px; }
.about-values span{ font-size:.88rem; color:var(--ink-mute); }

/* ==========================================================================
   LINHAS DE PRODUTOS — grid de cards
   ========================================================================== */
.linhas{ background:var(--bg-alt); }
.linhas-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
@media(max-width:980px){ .linhas-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:560px){ .linhas-grid{ grid-template-columns:1fr; } }
.linha-card{
  position:relative; border-radius:var(--radius); overflow:hidden;
  aspect-ratio:3/4; display:flex; align-items:flex-end;
  border:1px solid var(--line-soft);
}
.linha-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease); }
.linha-card:hover img{ transform:scale(1.08); }
.linha-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(8,6,3,.15) 0%, rgba(8,6,3,.55) 55%, rgba(6,4,2,.96) 100%);
}
.linha-card .lc-body{ position:relative; z-index:1; padding:22px; width:100%; }
.linha-card .lc-num{ font-family:var(--font-display); font-size:.85rem; color:var(--gold); letter-spacing:.1em; }
.linha-card h3{ font-size:1.4rem; margin:2px 0 6px; }
.linha-card .lc-arrow{
  display:inline-flex; align-items:center; gap:6px; font-size:.75rem; letter-spacing:.08em;
  text-transform:uppercase; color:var(--ink-mute); transition:color .3s, gap .3s;
}
.linha-card:hover .lc-arrow{ color:var(--gold-2); gap:11px; }
.linha-card .lc-arrow svg{ width:13px; height:13px; }

/* ==========================================================================
   SOLUÇÕES — cards que expandem no clique
   ========================================================================== */
.solucoes{ background:var(--bg); }
.sol-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
@media(max-width:900px){ .sol-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:600px){ .sol-grid{ grid-template-columns:1fr; } }
.sol-card{
  border-radius:var(--radius); overflow:hidden; background:var(--bg-card);
  border:1px solid var(--line-soft); position:relative;
}
.sol-photo{ position:relative; aspect-ratio:16/10; overflow:hidden; }
.sol-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.sol-card:hover .sol-photo img{ transform:scale(1.06); }
.sol-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(10,7,4,.9)); }
.sol-btn{
  width:100%; text-align:left; background:none; border:none; padding:18px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.sol-btn h3{ font-size:1.18rem; margin:0; color:var(--ink); }
.sol-btn .plus{
  width:28px; height:28px; border-radius:50%; border:1px solid var(--line); flex-shrink:0;
  display:flex; align-items:center; justify-content:center; color:var(--gold-2); transition:transform .35s var(--ease), background .3s;
  font-size:1.1rem; line-height:1;
}
.sol-card.is-open .sol-btn .plus{ transform:rotate(135deg); background:rgba(212,175,55,.12); }
.sol-body{ max-height:0; overflow:hidden; transition:max-height .5s var(--ease); }
.sol-card.is-open .sol-body{ max-height:260px; }
.sol-body-inner{ padding:0 20px 22px; }
.sol-body-inner p{ font-size:.94rem; margin-bottom:12px; }
.sol-body-inner a{ font-size:.8rem; letter-spacing:.05em; text-transform:uppercase; color:var(--flame); }

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq{ background:var(--bg-alt); }
.faq-list{ max-width:840px; margin:0 auto; display:flex; flex-direction:column; gap:14px; }
.faq-item{ border-radius:var(--radius-sm); background:var(--bg-card); position:relative; }
.faq-q{
  width:100%; text-align:left; background:none; border:none; padding:20px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  font-family:var(--font-display); font-size:1.15rem; color:var(--ink);
}
.faq-q .plus{ width:24px; height:24px; flex-shrink:0; position:relative; }
.faq-q .plus::before, .faq-q .plus::after{ content:""; position:absolute; background:var(--gold-2); border-radius:2px; }
.faq-q .plus::before{ top:50%; left:0; width:100%; height:2px; margin-top:-1px; }
.faq-q .plus::after{ left:50%; top:0; height:100%; width:2px; margin-left:-1px; transition:transform .3s var(--ease); }
.faq-item.is-open .plus::after{ transform:rotate(90deg); opacity:0; }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .45s var(--ease); }
.faq-item.is-open .faq-a{ max-height:320px; }
.faq-a-inner{ padding:0 24px 22px; font-size:.95rem; color:var(--ink-soft); }

/* ==========================================================================
   CONTATO
   ========================================================================== */
.contato{ background:var(--bg-alt); }
.contato-grid{ display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:stretch; }
@media(max-width:900px){ .contato-grid{ grid-template-columns:1fr; } }
.contato-info li{ display:flex; gap:14px; padding:16px 0; border-bottom:1px solid var(--line-soft); }
.contato-info li:last-child{ border-bottom:none; }
.contato-info .ico{ width:22px; height:22px; color:var(--gold); flex-shrink:0; margin-top:3px; }
.contato-info strong{ display:block; color:var(--ink); font-size:.95rem; margin-bottom:2px; }
.contato-info span, .contato-info a{ font-size:.92rem; color:var(--ink-mute); }
.contato-info a:hover{ color:var(--gold-2); }
.contato-map{ border-radius:var(--radius); overflow:hidden; border:1px solid var(--line-soft); height:100%; min-height:340px; }
.contato-map iframe{ width:100%; height:100%; min-height:340px; border:0; filter:grayscale(.4) invert(.92) contrast(.9); }
@media(max-width:900px){ .contato-map{ min-height:300px; } .contato-map iframe{ min-height:300px; } }

.form-field{ margin-bottom:18px; }
.form-field label{ display:block; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:8px; }
.form-field input, .form-field textarea, .form-field select{
  width:100%; padding:14px 16px; border-radius:var(--radius-sm);
  background:rgba(255,255,255,.03); border:1px solid var(--line-soft); color:var(--ink);
  font-size:.95rem; transition:border-color .3s, background .3s;
}
.form-field select{ color-scheme:dark; }
.form-field input:focus, .form-field textarea:focus, .form-field select:focus{
  outline:none; border-color:var(--gold); background:rgba(212,175,55,.05);
}
.form-field textarea{ min-height:120px; resize:vertical; }
.form-note{ font-size:.78rem; color:var(--ink-mute); margin-top:10px; }
.form-msg{ font-size:.85rem; margin-top:12px; display:none; }
.form-msg.show{ display:block; }
.form-msg.ok{ color:#8fd18a; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{ background:#060402; border-top:1px solid var(--line); padding:70px 0 26px; }
.footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:40px; margin-bottom:50px; }
@media(max-width:900px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .footer-grid{ grid-template-columns:1fr; } }
.footer-brand img{ height:56px; width:auto; margin-bottom:14px; }
.footer-brand p{ font-size:.9rem; max-width:280px; }
.footer-col h4{ color:var(--gold-2); font-size:1rem; margin-bottom:16px; }
.footer-col li{ margin-bottom:10px; }
.footer-col a{ font-size:.9rem; color:var(--ink-mute); transition:color .3s; }
.footer-col a:hover{ color:var(--gold-2); }
.footer-social{ display:flex; gap:12px; margin-top:16px; }
.footer-social a{ width:38px; height:38px; border:1px solid var(--line); border-radius:50%; display:flex; align-items:center; justify-content:center; }
.footer-social svg{ width:16px; height:16px; color:var(--gold-2); }
.footer-bottom{
  border-top:1px solid var(--line-soft); padding-top:22px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:.8rem; color:var(--ink-mute);
}
.footer-bottom a{ color:var(--ink-mute); }
.footer-bottom a:hover{ color:var(--gold-2); }

/* ==========================================================================
   PRODUCT SUBPAGE
   ========================================================================== */
.prod-intro{ background:var(--bg); }
.prod-intro-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:start; }
@media(max-width:900px){ .prod-intro-grid{ grid-template-columns:1fr; gap:36px; } }
.prod-intro .lead{ font-family:var(--font-display); font-size:1.3rem; color:var(--ink); font-style:italic; margin-bottom:18px; }
.spec-card{ background:var(--bg-card); border:1px solid var(--line-soft); border-radius:var(--radius); padding:28px; }
.spec-card h3{ font-size:1.2rem; margin-bottom:16px; }
.spec-list{ display:flex; flex-direction:column; gap:0; }
.spec-item{ padding:14px 0; border-bottom:1px solid var(--line-soft); display:flex; justify-content:space-between; gap:14px; }
.spec-item:last-child{ border-bottom:none; }
.spec-item .sp-name{ color:var(--ink); font-weight:500; font-size:.94rem; }
.spec-item .sp-data{ color:var(--gold-2); font-size:.86rem; text-align:right; }
.prod-photo{ position:relative; border-radius:var(--radius); overflow:hidden; margin-top:26px; }
.prod-photo img{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; }
.prod-photo .frame-svg{ z-index:2; }

.gallery{ background:var(--bg-alt); }
.gallery-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
@media(max-width:760px){ .gallery-grid{ grid-template-columns:1fr 1fr; } }
@media(max-width:480px){ .gallery-grid{ grid-template-columns:1fr; } }
.gallery-grid a{ position:relative; border-radius:var(--radius-sm); overflow:hidden; aspect-ratio:4/3; display:block; }
.gallery-grid img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.gallery-grid a:hover img{ transform:scale(1.08); }

.other-lines{ background:var(--bg); }
.other-lines-track{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
@media(max-width:900px){ .other-lines-track{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .other-lines-track{ grid-template-columns:1fr; } }

.cta-band{
  background:radial-gradient(ellipse at 50% 0%, rgba(212,175,55,.14), transparent 60%), var(--bg-card);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  text-align:center; padding:80px 0;
}
.cta-band h2{ font-size:clamp(1.8rem,3.6vw,2.6rem); max-width:680px; margin-left:auto; margin-right:auto; }

/* ==========================================================================
   CATÁLOGO — imagem direta, com moldura neon
   ========================================================================== */
.catalog-image-wrap{ display:flex; justify-content:center; padding:20px 0 10px; }
.catalog-image-frame{
  position:relative; width:min(760px,92vw); border-radius:var(--radius);
  overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-deep);
  display:block; cursor:zoom-in;
}
.catalog-image-frame img{ width:100%; height:auto; display:block; }
.book-actions{ display:flex; gap:16px; justify-content:center; margin-top:44px; flex-wrap:wrap; }

/* ==========================================================================
   REVEAL ON SCROLL
   ========================================================================== */
/* Progressive enhancement: content is fully visible without JS (crawlers,
   no-js, or if IntersectionObserver ever fails). Only once script.js marks
   <html> as js-ready do reveal elements start hidden and animate in. */
.reveal{ opacity:1; transform:none; }
.js-ready .reveal{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.js-ready .reveal.in{ opacity:1; transform:none; }

/* ==========================================================================
   MISC
   ========================================================================== */
.divider-glow{ height:1px; background:linear-gradient(90deg, transparent, var(--gold), transparent); opacity:.4; }
::selection{ background:var(--gold); color:#160c04; }
::-webkit-scrollbar{ width:10px; }
::-webkit-scrollbar-track{ background:var(--bg); }
::-webkit-scrollbar-thumb{ background:var(--gold-deep); border-radius:6px; }

@media(max-width:600px){
  .btn{ white-space:normal; }
  .footer-bottom{ flex-direction:column; text-align:center; justify-content:center; }
}
@media(max-width:480px){
  .btn-header-cta span{ display:none; }
  .btn-header-cta{ padding:13px; }
  .btn-header-cta svg{ width:19px; height:19px; }
  .header-actions{ gap:12px; }
}