/* Identidade fixa da Vulcani. Alterar somente com aprovação do responsável. */
@font-face{font-family:Montserrat;src:url('assets/fonts/Montserrat-Variable.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Exo 2';src:url('assets/fonts/Exo2-Variable.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
:root{
  --brand-orange:#FF6500;
  --brand-black:#080608;
  --brand-white:#F5F5F5;
  --brand-graphite:#383838;
  --font-body:Montserrat,Arial,sans-serif;
  --font-heading:'Exo 2',Montserrat,Arial,sans-serif;
  --orange:var(--brand-orange);--ink:var(--brand-black);--muted:var(--brand-white);--line:var(--brand-graphite);
}
body{font-family:var(--font-body);background:var(--brand-black);color:var(--brand-white)}
.intro-mobile{display:none}
.contact-options{position:fixed;right:24px;bottom:calc(96px + env(safe-area-inset-bottom,0px));z-index:30;display:block;width:min(290px,calc(100vw - 40px));padding:12px;border:1px solid var(--brand-graphite);border-radius:16px;background:var(--brand-black);color:var(--brand-white);box-shadow:0 12px 40px #08060899}
.contact-options-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-left:10px;margin-bottom:6px}
.contact-options-top>strong{font-family:var(--font-heading);font-size:18px}
.contact-options-top button{display:grid;place-items:center;min-width:44px;min-height:44px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--brand-white);font-size:26px}
.contact-options a{display:flex;align-items:center;gap:12px;padding:14px 10px;min-height:64px;border-radius:10px}
.contact-options a:hover,.contact-options-top button:hover{background:var(--brand-graphite)}
.contact-options a>svg{width:28px;height:28px;flex-shrink:0;color:var(--brand-orange)}
.contact-options a strong{display:block;font-size:14px}.contact-options a small{display:block;font-size:11px;line-height:1.6;margin-top:3px}
.contact-arrow{margin-left:auto;color:var(--brand-orange)}
@media(max-width:650px){.contact-options{right:16px;bottom:calc(84px + env(safe-area-inset-bottom,0px))}}
:root{--header-height:100px}
body{padding-top:var(--header-height)}
.header{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--header-height);width:100%;max-width:none;background:var(--brand-black);border-bottom:1px solid var(--brand-graphite)}
html{scroll-padding-top:var(--header-height)}
@media(max-width:650px){:root{--header-height:82px}}
.page-loader{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;background:var(--brand-black);color:var(--brand-white);pointer-events:none}
.loader-brand{font-family:var(--font-body);font-size:clamp(30px,7vw,48px);font-weight:800;letter-spacing:7px;text-align:center}
.loader-brand span{display:block;color:var(--brand-orange);font-size:11px;letter-spacing:5px;margin-top:12px}
.page-loader p{font-size:13px;margin:0;color:var(--brand-white)}
.loader-line{width:150px;height:3px;background:var(--brand-graphite);overflow:hidden;border-radius:2px}
.loader-line::after{content:"";display:block;width:50%;height:100%;background:var(--brand-orange);animation:loader-slide 1.1s ease-in-out infinite alternate}
@keyframes loader-slide{from{transform:translateX(-100%)}to{transform:translateX(200%)}}
@media(prefers-reduced-motion:reduce){.loader-line::after{animation:none;width:100%}}
.portfolio-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:start}
.gallery-image{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;margin:0;padding:0;border:0;border-radius:3px;overflow:hidden;background:var(--brand-graphite);cursor:zoom-in}
.gallery-image img{display:block;flex-shrink:0;width:auto;max-width:100%;height:100%;object-fit:contain;object-position:center;transform:translateY(4%) scale(1.4);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 6%,#000 94%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 6%,#000 94%,transparent 100%)}
.gallery-image:focus-visible{outline:3px solid var(--brand-orange);outline-offset:-3px}
#gallery-viewer{width:min(960px,calc(100vw - 32px));max-height:92svh;padding:0;border:1px solid var(--brand-graphite);background:var(--brand-black);overflow:hidden}
#gallery-full-image{display:block;width:100%;height:auto;max-height:90svh;object-fit:contain}
#gallery-viewer .close{top:12px;right:12px;background:var(--brand-black);color:var(--brand-white);border-color:var(--brand-white)}
html:has(#gallery-viewer[open]){overflow:hidden}
@media(max-width:550px){.portfolio-gallery{gap:4px}.gallery-image{border-radius:0}#gallery-viewer{width:calc(100vw - 16px)}}
/* Rolagem nativa por blocos, sem interceptar roda, toque ou teclado. */
html:has(.home-page){scroll-snap-type:y mandatory}
.home-page .hero,.home-page .home-paths,.home-page .custom,.home-page .site-footer{
  scroll-snap-align:start;
  scroll-snap-stop:always;
}
.home-page .hero{scroll-margin-top:0}
.home-page .home-paths{min-height:100svh;align-items:center;scroll-margin-top:0}
.home-page .custom{min-height:100svh;scroll-margin-top:0}
.home-page .site-footer{scroll-margin-top:0}
@media(max-width:650px){.home-page .hero{scroll-margin-top:0}}
@media(prefers-reduced-motion:reduce){html:has(.home-page){scroll-snap-type:none;scroll-behavior:auto}}
/* Página inicial: um assunto por etapa da rolagem. */
.home-page .hero{min-height:calc(100svh - 100px);padding-top:70px;padding-bottom:80px}
.home-page .intro{max-width:440px;margin-bottom:30px}
.home-page .home-paths{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding-top:80px;padding-bottom:80px}
.home-page .home-chapter{min-height:0;display:flex;align-items:stretch;padding:0;border:0}
.home-page .home-path{width:100%;max-width:1000px;margin:0;padding:32px;min-height:340px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.home-page .home-path h2{font-size:clamp(28px,2.4vw,34px);line-height:1.15;margin:12px 0 20px}
.home-page .home-path>p:not(.eyebrow){max-width:440px;margin-bottom:28px}
.home-page .custom{min-height:100svh;align-items:center;padding-top:100px;padding-bottom:100px;gap:90px}
.home-page .custom h2{font-size:clamp(36px,4vw,56px)}
.reveal-ready .reveal-block{transition:opacity .7s ease,transform .7s ease}
.reveal-ready .reveal-block:not(.is-visible){opacity:0;transform:translateY(28px)}
.reveal-ready .reveal-block:focus-within{opacity:1;transform:none}
@media(max-width:650px){
  .home-page .hero{min-height:calc(100svh - 82px);padding-top:45px;padding-bottom:40px;gap:20px}
  .home-page .hero h1{font-size:clamp(38px,10vw,48px);letter-spacing:-1px}
  .home-page .hero-art{min-height:190px;margin-top:0}
  .home-page .hero-art img{max-width:220px}
  .home-page .art-label{display:none}
  .home-page .home-paths{grid-template-columns:1fr;gap:20px;padding-top:45px;padding-bottom:45px}
  .home-page .home-chapter{min-height:0;padding:0}
  .home-page .home-path{min-height:330px;padding:26px}
  .home-page .home-path h2{font-size:30px}
  .home-page .home-path[href="projetos.html"]>p:not(.eyebrow){max-width:60%}
  .home-page .custom{min-height:100svh;padding-top:65px;padding-bottom:65px;gap:35px}
}
@media(prefers-reduced-motion:reduce){.reveal-ready .reveal-block,.reveal-ready .reveal-block:not(.is-visible){opacity:1;transform:none;transition:none}}
.hero-art{background:var(--brand-black);isolation:isolate}
.hero-art img{mix-blend-mode:lighten}
h1,h2,h3,.steps li>span,.product-price strong{font-family:var(--font-heading)}
button,input,select,textarea{font-family:var(--font-body)}
.wordmark,.eyebrow,.category,.home-path>strong{font-family:var(--font-body);font-weight:800}
.photo{background:var(--brand-white);color:var(--brand-graphite)}
.photo svg{stroke:var(--brand-graphite)}
.demo{background:var(--brand-white);color:var(--brand-graphite);border:1px solid var(--brand-graphite)}
.whatsapp-float,.whatsapp-float:hover{background:var(--brand-orange);color:var(--brand-black)}
.social-duo{position:relative;display:block;width:38px;height:38px}
.social-duo-whatsapp{position:absolute;left:0;top:0;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--brand-orange);color:var(--brand-black)}
.whatsapp-float .social-duo-whatsapp svg{display:block;width:25px;height:25px}
.social-duo-instagram{position:absolute;right:-2px;bottom:-2px;display:grid;place-items:center;width:25px;height:25px;border:2px solid var(--brand-orange);border-radius:8px;background:var(--brand-orange);color:var(--brand-black)}
.whatsapp-float .social-duo-instagram svg{width:19px;height:19px}
.primary:hover{background:var(--brand-orange);color:var(--brand-black);box-shadow:0 0 0 2px var(--brand-white)}
.home-path[href="projetos.html"]{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:var(--brand-black);
}
.home-path[href="projetos.html"] > *{
  max-width:58%;
}
.home-path[href="projetos.html"] > strong{
  display:block;
}
@media(min-width:651px){
  .home-page .home-path[href="projetos.html"]>p:not(.eyebrow){max-width:56%}
  .home-page .home-path[href="projetos.html"]>h2{max-width:56%;text-wrap:balance}
}
.home-path[href="projetos.html"]::before{
  content:"";
  position:absolute;
  inset:0 -45px 0 auto;
  width:49%;
  z-index:-1;
  background-image:url('assets/portfolio-miniatura-grafite.png');
  background-size:100% auto;
  background-position:center 40%;
  background-repeat:no-repeat;
  opacity:.76;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#00000040 18%,#000000a6 42%,#000000ed 70%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#00000040 18%,#000000a6 42%,#000000ed 70%,#000 100%);
}
@media(max-width:650px){
  .home-path[href="projetos.html"] > *{
    max-width:60%;
  }
  .home-path[href="projetos.html"]::before{
    right:-20px;
    width:42%;
  }
}




/* Ajustes mobile após as regras gerais. */
.mobile-menu-toggle{display:none}
.mobile-drawer{position:fixed;inset:0 0 0 auto;margin:0;width:min(340px,88vw);max-width:none;height:100dvh;max-height:none;padding:28px 24px;border:0;border-left:1px solid var(--brand-graphite);border-radius:0;background:var(--brand-black);color:var(--brand-white);overflow-y:auto;overscroll-behavior:contain}
.mobile-drawer::backdrop{background:#080608b8;backdrop-filter:blur(5px)}
.drawer-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:60px}
.drawer-top .wordmark{font-size:22px;letter-spacing:4px}.drawer-top .wordmark span{font-size:8px;letter-spacing:3px}
.drawer-close{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;background:transparent;border:1px solid var(--brand-graphite);border-radius:50%;color:var(--brand-white);font-size:28px}
.mobile-drawer nav{display:flex;flex-direction:column;align-items:stretch;gap:0;margin-top:20px}
.mobile-drawer nav a{display:flex;align-items:center;gap:16px;padding:24px 0;border-bottom:1px solid var(--brand-graphite);font-family:var(--font-heading);font-size:24px;font-weight:600}
.mobile-drawer nav a span:last-child{margin-left:auto;font-size:20px;color:var(--brand-orange)}
.mobile-drawer nav a[aria-current="page"]{color:var(--brand-orange)}
html:has(#mobile-menu[open]){overflow:hidden}
@media(max-width:650px){
  :root{--header-height:74px}
  .header{padding-left:24px;padding-right:20px}
  .header.mobile-nav-ready>nav,.header.mobile-nav-ready>.button{display:none}
  .header .wordmark{font-size:23px;letter-spacing:4px}.header .wordmark span{font-size:8px;letter-spacing:3px}
  .mobile-menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:46px;height:46px;padding:10px;border:1px solid var(--brand-graphite);border-radius:10px;background:var(--brand-black)}
  .mobile-menu-toggle span{display:block;width:22px;height:2px;background:var(--brand-white);border-radius:2px}
  .mobile-menu-toggle span:nth-child(2){width:16px;align-self:flex-end;margin-right:1px;background:var(--brand-orange)}
  .home-page .hero{min-height:calc(100svh - var(--header-height));padding:32px 24px 28px;gap:24px;grid-template-columns:1fr;align-content:center;align-items:center}
  .home-page .hero-copy{text-align:center;max-width:430px;margin:0 auto}
  .home-page .hero .eyebrow{justify-content:center;font-size:10px;letter-spacing:1.5px;margin-bottom:18px}
  .home-page .hero h1{font-size:clamp(34px,10.2vw,46px);line-height:1.07;letter-spacing:-1px;margin:0 0 20px;text-wrap:balance}
  .home-page .hero .intro{font-size:14px;line-height:1.8;max-width:330px;margin:0 auto 24px}
  .home-page .hero .primary{width:100%;max-width:310px;min-height:52px;border-radius:8px;justify-content:space-between;padding:16px 20px}
  .home-page .hero-art{min-height:0;height:auto;margin:0;align-self:start}
  .home-page .hero-art img{width:180px;max-width:55vw;height:auto}
}
@media(max-width:650px){
  .home-page .hero{padding:30px 26px 38px;gap:22px;align-content:center;grid-template-rows:auto auto}
  .home-page .hero-art{order:-1;justify-self:center;width:100%;height:190px;align-self:center;min-height:0;overflow:visible}
  .home-page .hero-art img{width:210px;max-width:65vw;max-height:190px;object-fit:contain}
  .home-page .hero-copy{text-align:left;width:100%;max-width:380px;margin:0 auto}
  .home-page .hero .eyebrow{display:none}
  .home-page .hero h1{font-size:clamp(34px,10.4vw,46px);line-height:1.06;letter-spacing:-1px;margin:0 0 18px;text-wrap:initial}
  .home-page .hero h1 em{white-space:nowrap}
  .home-page .hero .intro{font-size:14px;line-height:1.8;margin:0 0 24px;max-width:none}
  .home-page .hero .intro-desktop{display:none}.home-page .hero .intro-mobile{display:inline}
  .home-page .hero .primary{max-width:none;border-radius:10px;min-height:54px}
}
@media(max-width:650px) and (max-height:700px){.home-page .hero{gap:16px;padding:20px 24px 28px}.home-page .hero-art{height:140px}.home-page .hero-art img{width:155px;max-height:140px}.home-page .hero h1{font-size:36px}}
/* Encomendas no celular: introdução, etapas compactas e ação final. */
@media(max-width:650px){
  .home-page .custom{min-height:calc(100svh - var(--header-height));display:grid;grid-template-columns:minmax(0,1fr);align-content:center;align-items:start;gap:0;padding:34px 24px 90px}
  .home-page .home-order-copy{display:contents}
  .home-page .home-order-copy>.eyebrow{order:0;margin:0 0 14px;font-size:10px;letter-spacing:1.5px}
  .home-page .home-order-copy>h2{order:1;margin:0 0 14px;font-size:34px;line-height:1.08;letter-spacing:-.5px}
  .home-page .home-order-copy>p:not(.eyebrow){order:2;font-size:14px;line-height:1.8;margin:0 0 24px;max-width:none}
  .home-page .home-order-steps{order:3;display:grid;gap:10px;margin:0 0 24px;align-self:auto}
  .home-page .home-order-steps li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px;padding:16px;border:1px solid var(--brand-graphite);border-radius:12px;align-items:start}
  .home-page .home-order-steps li>span{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--brand-graphite);border-radius:8px;font-size:18px;line-height:1;color:var(--brand-orange)}
  .home-page .home-order-steps h3{margin:0 0 5px;font-size:16px;line-height:1.3}
  .home-page .home-order-steps li p{margin:0;font-size:13px;line-height:1.65}
  .home-page .home-order-copy>.contact{order:4;min-height:52px;width:100%;justify-content:space-between;padding:16px 20px;border-radius:8px;font-size:14px}
}
/* Cards da entrada mobile: texto e imagem em áreas independentes. */
@media(max-width:650px){
  .home-page .home-paths{gap:22px;padding:32px 20px 48px;min-height:auto}
  .home-page .home-path{position:relative;min-height:0;padding:28px 24px;border-radius:14px;justify-content:flex-start;align-items:stretch}
  .home-page .home-path .eyebrow{font-size:10px;letter-spacing:1.6px;margin:0 32px 18px 0}
  .home-page .home-path h2{font-size:28px;line-height:1.15;letter-spacing:-.4px;margin:0 0 18px;max-width:100%;text-wrap:balance}
  .home-page .home-path h2>span{position:absolute;top:25px;right:24px;font-size:23px;line-height:1}
  .home-page .home-path>p:not(.eyebrow),.home-page .home-path[href="projetos.html"]>p:not(.eyebrow){max-width:none;font-size:14px;line-height:1.85;margin:0 0 22px}
  .home-page .home-path>strong{display:flex;align-items:center;min-height:44px;padding-top:16px;border-top:1px solid var(--brand-graphite);font-size:13px}
  .home-page .home-path[href="projetos.html"]{min-height:320px;padding:28px 16px 28px 22px;justify-content:center}
  .home-page .home-path[href="projetos.html"]>*{max-width:56%}
  .home-page .home-path[href="projetos.html"]>.eyebrow{font-size:9px;letter-spacing:1.1px;margin-right:0}
  .home-page .home-path[href="projetos.html"]>h2{font-size:26px;text-wrap:initial}
  .home-page .home-path[href="projetos.html"]>p:not(.eyebrow){max-width:56%;font-size:13px;line-height:1.8}
  .home-page .home-path[href="projetos.html"]>strong{font-size:12px}
  .home-page .home-path[href="projetos.html"]::before{
    inset:0 0 0 auto;
    width:45%;
    height:auto;
    background-color:var(--brand-graphite);
    background-size:auto 130%;
    background-position:center;
    opacity:.88;
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,#00000080 18%,#000 42%,#000 100%);
    mask-image:linear-gradient(90deg,transparent 0%,#00000080 18%,#000 42%,#000 100%);
  }
}
/* Logo em marca-d'água na introdução. */
.home-page .hero{position:relative;isolation:isolate;grid-template-columns:1fr;background:var(--brand-black)}
.home-page .hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('assets/favicon-vulcani.svg') right center/clamp(520px,65vw,860px) auto no-repeat;mix-blend-mode:lighten;opacity:.14}
.home-page .hero-art{display:none}
.home-page .hero-copy{position:relative;z-index:1;max-width:650px}
@media(max-width:650px){
  .home-page .hero{grid-template-rows:auto;align-content:center;gap:0}
  .home-page .hero::before{background-size:118% auto;background-position:center 40%;opacity:.16}
  .home-page .hero-copy{max-width:380px}
}