:root { --navy:#061832; --yellow:#ffd400; --cyan:#00d7f4; }
.topbar { height:58px; }
.nav { height:38px; }
.navin { justify-content:space-between; gap:12px; }
.depart,.affiliate { padding:7px 15px; }
.brand-mark { flex:none; border:0; box-shadow:none; width:48px; height:48px; background:url("./marca.svg") center / contain no-repeat; }
.brand-mark::after { content:none; }
.control-brand img { width:38px; height:38px; vertical-align:middle; }
.brand-name { font-style:italic; }
.wrap { padding-top:5px; }
.hero-grid { grid-template-columns:215px minmax(0,1fr); }
.departments { padding:4px 8px; }
.departments h3 { margin:5px 8px; }
.dept { padding:5px 8px; }
.hero { min-height:184px; padding:16px clamp(22px,8vw,105px); background:radial-gradient(ellipse at 73% 85%,#0d58a9,#031734 53%); }
.hero h1 { font-size:clamp(26px,3.2vw,45px); font-style:italic; text-transform:uppercase; }
.hero p { margin:5px 0 10px; }
.hero::after { width:250px; height:250px; top:0; right:10%; border:4px solid #ffd400; box-shadow:0 0 25px #ffa300,inset 0 0 25px #ffa300; opacity:.75; }
.hero-product { font-size:clamp(42px,8vw,112px); white-space:nowrap; }
.benefits { margin-top:3px; padding:6px; }
.section-head { margin:11px 4px 7px; }
.cat { border:1px solid #edf0f4; background:linear-gradient(130deg,#fff,#edf0f4); padding:7px 4px; }
.cat[aria-pressed=true] { outline:2px solid #0074c8; }
.card { border:1px solid #e3e9f3; padding:8px; }
.card h3 { height:auto; min-height:30px; }
.product-img { height:78px; font-size:47px; }
.market { display:block; margin-top:4px; padding:5px 3px; color:#071832; }
.market.shp,.market.tt { color:#fff; }
.fav { background:white; border-radius:50%; z-index:1; }
.catalog-status { margin:4px; color:#45546e; font-size:12px; }
.catalog-status:empty { display:none; }
.controlbar { position:sticky; top:0; z-index:3; }
.control-layout { grid-template-columns:260px minmax(0,1fr); }
.sidebar { position:sticky; top:62px; align-self:start; min-height:calc(100vh - 62px); }
.controlmain { min-width:0; padding:16px 20px 70px; background:radial-gradient(at 57% 0,#231a64,transparent 32%),#041020; }
.control-grid { grid-template-columns:1.4fr 1fr .9fr; }
.panel { min-width:0; min-height:0; background:linear-gradient(145deg,#0b2848,#041423); border-color:#22a7cf; box-shadow:inset 0 0 14px #00bbff20; }
.panel:nth-child(-n+3) { min-height:210px; }
.metric:nth-child(1) { background:linear-gradient(125deg,#09523c,#061829); }
.metric:nth-child(3) { background:linear-gradient(125deg,#482073,#061829); }
.metric strong { overflow-wrap:anywhere; }
.metric .up { display:inline-block; color:#b8cde2; background:#132943; }
.chart-empty { min-height:130px; display:grid; place-items:center; color:#a8c3dd; text-align:center; }
.donut.empty { background:#193650; }
.donut.empty::after { content:'Sem dados'; font-size:11px; }
.control-notice { color:#a8c3dd; font-size:13px; }
.side-link { cursor:pointer; }
button:focus-visible,a:focus-visible,input:focus-visible { outline:3px solid #0ca9e9; outline-offset:2px; }
.store { background:#f8f9fc; }
.store .topbar,.store .navin { max-width:1312px; padding-inline:clamp(16px,4vw,64px); }
.store .topbar { gap:clamp(14px,4vw,70px); }
.store .brand-name { font-size:34px; line-height:1; }
.store .tagline { font-size:11px; margin-top:3px; }
.store .search { height:37px; max-width:480px; }
.store .account { margin-left:auto; }
.store .account .cta { color:#fff; background:transparent; }
.store .wrap { padding-inline:16px; }
.store .hero-grid { gap:9px; }
.store .hero { background-color:#031737; padding-left:clamp(20px,9.4vw,155px); }
.store .hero > :first-child { position:relative; z-index:2; }
.store .hero h1 { line-height:.92; margin-block:8px; }
.store .hero h1 em { color:var(--yellow); font-size:1.16em; }
.store .hero p { font-size:12px; }
.store .hero .cta { padding:7px 15px; font-size:12px; }
.store .hero:after { z-index:0; }
.store .hero { background-image:url("./hero.png"); background-size:cover; background-position:center; }
.store .hero:after { content:none; }
.product-img { background:#f7f7f8; }
.product-img::before,.video-img::before { content:""; width:77px; aspect-ratio:1; background-image:url("./produtos.png"); background-size:300% 200%; background-position:var(--product-x,0%) var(--product-y,0%); border-radius:6px; }
.photo-1,.photo-4 { --product-x:50%; }
.photo-2,.photo-5 { --product-x:100%; }
.photo-3,.photo-4,.photo-5 { --product-y:100%; }
.video-img { height:65px; background:linear-gradient(135deg,#c8b5a1,#e5e8ec); overflow:hidden; }
.video-img::before { width:65px; }
.store .video-row { margin-top:10px; }
.store .video-main { min-height:117px; padding:12px 22px; }
.store .video-main .play { font-size:54px; }
.sidebar-brand { display:flex; align-items:center; gap:8px; margin:0 0 13px; font-weight:900; font-style:italic; font-size:29px; line-height:1; }
.sidebar-brand img { width:59px; height:59px; }
.sidebar-brand span,.sidebar-brand small { color:var(--cyan); }
.sidebar-brand small { display:block; font-size:19px; margin-top:3px; }
.control-title p { margin:4px 0 8px; }
.control-notice { margin:0 0 10px; }
.metric { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:3px 13px; padding:12px; }
.metric strong { margin:0; }
.metric .up { justify-self:start; }
.metric-icon { grid-row:span 3; display:grid; place-items:center; width:48px; aspect-ratio:1; color:#e1faff; font-size:26px; font-weight:800; border-radius:12px; background:#0b93ba; box-shadow:inset 0 0 12px #a0f1ff66; }
.metric:nth-child(1) .metric-icon { background:#00894e; }
.metric:nth-child(2) .metric-icon { background:#075bb2; }
.metric:nth-child(3) .metric-icon { background:#8424ca; }
.chart-legend { display:flex; justify-content:flex-end; gap:12px; font-size:11px; color:#35dbf0; }
.chart-legend span:nth-child(2) { color:#ee8dff; }
.chart-empty { border-left:1px solid #39618a; margin:12px 0 4px 8px; background:repeating-linear-gradient(to top,transparent 0 30px,#1a3b5d 31px,#1a3b5d 32px); }
.market-chart { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:10px; }
.donut { width:min(100%,155px); height:auto; aspect-ratio:1; margin:0; }
.share-legend { display:grid; gap:7px; font-size:11px; }
.share-legend div { display:grid; grid-template-columns:10px 1fr auto; align-items:center; gap:5px; }
.share-legend i { border-radius:50%; width:9px; height:9px; }
.integration-tiles { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:5px; }
.integration-tiles div,.campaign-panel .list { background:#0c2942; border:1px solid #29658a; border-radius:8px; text-align:center; padding:6px 2px; }
.integration-tiles span,.integration-tiles small { display:block; font-size:10px; }
.integration-tiles small { color:#a9c5dc; }
.integration-tiles strong { font-size:17px; line-height:1.6; }
.campaign-panel .list { display:inline-grid; width:32%; min-height:65px; align-content:center; gap:5px; margin-right:1%; }
.ai-preview { display:flex; align-items:center; gap:8px; }
.ai-preview > span { display:grid; place-items:center; width:48%; aspect-ratio:1.6; border-radius:9px; font-size:30px; font-weight:900; color:#3ff0ff; background:radial-gradient(circle at 40% 55%,#173ea7,#201461 52%,#060d28); }
.ai-preview ul { margin:0; padding-left:18px; font-size:11px; line-height:1.7; }
.video-panel p { color:#a8c3dd; font-size:12px; }
@media(min-width:1200px) {
  .control-layout { grid-template-columns:270px minmax(0,1fr); }
  .control-grid { grid-template-columns:repeat(36,minmax(0,1fr)); grid-template-rows:160px 66px 130px minmax(180px,auto); gap:10px; }
  .control-grid .sales-panel { grid-area:1 / 1 / 3 / 17; }
  .control-grid .share-panel { grid-area:1 / 17 / 3 / 28; }
  .control-grid .goal-panel { grid-area:1 / 28 / 2 / 37; min-height:0; }
  .control-grid .alerts-panel { grid-area:2 / 28 / 4 / 37; }
  .control-grid .integration-panel { grid-area:3 / 1 / 4 / 16; }
  .control-grid .campaign-panel { grid-area:3 / 16 / 4 / 28; }
  .control-grid .video-panel { grid-area:4 / 1 / 5 / 11; }
  .control-grid .products-panel { grid-area:4 / 11 / 5 / 26; }
  .control-grid .finance-panel { grid-area:4 / 26 / 5 / 37; }
  .control-grid .products-panel[style] { grid-column:11 / 26!important; }
}
@media(max-width:1000px) {
  .hero-grid { grid-template-columns:1fr; }
  .control-layout { grid-template-columns:175px minmax(0,1fr); }
  .control-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:620px) {
  .topbar { height:auto; }
  .search input { min-width:0; }
  .hero { min-height:190px; padding:16px; }
  .hero::after { width:130px; height:130px; right:2%; top:30%; }
  .control-layout,.control-grid { grid-template-columns:minmax(0,1fr); }
  .control-grid .panel { grid-column:auto!important; }
  .control-search { display:none; }
  .controlbar { gap:6px; justify-content:space-between; }
  .controlmain { padding-inline:12px; }
  .control-title { flex-wrap:wrap; margin-bottom:10px; }
  .store .topbar { gap:10px; }
  .store .search { max-width:none; }
  .store .hero { padding-left:16px; }
  .store .hero { background-image:linear-gradient(90deg,#031832 22%,transparent 95%),url("./hero.png"); background-position:65% center; }
  .metric { gap:4px; grid-template-columns:1fr; }
  .metric-icon { grid-row:auto; width:30px; font-size:17px; }
}
@media(max-width:1000px) { .departments.is-open { display:block; } }