/* Each header frame is sized by the controls it contains. */
.topbar{height:82px;display:flex;align-items:stretch;padding:0 8px 0 9px;gap:32px;background:none}
.topbar-left,.topbar-right{display:flex;align-items:center;position:relative;min-width:0;height:78px;background-repeat:no-repeat;background-size:100% 100%;gap:14px}
.topbar-left{flex:1;max-width:900px;padding:12px 36px 21px 26px;background-image:url(media/frame-header-left-v13.svg)}
.topbar-right{flex:0 0 auto;margin-left:auto;padding:12px 22px 21px 24px;background-image:url(media/frame-header-right-v13.svg);gap:20px}
.topbar .search{width:266px;height:38px;flex:0 1 266px;margin:0}
.topbar .top-nav{flex-shrink:0}
.topbar .profile{margin:0;min-width:142px;gap:10px;align-items:center}
.topbar .profile-mark{width:38px;height:38px;font-size:25px;box-shadow:0 0 0 3px #062033}
.topbar .profile small{font-size:11px}.topbar .profile strong{font-size:15px}.topbar .profile i{font-size:7px;letter-spacing:.5px}
.topbar .header-cta{min-height:38px;font-size:20px;padding:8px 14px;margin:0}
.topbar .header-cta svg{width:19px}

/* A fixed-height rail keeps the selected-row notch aligned at every viewport height. */
.sidebar{padding:0 0 24px;background-image:url(media/frame-sidebar-v13.svg);background-size:100% 940px;background-position:left top}
.sidebar .brand{height:110px;padding:27px 0 0;margin:0 23px;gap:10px}
.sidebar nav{margin:4px 12px 0;gap:0}
.sidebar nav a,.sidebar nav button{font-size:20px;gap:12px;min-height:54px;padding:9px 10px;white-space:nowrap}
.sidebar nav svg{width:22px;height:22px}
.sidebar nav .selected{min-height:56px}
.sidebar-bottom{margin-inline:21px;padding:22px 0 0}

.top-grid{grid-template-areas:"hero contact" "platforms contact";row-gap:2px}
.hero-composition{grid-area:hero;display:grid;grid-template-columns:minmax(0,1fr);container-type:inline-size;min-width:0;isolation:isolate}
.hero-video-banner,.campaign-overlay{grid-area:1/1}
.hero-video-banner:before{display:block;content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(90deg,#010d17aa,#010d1755 25%,transparent 48%);clip-path:polygon(2% 0,98% 0,100% 4%,100% 88%,98% 91.56%,2% 91.56%,0 88%,0 4%);pointer-events:none}
.campaign-overlay{position:relative;z-index:3;align-self:start;justify-self:start;margin:8.2cqw 0 0 2cqw;width:auto;max-width:50%;color:white}
.campaign-title{font-family:var(--geo);font-size:3.45cqw;font-weight:400;line-height:1.08;letter-spacing:0;text-shadow:0 2px 12px #0009;margin:0}
.campaign-line{display:flex;align-items:baseline;gap:.85cqw;white-space:nowrap}
.campaign-line strong{font:800 1em/1 var(--display);letter-spacing:0}
.campaign-line+.campaign-line{margin-top:1.1cqw}
.campaign-result{font-size:clamp(18px,2.35cqw,42px);gap:.6cqw}
.campaign-result strong{font-size:5.2cqw;color:var(--gold);letter-spacing:-.08cqw}
.campaign-actions{display:flex;align-items:center;gap:1cqw;margin-top:2.6cqw}
.campaign-actions .btn{font-size:clamp(15px,1.5cqw,23px);min-height:clamp(36px,3.8cqw,48px);padding:.85cqw .9cqw;gap:.6cqw}
.campaign-actions .btn svg{width:1.65cqw;height:1.65cqw}
.campaign-actions .btn-outline{background:#02111ecc}
.hero-platforms{grid-area:platforms;padding:4px 23px 12px}
.hero-platforms .platforms{margin:0;font-size:12px;gap:23px}
.hero-platforms .platforms b{font-size:21px}.hero-platforms .platforms .meta-mark{font-size:31px}.hero-platforms .platforms .play-mark{font-size:10px}

@media(max-width:1450px){
 .topbar{gap:16px}.topbar-left{padding-inline:23px 30px;gap:12px}.topbar .search{width:205px;flex-basis:205px}.topbar .top-nav a,.topbar .top-nav button{font-size:11px;padding-inline:7px}
 .topbar-right{padding-inline:20px;gap:14px}.topbar .profile{min-width:128px}.topbar .header-cta{font-size:18px;padding-inline:11px}
 .sidebar .brand{margin-inline:18px}.sidebar nav a,.sidebar nav button{font-size:18px;gap:10px}.sidebar nav svg{width:21px;height:21px}.sidebar-bottom{margin-inline:19px}
}
@media(max-width:1180px) and (min-width:981px){
 .topbar-left{max-width:440px}.topbar .search{width:100%;flex-basis:100%}
 .sidebar .brand{margin-inline:15px;gap:8px}.sidebar nav{margin-inline:10px}.sidebar nav a,.sidebar nav button{font-size:17px;padding-inline:8px;gap:8px}.sidebar nav svg{width:20px;height:20px}
}
@media(max-width:1180px) and (min-width:761px){
 .top-grid{grid-template-columns:minmax(0,1fr) 240px;grid-template-areas:"hero contact" "platforms contact";column-gap:14px}
 .campaign-overlay{margin-top:8cqw}.campaign-actions .btn{font-size:2.1cqw;padding:1cqw;min-height:4.5cqw}
 .contact-panel{padding:21px 19px}.contact-heading h2{font-size:30px}.contact-copy{font-size:11px}.chat-illustration{width:49px;height:49px}.chat-cta{font-size:19px}.hero-platforms{padding-left:18px}
}
@media(max-width:980px){
 .topbar{height:70px;padding:10px 14px;gap:14px;align-items:center;background:#02101cf5;border-bottom:1px solid #13435c}
 .topbar-left,.topbar-right{display:contents}.topbar .search{flex:0 1 260px;width:260px;margin-left:auto}.topbar .profile{display:none}.topbar .header-cta{margin-left:0}
 .sidebar .brand{margin-inline:24px}.sidebar nav{margin-inline:12px}.sidebar nav a,.sidebar nav button{font-size:20px;padding-inline:10px;gap:12px}.sidebar nav svg{width:22px;height:22px}
}
@media(max-width:760px){
 .top-grid{display:block}.hero-composition{display:block}.hero-video-banner:before{display:none}
 .campaign-overlay{margin:0;padding:19px 16px 8px;width:100%;max-width:none}
 .campaign-title{font-size:clamp(25px,6.8vw,37px);text-shadow:none}
 .campaign-line{gap:8px}.campaign-line+.campaign-line{margin-top:8px}
 .campaign-result{font-size:clamp(25px,6.8vw,37px)}.campaign-result strong{font-size:clamp(37px,10vw,54px);letter-spacing:-.4px}
 .campaign-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:19px}
 .campaign-actions .btn{font-size:23px;min-height:46px;padding:10px 9px;gap:7px}
 .campaign-actions .btn svg{width:19px;height:19px}
 .hero-platforms{padding:13px 16px 25px}.hero-platforms .platforms{font-size:12px;gap:21px}
 .topbar .search{width:180px;flex:0 1 180px;min-width:0}.topbar .header-cta{display:none}
 .video-toggle{width:28px;height:28px;font-size:17px}
}
@media(max-width:430px){.topbar{gap:9px;padding-inline:12px}.topbar .search{flex-basis:153px;width:153px}.campaign-actions .btn{font-size:21px}}
@media(max-width:350px){.campaign-overlay{padding-inline:11px}.campaign-title{font-size:24px}.campaign-result{font-size:24px}.campaign-result strong{font-size:35px}.campaign-actions{gap:7px}.campaign-actions .btn{font-size:18px;padding-inline:6px}.campaign-actions .btn svg{width:17px}.hero-platforms{padding-inline:11px}.hero-platforms .platforms{font-size:11px;gap:16px}}