/* =========================================================
   SEVEN7 CARS — V4 (motion, 3D, transições, proteção)
   Carregado só nas páginas públicas, DEPOIS do styles.css.
   O styles.css original continua igual (o painel ADM usa ele).
   ========================================================= */

:root{
  --ink:#050505;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
}

/* ---------- legibilidade: textos minúsculos sobem um pouco ---------- */
.main-nav a{font-size:11px}
.vehicle-spec-row small,.vehicle-bottom small,.detail-spec-grid small,.detail-price small{font-size:10px}
.vehicle-spec-row b,.detail-spec-grid b{font-size:12px}
.vehicle-eyebrow,.breadcrumbs,.footer-title{font-size:10px}
.tag{font-size:9px}
.footer-grid a,.footer-grid span:not(.footer-title),.footer-grid p{font-size:12px}
.feature-list span,.service-card p,.fact p,.content-list span{font-size:13px}
.stock-toolbar input,.stock-toolbar select{font-size:13px}
.field input,.field select,.field textarea{font-size:14px}
.field label{font-size:10px}

/* foco visível para teclado */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--orange);outline-offset:3px
}

/* ---------- carregamento inicial (só na 1ª visita da sessão) ---------- */
.s7-loader{
  position:fixed;inset:0;z-index:9000;display:grid;place-items:center;
  background:var(--ink);color:#fff;
  /* segurança: se o JS falhar, some sozinho em 4s */
  animation:s7LoaderFailsafe .01s linear 4s forwards;
}
.s7-loader svg{width:min(150px,32vw);height:auto;overflow:visible}
.s7-loader .s7-seven{fill:none;stroke:var(--orange);stroke-width:2.2;stroke-linejoin:round;
  stroke-dasharray:420;stroke-dashoffset:420;animation:s7Draw 1.1s var(--ease-io) .1s forwards}
.s7-loader .s7-seven-fill{fill:var(--orange);opacity:0;animation:s7Fill .45s ease 1.05s forwards}
.s7-loader-bar{position:absolute;left:50%;bottom:16vh;width:140px;height:2px;margin-left:-70px;background:rgba(255,255,255,.12);overflow:hidden}
.s7-loader-bar i{position:absolute;inset:0;background:var(--orange);transform:scaleX(0);transform-origin:left;animation:s7Bar 1.4s var(--ease-io) forwards}
.s7-loader.is-out{transform:translateY(-100%);transition:transform .9s var(--ease-io)}
html.s7-repeat .s7-loader{display:none}
@keyframes s7Draw{to{stroke-dashoffset:0}}
@keyframes s7Fill{to{opacity:1}}
@keyframes s7Bar{to{transform:scaleX(1)}}
@keyframes s7LoaderFailsafe{to{visibility:hidden;opacity:0;pointer-events:none}}

/* ---------- transição entre páginas (cortina) ---------- */
body::after{
  content:"";position:fixed;inset:0;z-index:8999;pointer-events:none;
  background:linear-gradient(180deg,var(--orange) 0 6px,var(--ink) 6px);
  transform:translateY(100%);
}
html.s7-from-nav body::after{transform:none}
html.s7-from-nav.s7-enter body::after{transform:translateY(-100%);transition:transform .75s var(--ease-io)}
html.s7-leaving body::after{transform:none;transition:transform .55s var(--ease-io);pointer-events:all}
html.s7-from-nav:not(.s7-enter) body::after{animation:s7CurtainFailsafe .01s linear 2.5s forwards}
@keyframes s7CurtainFailsafe{to{transform:translateY(-100%)}}

/* ---------- header ---------- */
.site-header{transition:transform .5s var(--ease-out),background .3s ease}
.site-header.is-hidden{transform:translateY(-100%)}
.site-header.is-scrolled{background:rgba(5,5,5,.92)}

/* ---------- títulos: revelação por máscara ---------- */
.s7-mask{display:block;overflow:hidden;padding:.16em 0 .06em;margin:-.16em 0 -.06em}
.s7-mask>span{display:block;transform:translateY(105%);transition:transform 1.05s var(--ease-out)}
.s7-mask.is-in>span{transform:none}

/* ---------- HERO com 3D ---------- */
.home-hero{background:radial-gradient(120% 90% at 78% 40%,#1a0d04 0%,#070605 45%,var(--ink) 75%)}
.hero-3d{display:none}
.hero-visual.has-3d{min-height:640px}
.hero-visual.has-3d .hero-3d{display:block;position:absolute;inset:-60px -80px -40px -40px;z-index:1;opacity:0;pointer-events:none}
.hero-3d canvas{display:block;width:100%;height:100%}
.hero-visual.has-3d .hero-vehicle-card{
  position:absolute;z-index:3;left:0;bottom:6px;width:min(340px,70%);
  transform:rotate(-2deg);border-radius:20px
}
.hero-visual.has-3d .hero-vehicle-card img{height:210px}
.hero-visual.has-3d .hero-float-label{left:18px;right:18px;bottom:16px}
.hero-visual.has-3d .hero-float-label h2{font-size:28px}
.hero-visual.has-3d .hero-float-label a{width:44px;height:44px;font-size:18px}
.hero-visual.has-3d .hero-stat{top:30px;right:0}
.hero-vehicle-card{background:#111}
#heroVehicleImage{opacity:0;transition:opacity .6s ease}
#heroVehicleImage.is-loaded{opacity:1}
.hero-vehicle-card:has(#heroVehicleImage:not(.is-loaded))::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,#111 30%,#1d1d1d 50%,#111 70%);background-size:300% 100%;
  animation:s7Shimmer 1.4s linear infinite
}
@keyframes s7Shimmer{to{background-position:-150% 0}}

/* intro do hero (orquestrada pelo motion.js) */
.s7-motion .hero-copy[data-reveal]{opacity:1;transform:none}
.s7-motion .hero-copy .section-kicker,
.s7-motion .hero-copy p,
.s7-motion .hero-copy .hero-actions,
.s7-motion .hero-copy .hero-search{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .9s var(--ease-out)}
.s7-motion.s7-ready .hero-copy .section-kicker{opacity:1;transform:none;transition-delay:.05s}
.s7-motion.s7-ready .hero-copy p{opacity:1;transform:none;transition-delay:.55s}
.s7-motion.s7-ready .hero-copy .hero-actions{opacity:1;transform:none;transition-delay:.7s}
.s7-motion.s7-ready .hero-copy .hero-search{opacity:1;transform:none;transition-delay:.85s}

/* ---------- seção Experiência: roda 3D ---------- */
.wheel-3d{display:none}
.premium-stage.has-3d .premium-card{display:none}
.premium-stage.has-3d .wheel-3d{display:block;position:absolute;inset:-40px -20px -20px -20px}
.wheel-3d canvas{display:block;width:100%;height:100%}
.premium-band:before{will-change:transform;transform:translateY(var(--s7-par,0))}

/* ---------- cards ---------- */
.s7-card-in{animation:s7CardIn .8s var(--ease-out) both}
@keyframes s7CardIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.vehicle-card .round-link{transition:background .25s,transform .35s var(--ease-out)}
.vehicle-card:hover .round-link{background:var(--orange);transform:rotate(45deg)}

.brand-marquee-wrap:hover .brand-marquee{animation-play-state:paused}

/* ---------- botões magnéticos ---------- */
.btn-primary{will-change:transform}
.btn-primary .s7-btn-label{display:inline-block;transition:transform .35s var(--ease-out)}

/* ---------- WhatsApp ---------- */
.whatsapp-float svg{width:28px;height:28px;fill:#fff}
.whatsapp-float{transition:transform .3s var(--ease-out)}
.whatsapp-float:hover{transform:scale(1.07)}

/* ---------- estoque ---------- */
.stock-sort{height:48px;border:1px solid #ddd;border-radius:13px;padding:0 12px;background:#fff;font-size:13px}
.stock-actions{display:flex;gap:8px}
@media(min-width:901px){
  .stock-toolbar{position:sticky;top:96px;z-index:20;background:rgba(255,255,255,.86);backdrop-filter:blur(16px)}
}

/* ---------- veículo: galeria em tela cheia ---------- */
.detail-main-image{cursor:zoom-in;touch-action:pan-y}
.detail-main-image img{transition:opacity .25s ease}
.gallery-zoom{position:absolute;z-index:3;left:18px;bottom:18px;height:34px;padding:0 13px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(0,0,0,.55);color:#fff;font-size:11px;font-weight:800;cursor:pointer}
.s7-lightbox{position:fixed;inset:0;z-index:9500;display:grid;grid-template-rows:auto 1fr auto;background:rgba(3,3,3,.97);color:#fff;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s}
.s7-lightbox.is-open{opacity:1;visibility:visible}
.s7-lb-top{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;font-size:12px;color:#aaa}
.s7-lb-close{width:44px;height:44px;border:1px solid #333;border-radius:50%;background:#111;color:#fff;font-size:20px;cursor:pointer}
.s7-lb-stage{position:relative;overflow:hidden;display:grid;place-items:center;touch-action:none}
.s7-lb-stage img{max-width:96vw;max-height:78vh;object-fit:contain;transition:transform .3s var(--ease-out);user-select:none}
.s7-lb-stage.is-zoomed img{cursor:zoom-out}
.s7-lb-stage .gallery-arrow{position:absolute}
.s7-lb-thumbs{display:flex;gap:8px;justify-content:center;overflow:auto;padding:14px}
.s7-lb-thumbs button{flex:0 0 74px;aspect-ratio:4/3;padding:0;border:2px solid transparent;border-radius:9px;overflow:hidden;background:#111;cursor:pointer;opacity:.55}
.s7-lb-thumbs button.active{border-color:var(--orange);opacity:1}
.s7-lb-thumbs img{width:100%;height:100%;object-fit:cover}
.detail-spec-grid div{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center}
.detail-spec-grid svg{grid-row:span 2;width:20px;height:20px;stroke:var(--orange);fill:none;stroke-width:1.6}
.s7-mobile-cta{display:none}
@media(max-width:900px){
  .s7-mobile-cta{position:fixed;left:12px;right:12px;bottom:12px;z-index:45;display:flex;gap:10px;align-items:center;justify-content:space-between;padding:10px 10px 10px 18px;border-radius:18px;background:rgba(10,10,10,.92);backdrop-filter:blur(14px);color:#fff;box-shadow:0 18px 40px rgba(0,0,0,.35);transform:translateY(140%);transition:transform .45s var(--ease-out)}
  .s7-mobile-cta.is-in{transform:none}
  .s7-mobile-cta b{display:block;font:700 22px var(--display)}
  .s7-mobile-cta small{color:#999;font-size:10px}
  .s7-mobile-cta .btn{min-height:46px}
  body.has-mobile-cta .whatsapp-float{bottom:92px}
}

/* ---------- proteção ---------- */
img{-webkit-user-drag:none;user-drag:none;-webkit-touch-callout:none}
.vehicle-media img,.detail-main-image img,.thumb img,.premium-card img,.split-hero img,.hero-vehicle-card img{user-select:none;-webkit-user-select:none}
.s7-guard{position:fixed;inset:0;z-index:99999;display:none;place-items:center;padding:30px;background:rgba(5,5,5,.96);color:#fff;text-align:center}
.s7-guard h2{margin:0 0 8px;font:700 40px var(--display);text-transform:uppercase}
.s7-guard p{max-width:420px;margin:0 auto;color:#999;font-size:14px;line-height:1.6}
html.s7-locked .s7-guard{display:grid}
html.s7-locked body>*:not(.s7-guard){filter:blur(14px)}

/* ---------- responsivo ---------- */
@media(max-width:900px){
  .hero-visual.has-3d{min-height:520px}
  .hero-visual.has-3d .hero-3d{inset:-20px -20px 120px -20px}
  .hero-visual.has-3d .hero-vehicle-card{left:auto;right:0;width:min(320px,82%)}
  .premium-stage.has-3d{min-height:440px}
}
@media(max-width:620px){
  .hero-visual.has-3d{min-height:470px}
  .hero-visual.has-3d .hero-vehicle-card img{height:180px}
  .hero-visual.has-3d .hero-stat{top:6px;left:0;right:auto;transform:rotate(-3deg)}
  .premium-stage.has-3d{min-height:360px}
}

/* ---------- movimento reduzido ---------- */
@media(prefers-reduced-motion:reduce){
  .s7-loader{display:none}
  body::after{display:none}
  .s7-mask>span{transform:none}
  .s7-motion .hero-copy *{opacity:1!important;transform:none!important}
}

/* compatibilidade com a rolagem suave */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
@media(max-width:620px){.hero-visual.has-3d .hero-stat{display:none}.hero-visual.has-3d .hero-3d{inset:-10px -20px 150px -20px}}
/* correção: o link "Editar no painel" aparecia para todos os visitantes */
.admin-edit-link[hidden],.admin-nav[hidden]{display:none!important}