:root{
  --accent:#f2c230;
  --bg:#0b0b0d;
  --bg-2:#111114;
  --panel:#151519;
  --panel-2:#1b1b20;
  --line:#2a2a31;
  --ink:#f4f5f7;
  --muted:#b2b5bd;
  --success:#24b36b;
  --danger:#f15b6c;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:linear-gradient(180deg,#09090b 0%,#101014 100%);color:var(--ink);font:15px/1.5 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a,button,input,select,textarea{-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
.wrap{max-width:1140px;margin:auto;padding:0 18px}
.muted{color:var(--muted)}
.small{font-size:12px}
.grow{flex:1}

.top{position:sticky;top:0;z-index:40;background:rgba(10,10,12,.84);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(242,194,48,.12)}
.nav{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;font-weight:800;min-width:0}
.logo img{width:124px;max-height:46px;object-fit:contain;border-radius:10px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:11px 16px;border-radius:14px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font-weight:700;text-decoration:none;transition:transform .18s ease,filter .18s ease,border-color .18s ease,background .18s ease;touch-action:manipulation}
.btn:hover{filter:brightness(1.05)}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#111}
.btn.green{background:var(--success);border-color:var(--success);color:#fff}
.btn.danger{background:transparent;color:#ffd5d9;border-color:#63353d}
.btn:disabled{opacity:.55;cursor:default}

.hero{position:relative;overflow:hidden;background:
  radial-gradient(circle at 20% 10%,rgba(242,194,48,.18),transparent 32%),
  radial-gradient(circle at 88% 26%,rgba(242,194,48,.11),transparent 25%),
  linear-gradient(180deg,#0b0b0d 0%,#121217 100%);
  border-bottom:1px solid rgba(242,194,48,.12)}
.hero::after{content:"";position:absolute;inset:auto -20% -120px auto;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(242,194,48,.10) 0%,rgba(242,194,48,0) 65%);pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:26px;align-items:center;min-height:470px;padding:34px 0 38px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;background:rgba(242,194,48,.12);border:1px solid rgba(242,194,48,.22);color:var(--accent);font-size:13px;font-weight:700}
.hero h1{font-size:clamp(37px,6vw,64px);line-height:1.02;letter-spacing:-.055em;margin:16px 0 14px}
.hero p{margin:0;font-size:17px;color:#d0d3d9;max-width:580px}
.cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.trust{display:flex;flex-wrap:wrap;gap:11px 14px;margin-top:18px;font-size:13px;color:#c7cad0}
.trust span{display:inline-flex;align-items:center;gap:6px}
.heropicture{display:grid;place-items:center;perspective:1400px;perspective-origin:center center;min-width:0;padding:4px 0}
.launch-stage{position:relative;width:min(100%,410px);height:min(520px,88vw);min-height:360px;isolation:isolate;pointer-events:none}
.stage-grid,.stage-glow,.orbit,.light-beam,.device-back,.device-front,.device-reflection,.spec-chip{position:absolute;will-change:transform,opacity}
.stage-grid{inset:10% 0 8% 0;border-radius:34px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.005));border:1px solid rgba(255,255,255,.07);box-shadow:inset 0 1px 0 rgba(255,255,255,.05);backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);overflow:hidden;transform:translateY(calc(10px * var(--scroll,0)))}
.stage-grid::before,.stage-grid::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:28px 28px,28px 28px;mask-image:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.02));-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.02))}
.stage-grid::after{transform:perspective(900px) rotateX(62deg) translateY(40%);opacity:.55}
.stage-glow.glow-a{inset:10% 8% auto 8%;height:46%;background:radial-gradient(circle at 50% 50%,rgba(255,81,115,.42),rgba(255,81,115,.08) 40%,rgba(255,81,115,0) 72%);filter:blur(30px);opacity:calc(.82 + (.12 * var(--scroll,0)));transform:translateY(calc(-16px * var(--scroll,0)))}
.stage-glow.glow-b{inset:auto 4% 2% 4%;height:32%;background:radial-gradient(circle at 50% 50%,rgba(242,194,48,.32),rgba(242,194,48,.06) 42%,rgba(242,194,48,0) 76%);filter:blur(22px);opacity:.9}
.light-beam{left:50%;top:4%;width:46%;height:92%;background:linear-gradient(180deg,rgba(255,255,255,.17),rgba(255,255,255,0) 24%,rgba(255,255,255,0));filter:blur(34px);transform:translateX(-50%) rotate(calc(-6deg + (12deg * var(--scroll,0))));opacity:calc(.28 + (.18 * var(--scroll,0)))}
.orbit{left:50%;top:47%;border-radius:50%;border:1.5px solid rgba(255,255,255,.12);transform-style:preserve-3d}
.orbit-a{width:72%;height:34%;transform:translate(-50%,-50%) rotateX(72deg) rotateZ(calc(18deg + (180deg * var(--scroll,0))));box-shadow:0 0 24px rgba(242,194,48,.16), inset 0 0 16px rgba(255,255,255,.04)}
.orbit-b{width:88%;height:46%;transform:translate(-50%,-50%) rotateX(74deg) rotateZ(calc(-26deg - (240deg * var(--scroll,0))));border-color:rgba(255,81,115,.2);opacity:.72}
.orbit::before{content:"";position:absolute;left:50%;top:-4px;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.95),rgba(255,255,255,.18) 64%,transparent 70%);transform:translateX(-50%);box-shadow:0 0 18px rgba(255,255,255,.5)}
.device-back{left:9%;bottom:3%;width:55%;filter:drop-shadow(0 24px 36px rgba(0,0,0,.42));transform:translate3d(calc(-10px - (34px * var(--scroll,0))),calc(18px - (16px * var(--scroll,0))),0) rotateZ(calc(-6deg - (18deg * var(--scroll,0)))) rotateY(calc(-10deg - (24deg * var(--scroll,0)))) scale(calc(.92 + (.07 * var(--scroll,0))))}
.device-back img{width:100%;display:block}
.device-front{right:5%;bottom:0%;width:58%;filter:drop-shadow(0 30px 42px rgba(0,0,0,.48));transform:translate3d(calc(10px + (20px * var(--scroll,0))),calc(0px - (22px * var(--scroll,0))),0) rotateZ(calc(4deg + (12deg * var(--scroll,0)))) rotateY(calc(6deg + (18deg * var(--scroll,0)))) scale(calc(.98 + (.05 * var(--scroll,0))))}
.device-front img{width:100%;display:block}
.device-reflection{left:50%;top:18%;width:68%;height:64%;transform:translateX(-50%) skewX(-14deg) rotate(-8deg) translateY(calc(-6px * var(--scroll,0)));background:linear-gradient(115deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.18) 38%,rgba(255,255,255,0) 48%);filter:blur(6px);mix-blend-mode:screen;opacity:calc(.22 + (.22 * var(--scroll,0)))}
.spec-chip{padding:9px 12px;border-radius:999px;background:rgba(9,11,16,.88);border:1px solid rgba(255,255,255,.12);color:#f7f8fa;font-size:12px;font-weight:800;letter-spacing:.02em;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 12px 22px rgba(0,0,0,.24)}
.spec-chip strong{color:var(--accent)}
.spec-chip.chip-a{left:0;top:14%;transform:translate3d(calc(-2px - (10px * var(--scroll,0))),calc(16px - (30px * var(--scroll,0))),0);opacity:calc(.15 + (.85 * var(--scroll,0)))}
.spec-chip.chip-b{right:1%;top:22%;transform:translate3d(calc(4px + (12px * var(--scroll,0))),calc(10px - (18px * var(--scroll,0))),0);opacity:calc(.1 + (.9 * var(--scroll,0)))}
.spec-chip.chip-c{left:8%;bottom:16%;transform:translate3d(calc(0px - (10px * var(--scroll,0))),calc(18px - (18px * var(--scroll,0))),0);opacity:calc(.12 + (.88 * var(--scroll,0)))}
.spec-chip.chip-d{right:3%;bottom:12%;transform:translate3d(calc(2px + (8px * var(--scroll,0))),calc(18px - (24px * var(--scroll,0))),0);opacity:calc(.12 + (.88 * var(--scroll,0)))}

section.mainbar{padding-top:20px}
h2{font-size:clamp(23px,3vw,29px);letter-spacing:-.03em;margin:0 0 8px}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0 16px}
.input{width:100%;min-height:46px;padding:12px 14px;border-radius:13px;border:1px solid var(--line);background:#121217;color:var(--ink);outline:none}
.input:focus{border-color:rgba(242,194,48,.55);box-shadow:0 0 0 3px rgba(242,194,48,.12)}
.filters input{flex:1 1 210px}
.filters select{flex:0 1 185px}
.products{display:grid;grid-template-columns:repeat(auto-fill,minmax(225px,1fr));gap:16px;margin:10px 0 44px}
.product{background:linear-gradient(180deg,#151519 0%,#17171d 100%);border:1px solid #25252d;border-radius:20px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.16);display:flex;flex-direction:column}
.product .photo{aspect-ratio:1/1;background:linear-gradient(180deg,#101015 0%,#18181e 100%);display:grid;place-items:center;position:relative}
.product .photo::after{content:"";position:absolute;left:16px;right:16px;bottom:10px;height:18px;border-radius:50%;background:radial-gradient(ellipse,rgba(242,194,48,.12) 0%,rgba(242,194,48,0) 70%)}
.product .photo img{width:100%;height:100%;object-fit:contain;padding:14px}
.flag{position:absolute;top:10px;left:10px;border-radius:999px;padding:5px 10px;background:rgba(17,17,20,.9);border:1px solid rgba(242,194,48,.16);color:#fff;font-size:11px;font-weight:800}
.product .content{padding:14px;display:flex;flex-direction:column;gap:4px;flex:1}
.product h3{font-size:18px;line-height:1.18;margin:4px 0 0}
.price{font-weight:900;font-size:25px;letter-spacing:-.04em;margin:7px 0 2px;color:var(--accent)}
.actions{display:flex;gap:8px;margin-top:auto;padding-top:12px}
.actions .btn{flex:1;font-size:13px;padding:9px 6px;min-height:40px}

footer{background:#09090b;border-top:1px solid rgba(242,194,48,.12);color:#b0b4be;padding:34px 0 calc(30px + env(safe-area-inset-bottom))}

.overlay{position:fixed;inset:0;z-index:45;background:rgba(0,0,0,.72);display:grid;place-items:center;padding:12px;overscroll-behavior:contain}
.dialog{width:min(100%,670px);background:#121217;border:1px solid #24242c;border-radius:22px;overflow:auto;max-height:92vh;max-height:92svh;max-height:92dvh;box-shadow:0 24px 70px rgba(0,0,0,.46);-webkit-overflow-scrolling:touch}
.dialog .head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid #202028;background:#121217;position:sticky;top:0;z-index:2}
.head h2{font-size:20px;margin:0}
.iconbtn{width:40px;height:40px;border-radius:50%;border:0;background:#1f1f26;color:#fff;font-size:24px}
.detailphoto{position:relative;background:linear-gradient(180deg,#0f0f13 0%,#15151b 100%);height:min(41dvh,360px);display:grid;place-items:center;cursor:zoom-in}
.detailphoto img{width:100%;height:100%;object-fit:contain;padding:12px 16px}
.zoomhint{position:absolute;right:16px;bottom:14px;background:rgba(255,255,255,.92);color:#111;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700}
.detailbody{padding:16px 16px 18px}
.detailbody h2{margin:0 0 2px;font-size:24px}
.detailbody .price{font-size:30px;margin-top:5px}
.spec{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}
.spec div{background:#191922;border:1px solid #24242c;padding:9px 10px;border-radius:12px;font-size:13px}
.spec strong{display:block;margin-top:2px;color:#fff}
.viewer{position:fixed;inset:0;z-index:80;background:rgba(5,5,7,.96);display:grid;place-items:center;overflow:hidden;touch-action:none}
.viewer img{max-width:95vw;max-height:88vh;max-height:88svh;max-height:88dvh;object-fit:contain;transform-origin:center;touch-action:none;user-select:none}
.viewer .close{position:absolute;right:14px;top:calc(14px + env(safe-area-inset-top));z-index:3;width:46px;height:46px;border:0;border-radius:50%;background:#fff;color:#111;font-size:26px}

#toast:not(:empty){position:fixed;left:50%;transform:translateX(-50%);bottom:calc(18px + env(safe-area-inset-bottom));background:#18181f;color:#fff;padding:12px 16px;border-radius:12px;z-index:99;max-width:90vw;text-align:center;border:1px solid rgba(242,194,48,.16)}

.adminpage{padding:24px 0 54px}
.adminhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.panel{background:#121217;border:1px solid #25252d;border-radius:18px;padding:18px;margin:14px 0}
.warning{background:#2a2410;border:1px solid #6b5717;color:#ffe9a5;padding:14px;border-radius:12px}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.adminlist{display:grid;gap:10px}
.adminitem{display:flex;align-items:center;gap:14px;border:1px solid #25252d;border-radius:16px;padding:10px;background:#16161c}
.adminitem img{width:64px;height:64px;border-radius:10px;object-fit:contain;background:#0f0f13}
.adminitem .info{flex:1;min-width:0}
.adminitem .buttons{display:flex;gap:7px;flex-wrap:wrap}
.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field{display:grid;gap:4px;font-size:13px;font-weight:700}
.field.full{grid-column:1 / -1}
.field textarea{min-height:82px}
.hint{font-size:12px;color:#a9adb7}
.previewpics{display:flex;gap:8px;flex-wrap:wrap}
.previewpics img{width:88px;height:88px;object-fit:contain;background:#18181e;border-radius:10px;border:1px solid #25252d}
.footnote{font-size:13px;color:#adb1bb;margin-top:10px}

@media (max-width: 760px){
  .wrap{padding:0 14px}
  .nav{min-height:60px}
  .logo img{width:112px;max-height:42px}
  .nav .btn{padding:9px 12px;min-height:42px;font-size:12px}
  .hero-grid{grid-template-columns:1fr;gap:10px;padding:22px 0 18px;min-height:0;text-align:center}
  .hero h1{font-size:clamp(34px,10vw,46px);margin:14px 0 12px}
  .hero p{font-size:15px;max-width:none}
  .cta{justify-content:center}
  .trust{justify-content:center;gap:8px 12px;font-size:12px}
  .heropicture{order:2;padding-top:6px}
  .launch-stage{width:min(88vw,360px);height:min(470px,112vw);min-height:320px}
  .stage-grid{inset:11% 2% 10% 2%}
  .device-back{left:6%;width:55%}
  .device-front{right:2%;width:60%}
  .spec-chip{font-size:11px;padding:8px 10px}
  .products{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .product .photo img{padding:10px}
  .product .content{padding:11px;gap:3px}
  .product h3{font-size:15px}
  .price{font-size:20px}
  .actions{flex-direction:column;gap:6px}
  .actions .btn{width:100%}
  .filters{margin:16px 0 14px}
  .filters select{flex:1 1 132px}
  .overlay{padding:10px}
  .dialog{border-radius:18px;max-height:88vh;max-height:88svh;max-height:88dvh}
  .dialog .head{padding:11px 13px}
  .detailphoto{height:clamp(230px,39dvh,350px)}
  .zoomhint{right:12px;bottom:12px;font-size:11px}
  .detailbody{padding:14px}
  .detailbody h2{font-size:22px}
  .detailbody .price{font-size:28px}
  .spec{grid-template-columns:1fr 1fr;gap:7px}
  .spec div{padding:8px 9px}
  .adminpage{padding-top:18px}
  .panel{padding:14px}
  .adminitem{align-items:flex-start;flex-wrap:wrap}
  .adminitem .buttons{width:100%}
  .formgrid{grid-template-columns:1fr}
  .field.full{grid-column:auto}
}
@media (max-width: 390px){
  .products{grid-template-columns:1fr 1fr}
  .hero h1{font-size:32px}
  .detailphoto{height:215px}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .btn{transition:none}
  .device-back,.device-front,.orbit,.spec-chip,.light-beam,.stage-grid{transform:none !important}
}


/* Cabeçalho harmonizado com o preto exato do fundo da logo enviada. */
.top{background:#010204 !important;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid #202024}
.nav{gap:10px}
.nav-actions{display:flex;align-items:center;gap:8px;margin-left:auto}
.social-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:44px;min-height:44px;padding:9px 12px;border-radius:13px;border:1px solid #34343a;background:#111114;color:#fff;text-decoration:none;font-size:13px;font-weight:750;touch-action:manipulation}
.social-link svg{width:21px;height:21px;flex:none}
.social-link.ig{border-color:#57412c}
.social-link.wa{background:#1c9657;border-color:#1c9657;color:#fff}
.social-link:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:760px){.nav{min-height:66px}.nav-actions{gap:7px}.social-link{padding:9px;min-width:45px;min-height:45px}.social-label{display:none}.logo img{max-width:112px;max-height:47px}}
@media(max-width:360px){.wrap{padding-left:12px;padding-right:12px}.logo img{max-width:98px}.nav-actions{gap:5px}.social-link{min-width:42px;min-height:42px}}


/* Hero corrigido: composição original inteira, sem recortar os aparelhos. */
.launch-stage{height:clamp(390px,43vw,540px);min-height:390px;overflow:visible}
.device-combo{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;pointer-events:none;transform:translate3d(0,calc(-12px * var(--scroll,0)),0) rotate(calc(-3deg * var(--scroll,0)));transform-origin:center center;will-change:transform;filter:drop-shadow(0 24px 32px rgba(0,0,0,.4))}
.device-combo img{display:block;width:100%;height:100%;max-height:100%;object-fit:contain;user-select:none;-webkit-user-select:none}
.device-reflection{z-index:4;pointer-events:none;opacity:.1}
.orbit,.stage-glow,.light-beam{pointer-events:none}
.spec-chip{z-index:6}
@media(max-width:760px){.launch-stage{width:min(94vw,390px);height:clamp(330px,99vw,450px);min-height:330px}.device-combo{inset:3% 0 4%}}
@media(max-width:390px){.launch-stage{height:clamp(300px,100vw,390px);min-height:300px}}
@media(prefers-reduced-motion:reduce){.device-combo{transform:none!important}}

.detail-firstline{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 14px;background:#17171b;color:#fff;border-bottom:1px solid #29292d;font-size:14px}.detail-firstline span{color:var(--accent);font-weight:800;white-space:nowrap}
/* Gustavo iPhones V7: navegação móvel confiável e detalhes com foto contida */
@media(max-width:760px){
  .overlay{padding:8px!important;align-items:center!important}
  .dialog{width:100%!important;max-width:500px!important;max-height:84vh!important;max-height:84svh!important;max-height:84dvh!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;border-radius:18px!important;-webkit-overflow-scrolling:touch}
  .dialog .head{position:sticky;top:0;z-index:5;padding:10px 14px!important;min-height:52px}
  .detailphoto{position:relative!important;width:100%!important;height:205px!important;min-height:0!important;max-height:205px!important;overflow:hidden!important;display:flex!important;justify-content:center;align-items:center}
  .detailphoto img{display:block!important;position:static!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center!important;padding:8px 18px!important;transform:none!important}
  .detailbody{padding:12px 14px 20px!important}
  .detailbody h2{font-size:19px!important;line-height:1.25!important;margin:0!important}
  .detailbody .price{font-size:25px!important;margin:3px 0!important}
  .detailbody p{margin:5px 0 9px}
  .spec{margin:10px 0!important;gap:7px!important}
  .spec div{padding:8px 9px!important;min-width:0;overflow-wrap:anywhere}
  .zoomhint{bottom:7px!important;right:9px!important;font-size:10px!important}
  .launch-stage{isolation:auto;transform:none}
  .stage-grid::before,.stage-grid::after,.device-reflection{display:none!important}
  .stage-glow{filter:none!important;opacity:.26!important}
  .light-beam{display:none!important}
  .device-combo{filter:none!important}
  .stage-grid,.stage-glow,.orbit,.light-beam,.device-combo,.spec-chip{will-change:auto!important}
}
@media(max-width:390px){.detailphoto{height:180px!important;max-height:180px!important}.dialog{max-height:82dvh!important}.spec div{font-size:12px!important}}
@supports not (height: 1dvh){.dialog{max-height:84vh!important}}

/* Título mais compacto, com destaque em amarelo para iPhone */
.hero h1{font-size:clamp(33px,4.2vw,50px);line-height:1.1;letter-spacing:-.04em;max-width:630px}
.hero h1 .headline-accent{color:#f2c230}
@media(max-width:760px){.hero h1{font-size:clamp(28px,7.4vw,35px);line-height:1.12;letter-spacing:-.035em;margin:12px 0}}
@media(max-width:390px){.hero h1{font-size:clamp(27px,7.2vw,30px)}}