:root{font-family:'Cairo',system-ui,sans-serif;--ease:cubic-bezier(.16,1,.3,1);font-synthesis:none;scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,textarea,select{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}img,video{display:block;max-width:100%}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--a);outline-offset:3px}::selection{background:var(--a);color:var(--on-a)}
html[data-theme="light"]{--bg:#f2f2ed;--surface:#fffefa;--surface2:#e9ede9;--ink:#101b18;--muted:#61736b;--edge:#d5ddd6;--glass:rgba(255,255,255,.72);--overlay:rgba(12,21,19,.67);--cardshadow:0 20px 55px rgba(14,25,23,.07)}html[data-theme="dark"]{--bg:#111716;--surface:#1c2522;--surface2:#29332f;--ink:#f7f8f3;--muted:#a9b9b0;--edge:#34413b;--glass:rgba(36,46,43,.74);--overlay:rgba(4,7,6,.77);--cardshadow:0 18px 60px rgba(0,0,0,.22)}html[data-space="portal"]{--a:#c5fb8d;--on-a:#17230b;--second:#ff9982;--deep:#14211a}html[data-space="business"]{--a:#79e5d0;--on-a:#082a25;--second:#53a7ad;--deep:#07332f}html[data-space="marketing"]{--a:#dbff5f;--on-a:#28210d;--second:#e7aaff;--deep:#2b183c}html[data-space="marketing"][data-theme="light"]{--bg:#f9f5ff;--surface:#fffefe;--surface2:#ede5f5;--ink:#291737;--muted:#796c82;--edge:#e3d8ed;--glass:rgba(255,255,255,.8)}html[data-space="marketing"][data-theme="dark"]{--bg:#130e1d;--surface:#24182e;--surface2:#332441;--ink:#fbf4ff;--muted:#c6b9d1;--edge:#473350;--glass:rgba(46,32,58,.8)}html[data-space="business"][data-theme="light"]{--bg:#eef7f1;--surface:#fbfefa;--surface2:#e0f0e9;--ink:#112b27;--muted:#546e66;--edge:#d0e4dc;--glass:rgba(250,255,251,.8)}html[data-space="business"][data-theme="dark"]{--bg:#061d1a;--surface:#10312b;--surface2:#1c413a;--ink:#ebfff7;--muted:#afcfc2;--edge:#30574c;--glass:rgba(20,55,47,.78)}
body{background:var(--bg);color:var(--ink);transition:background .35s,color .35s}#app{min-height:100vh}.shell{min-height:100vh;overflow:clip}.site-topbar{z-index:40;position:sticky;top:14px;margin:14px auto 0;width:min(1440px,calc(100% - 42px));padding:10px 14px 10px 20px;border:1px solid var(--edge);border-radius:100px;background:var(--glass);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);display:flex;align-items:center;justify-content:space-between;gap:20px;box-shadow:var(--cardshadow)}.brand-logo{display:flex;align-items:center;gap:8px;direction:ltr;font-family:Manrope,system-ui,sans-serif;font-size:18px;letter-spacing:-1px;font-weight:800;line-height:1}.brand-emblem{font-size:29px;font-weight:900;letter-spacing:-4px;transform:skew(-8deg);display:inline-block;color:var(--ink)}.brand-dot{color:var(--a)}.brand-caption{display:block;font-size:7px;letter-spacing:2px;font-weight:700;margin-top:5px;color:var(--muted)}.desktop-links{display:flex;align-items:center;gap:clamp(12px,2vw,34px)}.desktop-links a{font-size:12px;font-weight:800;transition:color .2s}.desktop-links a:hover{color:var(--second)}.nav-actions{display:flex;align-items:center;gap:7px}.control{border-radius:50%;width:40px;height:40px;display:grid;place-items:center;background:var(--surface2);color:var(--ink);border:1px solid var(--edge);transition:transform .2s,background .2s;color:var(--ink)}.control:hover{transform:rotate(-10deg) scale(1.05);background:var(--a);color:var(--on-a)}.control.language{font-size:14px;font-weight:800}.header-cta{background:var(--ink);color:var(--bg);border-radius:100px;padding:11px 17px;display:flex;align-items:center;gap:12px;font-size:11px;font-weight:900;transition:background .25s,color .25s}.header-cta:hover{background:var(--a);color:var(--on-a)}.menu-toggle{display:none}.mobile-nav{display:none}
.micro-label,.eyebrow,.tiny-label,.option-sublabel{font-family:Manrope,'Cairo',sans-serif;font-size:11px;font-weight:800;letter-spacing:2px}.micro-label{color:var(--muted)}.section-pad{padding:clamp(65px,9vw,145px) max(5vw,24px);max-width:1600px;margin-inline:auto}.section-head{display:flex;flex-direction:column;gap:14px;margin-bottom:clamp(26px,4vw,58px)}.section-head h2{font-size:clamp(37px,5.6vw,87px);line-height:1.15;letter-spacing:-2.5px;margin:0;font-weight:900}.section-head p{color:var(--muted);font-size:clamp(14px,1.4vw,19px);max-width:700px;line-height:1.9;margin:0}.section-head .micro-label span{color:var(--second)}.pill{border-radius:100px;display:inline-flex;align-items:center;justify-content:space-between;gap:25px;padding:15px 22px;font-size:13px;font-weight:900;border:1px solid var(--edge);background:var(--surface);color:var(--ink);transition:transform .3s var(--ease),background .2s,border .2s;min-height:52px}.pill:hover{transform:translateY(-4px);border-color:var(--a)}.pill .arrow-char{font-family:Manrope,sans-serif;background:var(--surface2);width:27px;height:27px;border-radius:50%;display:grid;place-items:center;font-size:16px}.pill.prime{background:var(--a);color:var(--on-a);border-color:var(--a)}.pill.prime .arrow-char{background:rgba(0,0,0,.13)}.pill.outline{background:transparent;border-color:currentColor}.cta-group{display:flex;align-items:center;flex-wrap:wrap;gap:11px}.reveal{opacity:0;transform:translateY(24px);transition:opacity .85s var(--ease),transform .85s var(--ease)}.reveal.visible{opacity:1;transform:translateY(0)}
/* GATEWAY — cinematic rounded split, distinct from all other pages */
.gateway{padding:0 3vw 20px;min-height:calc(100svh - 100px);position:relative}.gateway-ambient{position:absolute;inset:3% 0 auto;pointer-events:none;opacity:.4;height:390px;background:radial-gradient(ellipse at 28% 10%,#6ddfa122,transparent 55%),radial-gradient(ellipse at 80% 60%,#dc7bce22,transparent 50%)}.gateway-intro{text-align:center;max-width:1020px;margin:clamp(34px,6vw,90px) auto 34px;position:relative}.tiny-label{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--muted)}.eyedot{height:8px;width:8px;background:var(--a);border-radius:50%}.gateway-intro h1{font-size:clamp(47px,8.5vw,135px);letter-spacing:-5px;line-height:1.14;font-weight:900;margin:17px auto 20px}.gateway-intro h1 em{font-style:normal;color:#79b99d}html[data-theme="dark"] .gateway-intro h1 em{color:var(--a)}.gateway-intro p{font-size:clamp(13px,1.55vw,19px);color:var(--muted);line-height:1.8;max-width:720px;margin:auto}.gateway-options{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:1480px;margin:auto}.gateway-option{min-height:clamp(345px,34vw,570px);isolation:isolate;border-radius:clamp(30px,5vw,85px);position:relative;overflow:hidden;display:flex;align-items:stretch;color:#fff;transition:transform .6s var(--ease),border-radius .6s var(--ease)}.gateway-option:hover{transform:translateY(-8px);border-radius:45px}.gateway-shot,.gateway-overlay{position:absolute;inset:0;z-index:-2}.gateway-shot{background-position:center;background-size:cover;transform:scale(1.06);transition:transform 1.5s var(--ease);animation:gentle-pan 20s ease-in-out infinite alternate}.gateway-option:hover .gateway-shot{transform:scale(1.16)}.gateway-overlay{z-index:-1;background:linear-gradient(0deg,rgba(6,10,11,.94),rgba(6,10,11,.07) 83%)}.creative-option .gateway-overlay{background:linear-gradient(0deg,rgba(30,9,38,.96),rgba(55,21,60,.08) 80%)}.option-index{position:absolute;top:32px;inset-inline-start:36px;font:700 12px Manrope;letter-spacing:3px}.gateway-option-content{padding:clamp(23px,4vw,65px);align-self:end;width:100%;display:flex;align-items:flex-end;justify-content:space-between;gap:15px}.option-symbol{font:900 clamp(68px,11vw,170px) Manrope;letter-spacing:-18px;opacity:.45;line-height:1}.gateway-option-content h2{font-size:clamp(31px,3.7vw,58px);line-height:1.2;white-space:normal;margin:9px 0 20px;font-weight:900}.option-sublabel{color:#d5e5db;font-size:9px}.option-cta{display:flex;align-items:center;justify-content:space-between;background:#fff;color:#172a20;border-radius:100px;padding:12px 14px 12px 21px;min-width:205px;font-size:13px;font-weight:900}.creative-option .option-cta{background:#dbff5f;color:#21220f}.option-cta span{background:#101b18;color:#fff;border-radius:50%;width:31px;height:31px;display:grid;place-items:center}.gateway-end{max-width:1480px;margin:16px auto;display:flex;justify-content:space-between;font:700 11px Manrope;color:var(--muted);letter-spacing:1px}
@keyframes gentle-pan{from{transform:scale(1.08) translateX(-1%)}to{transform:scale(1.17) translateX(1%)}}
/* HERO */
.hero-scene{width:min(1600px,calc(100% - 40px));margin:24px auto 0;border-radius:clamp(36px,6.5vw,110px);min-height:clamp(620px,78svh,920px);position:relative;isolation:isolate;overflow:hidden;background:var(--deep);color:#fff}.hero-visual,.hero-curtain{position:absolute;inset:0;z-index:-2}.hero-visual{background-size:cover;background-position:center;animation:gentle-pan 19s ease-in-out infinite alternate;transform:scale(1.05)}.hero-curtain{z-index:-1;background:linear-gradient(90deg,rgba(7,24,22,.3),rgba(5,15,15,.9))}.marketing .hero-curtain{background:linear-gradient(90deg,rgba(43,10,51,.16),rgba(24,7,29,.91))}.hero-inner{height:100%;min-height:inherit;display:flex;align-items:center;justify-content:space-between;padding:clamp(48px,8vw,125px);gap:40px}.hero-copy{max-width:900px}.eyebrow{display:flex;align-items:center;gap:12px;color:var(--a)}.eyebrow i{display:inline-block;width:25px;height:2px;background:currentColor}.hero-copy h1{font-size:clamp(57px,9vw,142px);line-height:1.24;margin:25px 0;font-weight:900;letter-spacing:-5px}.hero-type{color:var(--a)}.typing-cursor{background:var(--a);width:5px;height:.83em;display:inline-block;vertical-align:middle;margin-inline:5px;animation:blink .95s step-end infinite}.hero-copy p{font-size:clamp(14px,1.7vw,21px);max-width:630px;line-height:1.95;color:#f1f2ed;margin:0 0 30px}.hero-side-art{align-self:flex-end;text-align:center;min-width:130px}.large-symbol{display:block;font:900 clamp(110px,15vw,250px) Manrope;color:var(--a);line-height:1;opacity:.85}.rotating-seal{font:700 11px Manrope;letter-spacing:3px;writing-mode:vertical-lr;transform:rotate(180deg);margin:auto;color:#ffffffb5}.hero-foot{position:absolute;inset-inline:clamp(45px,8vw,120px);bottom:33px;display:flex;justify-content:space-between;font:700 10px Manrope;letter-spacing:2px;color:#e2eee6}@keyframes blink{50%{opacity:0}}
.moving-band{overflow:hidden;padding:16px 0;margin-top:10px;background:var(--a);color:var(--on-a);font:800 clamp(12px,1.5vw,18px) Manrope;letter-spacing:2px;white-space:nowrap}.moving-band-inner{display:flex;gap:60px;width:max-content;animation:marquee 28s linear infinite}.moving-band span{min-width:max-content}@keyframes marquee{to{transform:translateX(-33.333%)}}
/* SERVICES + WORK */
.services-block{padding-bottom:55px}.services-list{border-top:1px solid var(--edge)}.service-line{display:grid;grid-template-columns:75px minmax(0,1fr) 70px;gap:15px;align-items:center;border-bottom:1px solid var(--edge);padding:clamp(22px,3vw,37px) 0;transition:padding .2s,background .2s;border-radius:12px}.service-line:hover{background:var(--surface2);padding-inline:20px}.service-index{color:var(--muted);font:700 12px Manrope}.service-line h3{font-size:clamp(22px,3vw,38px);margin:0 0 8px;line-height:1.35}.service-line p{color:var(--muted);font-size:13px;margin:0;line-height:1.75}.service-arrow{width:47px;height:47px;border-radius:50%;border:1px solid var(--edge);display:grid;place-items:center;font-size:23px;transition:background .2s}.service-line:hover .service-arrow{background:var(--a);color:var(--on-a)}.section-action{display:flex;justify-content:center;margin-top:32px}.creative-work .work-grid{display:grid;grid-template-columns:1.2fr .8fr .85fr;gap:16px}.work-frame{min-width:0;position:relative;border-radius:clamp(22px,3vw,45px);overflow:hidden;background:var(--surface);border:1px solid var(--edge)}.work-image{aspect-ratio:4/5;background:var(--surface2);display:flex;align-items:center;justify-content:center;padding:12px}.work-frame:nth-child(2) .work-image{aspect-ratio:4/5}.work-image img{max-width:100%;max-height:100%;width:auto;height:100%;object-fit:contain;transition:transform .7s var(--ease)}.work-frame:hover .work-image img{transform:scale(1.04)}.work-caption{padding:17px 20px;display:flex;justify-content:space-between;align-items:center;font:800 13px Manrope}.work-caption small{font-size:9px;color:var(--muted)}.work-caption b{font-size:23px}.business-statement{border-radius:50px;background:var(--surface2);max-width:calc(1600px - 70px);position:relative;overflow:hidden}.statement-mark{font:900 250px Manrope;color:var(--a);position:absolute;left:3%;bottom:-150px;opacity:.27}.process-section{background:var(--deep);color:#fff;border-radius:clamp(35px,6vw,100px);max-width:calc(1600px - 38px)}.process-section .section-head p,.process-section .micro-label{color:#b9cac3}.process-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.process-card{border-radius:clamp(20px,2.8vw,42px);padding:clamp(22px,3vw,42px);border:1px solid #ffffff32;background:#ffffff13;backdrop-filter:blur(10px);min-height:300px;display:flex;flex-direction:column}.process-card>span{font:800 25px Manrope;display:flex;justify-content:space-between;color:var(--a)}.process-card h3{margin:auto 0 15px;font-size:clamp(20px,2vw,27px);line-height:1.5}.process-card p{font-size:13px;line-height:1.8;color:#e5e7e1;margin:0}.clients-section{overflow:hidden}.logo-ribbon{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}.logo-ribbon-track{display:flex;gap:15px;width:max-content;animation:ribbonMove 50s linear infinite}.logo-ribbon:hover .logo-ribbon-track{animation-play-state:paused}.client-chip{height:140px;width:160px;flex:none;border-radius:25px;display:flex;align-items:center;justify-content:center;background:#ffffffef;border:1px solid #d4ddd9;padding:22px}.client-chip img{max-height:100%;max-width:100%;object-fit:contain;filter:none!important}@keyframes ribbonMove{to{transform:translateX(-50%)}}.final-cta{margin:20px 2vw 45px;background:var(--a);color:var(--on-a);border-radius:clamp(35px,6vw,95px);min-height:410px;padding:clamp(37px,7vw,100px);display:flex;align-items:flex-start;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.final-cta>p{font:800 11px Manrope;letter-spacing:2px}.final-cta h2{font-size:clamp(40px,6vw,95px);line-height:1.27;letter-spacing:-2px;margin:15px 0}.final-cta>span{margin-bottom:27px;font-size:16px}.final-cta .pill{background:var(--on-a);color:var(--a)}.final-blob{position:absolute;inset-inline-end:-2%;top:-18%;font:900 600px Manrope;line-height:1;color:#00000012;pointer-events:none}
/* CONTENT PAGES */
.page-banner{position:relative;margin:25px auto 10px;width:min(1580px,calc(100% - 42px));background:var(--surface2);border:1px solid var(--edge);border-radius:clamp(32px,5vw,80px);min-height:360px;padding:clamp(40px,7vw,100px);display:flex;flex-direction:column;justify-content:center;overflow:hidden}.page-banner-glyph{position:absolute;inset-inline-end:5%;top:-30%;font:900 450px Manrope;color:var(--a);opacity:.26;line-height:1;pointer-events:none}.page-banner h1{font-size:clamp(51px,8vw,112px);line-height:1.17;margin:20px 0 13px;letter-spacing:-3px;max-width:1000px}.page-banner p{color:var(--muted);font-size:clamp(13px,1.6vw,19px);max-width:700px;line-height:1.85}.content-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.content-card{border-radius:35px;overflow:hidden;background:var(--surface);border:1px solid var(--edge);padding-bottom:20px;min-width:0}.content-cover{height:270px;background:var(--surface2);display:flex;align-items:center;justify-content:center}.content-cover img{width:100%;height:100%;object-fit:contain}.fallback-cover{font-size:100px;color:var(--second)}.content-card-meta{font-size:11px;font-weight:800;display:flex;justify-content:space-between;color:var(--second);margin:21px 22px 5px}.content-card h3{font-size:23px;line-height:1.4;margin:10px 22px}.content-card p{font-size:13px;line-height:1.8;color:var(--muted);margin:10px 22px}.empty-state{font-size:22px;font-weight:800;background:var(--surface);padding:45px;border-radius:30px;text-align:center;color:var(--muted)}
.portfolio-group{padding-top:75px}.group-head{display:flex;align-items:center;gap:24px;margin-bottom:30px}.number-bubble{width:70px;height:70px;border-radius:50%;background:var(--a);color:var(--on-a);display:grid;place-items:center;font:900 25px Manrope;flex-shrink:0}.group-head h2{margin:7px 0;font-size:clamp(29px,4.4vw,60px)}.group-head p{margin:0;font-size:14px;line-height:1.8;color:var(--muted)}.portfolio-inner{border-radius:38px;border:1px solid var(--edge);background:var(--surface);padding:clamp(15px,3.5vw,50px)}.portfolio-section-title{display:flex;justify-content:space-between;align-items:center;gap:30px;margin:10px 0 24px}.portfolio-section-title h3{font-size:clamp(25px,3vw,37px);margin:0}.portfolio-section-title span{font-size:12px;line-height:1.6;max-width:470px;color:var(--muted)}.portfolio-images{display:flex;gap:15px;overflow:auto;scroll-snap-type:x mandatory;padding:8px 4px 15px;scrollbar-color:var(--a) var(--surface2)}.portfolio-image-card{scroll-snap-align:center;flex:0 0 clamp(210px,25vw,320px);height:clamp(365px,43vw,520px);background:var(--surface2);border:1px solid var(--edge);border-radius:30px;display:flex;align-items:center;justify-content:center;padding:0;position:relative;overflow:hidden}.portfolio-image-card img{width:100%;height:100%;object-fit:contain}.image-expand{position:absolute;bottom:15px;left:15px;width:42px;height:42px;border-radius:50%;background:var(--a);color:var(--on-a);display:grid;place-items:center;font-size:20px}.videos-title{margin-top:56px}.film-rack{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px 5px 20px;scrollbar-color:var(--a) var(--surface2)}.film-card{flex:0 0 clamp(200px,24vw,310px);scroll-snap-align:center}.film-viewport{aspect-ratio:9/16;width:100%;border-radius:27px;overflow:hidden;background:#090808;display:flex;align-items:center;justify-content:center}.film-viewport video{object-fit:contain;width:100%;height:100%}.film-caption{display:flex;justify-content:space-between;gap:10px;padding:11px;font:700 10px Manrope;color:var(--muted)}.lightbox{position:fixed;z-index:500;inset:0;background:rgba(5,8,10,.96);display:flex;align-items:center;justify-content:center;padding:70px 75px;color:white}.lightbox img{width:auto;height:auto;max-height:calc(100dvh - 100px);max-width:100%;object-fit:contain}.lightbox button{position:absolute;border:1px solid #ffffff60;background:#ffffff22;color:#fff;border-radius:50%;width:52px;height:52px;font-size:32px;display:grid;place-items:center}.lightbox-close{top:20px;right:20px}.lightbox-prev{left:15px}.lightbox-next{right:15px}.lightbox-count{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);font:700 12px Manrope}.article{max-width:1040px}.article-cover{margin:0 0 30px;background:var(--surface2);border-radius:38px;overflow:hidden;padding:15px}.article-cover img{width:auto;height:auto;max-height:700px;margin:auto;object-fit:contain}.article-text{font-size:18px;line-height:2.1;white-space:normal}.article-video{max-width:350px;margin:35px 0}.article-video video{width:100%;aspect-ratio:9/16;object-fit:contain;background:#000;border-radius:24px}.about-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:40px;align-items:center}.about-figure{font:900 clamp(230px,28vw,470px) Manrope;color:var(--a);line-height:.8;text-align:center}.about-layout h2,.contact-info h2{font-size:clamp(30px,5vw,65px);line-height:1.35;margin:20px 0}.about-layout p,.contact-info p{line-height:1.9;color:var(--muted)}.contact-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px}.contact-info{padding:30px 0}.lead-form{display:grid;grid-template-columns:1fr 1fr;gap:16px;background:var(--surface);padding:clamp(20px,4vw,55px);border-radius:40px;border:1px solid var(--edge)}.lead-form label{font-size:12px;font-weight:900;display:flex;flex-direction:column;gap:7px}.lead-form input,.lead-form select,.lead-form textarea{width:100%;background:var(--bg);color:var(--ink);padding:15px 17px;border:1px solid var(--edge);border-radius:17px;outline-color:var(--a)}.lead-form .wide{grid-column:1/-1}.lead-form .honeypot{display:none}.lead-form .pill{justify-self:start}.lead-form #form-feedback{font-weight:800;font-size:13px}
/* FOOTER */
.site-footer{background:#111916;color:#eff5e9;border-radius:70px 70px 0 0;margin-top:60px;padding:clamp(35px,5.5vw,75px) 5vw 24px}.marketing .site-footer{background:#211329}.site-footer a{color:#c6d0c8;transition:color .2s}.site-footer a:hover{color:#d9ff68}.footer-top{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:50px}.footer-headline{font:900 clamp(96px,19vw,310px) Manrope;line-height:1;letter-spacing:-.1em;text-align:left;direction:ltr;align-self:center}.footer-headline span{font-size:.12em;letter-spacing:0;vertical-align:top}.footer-nav{display:grid;grid-template-columns:1fr 1fr;gap:20px}.footer-nav>div{display:flex;flex-direction:column;gap:17px}.footer-nav h4{font-size:14px;margin:0 0 9px;color:#fff}.footer-nav a{font-size:13px}.footer-bottom{border-top:1px solid #ffffff30;margin-top:55px;padding-top:23px;display:flex;justify-content:space-between;gap:16px;font:800 10px Manrope;letter-spacing:1px}.starburst{color:#dbff5f}
/* MOBILE */
@media(max-width:1020px){.desktop-links{display:none}.menu-toggle{display:grid}.header-cta{display:none}.mobile-nav{position:fixed;z-index:60;top:84px;left:20px;right:20px;border-radius:28px;background:var(--surface);border:1px solid var(--edge);box-shadow:var(--cardshadow);padding:20px;display:none;grid-template-columns:repeat(2,1fr);gap:14px}.mobile-nav.open{display:grid}.mobile-nav a{padding:12px;background:var(--surface2);border-radius:13px;font-size:12px;font-weight:800}.process-grid{grid-template-columns:repeat(2,1fr)}.hero-side-art{display:none}.work-grid{grid-template-columns:1fr 1fr!important}.work-frame:nth-child(3){display:none}}
@media(max-width:700px){.site-topbar{top:8px;margin-top:8px;width:calc(100% - 20px);padding:8px 11px 8px 15px;gap:8px}.brand-logo{font-size:16px}.brand-emblem{font-size:24px}.control{width:36px;height:36px}.gateway{padding:0 10px}.gateway-intro{margin:36px auto 24px}.gateway-intro h1{font-size:clamp(37px,9.6vw,70px);letter-spacing:-2px}.gateway-intro p{font-size:12px}.gateway-options{grid-template-columns:1fr;gap:12px}.gateway-option{min-height:clamp(245px,34svh,360px);border-radius:35px}.gateway-option:hover{border-radius:30px}.gateway-option-content{padding:20px;align-items:center}.gateway-option-content h2{font-size:clamp(26px,7.1vw,38px);margin-bottom:12px}.option-symbol{font-size:84px;letter-spacing:-12px}.option-cta{font-size:11px;padding:9px 12px;min-width:174px}.option-index{top:20px;inset-inline-start:20px;font-size:10px}.option-sublabel{font-size:8px}.gateway-end{font-size:8px;gap:12px}.hero-scene{min-height:clamp(570px,74svh,780px);width:calc(100% - 18px);margin-top:15px;border-radius:36px}.hero-visual{background-position:48% center}.hero-inner{padding:53px 25px 75px;align-items:center;min-height:inherit}.hero-copy h1{font-size:clamp(43px,11vw,70px);letter-spacing:-2px;line-height:1.36}.hero-copy p{font-size:14px}.hero-foot{inset-inline:24px;bottom:22px;font-size:7px}.pill{padding:12px 14px;gap:12px;font-size:11px;min-height:46px}.pill .arrow-char{width:23px;height:23px}.moving-band{font-size:11px}.section-pad{padding:64px 19px}.section-head h2{font-size:clamp(32px,9.4vw,52px);letter-spacing:-1px}.section-head p{font-size:13px}.service-line{grid-template-columns:30px minmax(0,1fr) 40px;gap:8px}.service-line h3{font-size:20px}.service-line p{font-size:11px}.service-arrow{width:35px;height:35px}.creative-work .work-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.work-image{aspect-ratio:3/5;padding:4px}.work-caption{padding:11px;font-size:9px}.work-caption small{display:none}.work-caption b{font-size:18px}.process-section{max-width:calc(100% - 16px);border-radius:35px}.process-grid{grid-template-columns:1fr 1fr;gap:8px}.process-card{padding:17px;min-height:210px;border-radius:22px}.process-card h3{font-size:16px}.process-card p{font-size:10px}.process-card>span{font-size:17px}.client-chip{height:100px;width:135px;padding:13px}.final-cta{padding:35px 26px;min-height:360px;margin:12px 8px 20px;border-radius:35px}.final-cta h2{font-size:36px}.final-blob{font-size:360px}.page-banner{width:calc(100% - 18px);margin-top:15px;padding:35px 22px;min-height:270px;border-radius:33px}.page-banner h1{font-size:clamp(39px,10vw,60px);letter-spacing:-1px}.page-banner p{font-size:13px}.page-banner-glyph{font-size:270px}.content-grid{grid-template-columns:1fr}.content-cover{height:280px}.group-head{align-items:flex-start;gap:12px}.number-bubble{width:43px;height:43px;font-size:16px}.group-head h2{font-size:29px}.group-head p{font-size:12px}.portfolio-inner{padding:13px;border-radius:22px}.portfolio-section-title{display:block;margin:5px 0 15px}.portfolio-section-title span{display:block;margin-top:6px}.portfolio-image-card{flex-basis:220px;height:385px;border-radius:20px}.film-card{flex-basis:220px}.film-viewport{border-radius:18px}.lightbox{padding:65px 14px}.lightbox button{width:36px;height:36px;font-size:23px}.lightbox-prev{left:2px}.lightbox-next{right:2px}.about-layout,.contact-layout{grid-template-columns:1fr;gap:12px}.about-figure{font-size:180px}.contact-layout .contact-info{padding:0}.lead-form{padding:18px;grid-template-columns:1fr}.lead-form .wide{grid-column:auto}.site-footer{border-radius:34px 34px 0 0;padding:35px 22px 20px}.footer-top{grid-template-columns:1fr}.footer-headline{text-align:center;font-size:120px}.footer-nav{gap:14px}.footer-bottom{font-size:8px;margin-top:33px}.logo-ribbon{mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}}
@media(max-width:380px){.gateway-option{min-height:225px}.gateway-intro h1{font-size:36px}.hero-copy h1{font-size:39px}.hero-inner{padding-inline:18px}.process-card p{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}.reveal{opacity:1!important;transform:none!important}}

/* MARV V46 — content-rich sections atop the V44 identity */
.v46-pathway,.v46-sectors,.v46-media,.v46-notes,.v46-faq,.v46-journal {width:100%;position:relative;}
.v46-pathway{border-top:1px solid var(--edge);}
.v46-journey-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.4vw,18px);}
.v46-journey-card{position:relative;background:var(--surface);border:1px solid var(--edge);border-radius:clamp(20px,2.5vw,34px);padding:clamp(20px,2.2vw,32px);min-height:270px;overflow:hidden;display:flex;flex-direction:column;transition:transform .35s var(--ease),border-color .35s;}
.v46-journey-card:hover{transform:translateY(-7px);border-color:var(--a)}
.v46-journey-no{font:800 11px Manrope,sans-serif;letter-spacing:.13em;color:var(--muted);}
.v46-journey-card h3{font-size:clamp(20px,2vw,29px);line-height:1.4;margin:34px 0 12px;letter-spacing:-.03em}
.v46-journey-card p{color:var(--muted);font-size:clamp(12px,1vw,15px);line-height:1.95;margin:0;}
.v46-card-stroke{position:absolute;inset-inline-start:26px;bottom:0;width:27%;height:4px;background:var(--a);border-radius:4px 4px 0 0;}
.v46-pathway-cta,.v46-notes-footer{margin-top:26px;display:flex;justify-content:flex-start}
.v46-sectors{background:var(--surface2);max-width:none!important;padding-inline:max(5vw,24px)!important;border-radius:clamp(30px,4vw,72px);margin-block:28px;}
.v46-sector-head,.v46-sector-grid{max-width:1520px;margin-inline:auto}
.v46-sector-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.v46-sector-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;min-height:300px;background:var(--surface);border:1px solid var(--edge);border-radius:clamp(22px,3vw,42px);padding:clamp(22px,2.4vw,40px);transition:background .25s,transform .32s var(--ease)}
.v46-sector-card:hover{background:var(--glass);transform:translateY(-7px)}
.v46-sector-tag{font:800 11px Manrope,sans-serif;color:var(--muted);letter-spacing:.16em}
.v46-sector-card h3{font-size:clamp(24px,2.5vw,37px);line-height:1.35;margin:45px 0 12px;letter-spacing:-.04em}
.v46-sector-card p{color:var(--muted);font-size:clamp(13px,1.1vw,16px);line-height:1.9;margin:0 0 38px;max-width:550px}
.v46-sector-arrow{display:grid;place-items:center;position:absolute;inset-inline-end:24px;bottom:22px;background:var(--a);color:var(--on-a);border-radius:50%;width:40px;height:40px;font:700 24px Manrope,sans-serif;}
.v46-media{border-top:1px solid var(--edge);}
.v46-media-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:clamp(10px,1.5vw,22px);}
.v46-media-card{background:var(--surface);border:1px solid var(--edge);padding:clamp(9px,1vw,14px);border-radius:clamp(20px,2.2vw,32px);overflow:hidden;min-width:0;}
.v46-media-asset{aspect-ratio:9/16;display:flex;align-items:center;justify-content:center;border-radius:clamp(13px,1.5vw,23px);overflow:hidden;background:var(--surface2);}
.v46-media-asset button{background:transparent;border:0;position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:0;}
.v46-media-asset img,.v46-media-asset video{display:block;width:100%;height:100%;object-fit:contain;}
.v46-media-asset video{background:#0c0c0c}
.v46-media-expand{position:absolute;bottom:14px;inset-inline-end:14px;border-radius:50%;width:38px;height:38px;background:var(--a);color:var(--on-a);display:grid;place-items:center;font-size:22px}
.v46-media-meta{padding:15px 7px 4px;display:flex;flex-direction:column;gap:5px;}
.v46-media-meta>span{font:800 12px Manrope,sans-serif;letter-spacing:.02em;}
.v46-media-meta>small{font-size:13px;color:var(--muted);line-height:1.65}
.v46-notes-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--edge);border-bottom:1px solid var(--edge)}
.v46-note{padding:clamp(24px,3vw,48px);min-height:240px;}
.v46-note:not(:last-child){border-inline-end:1px solid var(--edge)}
.v46-note>span{font:800 10px Manrope,sans-serif;letter-spacing:.13em;color:var(--muted)}
.v46-note h3{font-size:clamp(24px,2.25vw,35px);margin:20px 0 13px;line-height:1.4}
.v46-note p{font-size:14px;color:var(--muted);line-height:1.95;margin:0}
.v46-faq{background:var(--surface);max-width:none!important;border-radius:clamp(30px,4vw,72px);padding-inline:max(5vw,24px)!important;}
.v46-faq .section-head,.v46-faq-list{max-width:1150px;margin-inline:auto}
.v46-faq-list{border-top:1px solid var(--edge)}
.v46-faq-item{border-bottom:1px solid var(--edge)}
.v46-faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer;list-style:none;font-size:clamp(18px,2vw,29px);font-weight:800;line-height:1.6;padding:24px 4px;}
.v46-faq-item summary::-webkit-details-marker{display:none}
.v46-faq-item p{font-size:clamp(13px,1.1vw,17px);line-height:2;color:var(--muted);max-width:890px;padding:0 4px 26px;margin:0}
.v46-faq-mark{font:500 30px Manrope,sans-serif;border:1px solid var(--edge);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;flex:none;transition:transform .2s,background .2s}
.v46-faq-item[open] .v46-faq-mark{transform:rotate(45deg);background:var(--a);color:var(--on-a)}
.v46-journal{border-top:1px solid var(--edge)}
@media(max-width:1000px){.v46-journey-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.v46-media-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.v46-sector-grid{gap:10px}.v46-sector-card{min-height:330px}}
@media(max-width:680px){
 .v46-journey-grid,.v46-sector-grid{grid-template-columns:1fr}
 .v46-journey-card{min-height:175px;padding:22px}.v46-journey-card h3{margin:22px 0 8px;font-size:24px}.v46-journey-card p{font-size:13px}
 .v46-sector-card{min-height:220px;padding:25px}.v46-sector-card h3{margin:24px 0 10px;font-size:26px}.v46-sector-card p{font-size:13px;max-width:90%}
 .v46-media-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.v46-media-card{padding:6px;border-radius:18px}.v46-media-asset{border-radius:12px}.v46-media-meta{padding:10px 5px 5px}.v46-media-meta span{font-size:10px}.v46-media-meta small{font-size:11px}
 .v46-notes-grid{grid-template-columns:1fr}.v46-note{min-height:0;padding:26px 5px}.v46-note:not(:last-child){border-inline-end:0;border-bottom:1px solid var(--edge)}
 .v46-faq-item summary{padding:20px 0;font-size:17px}.v46-faq-mark{width:36px;height:36px;font-size:22px}
}
@media(prefers-reduced-motion:reduce){.v46-sector-card,.v46-journey-card{transition:none!important}}

/* V46: legible secondary action against the dark photographic hero */
.hero-scene .pill.outline{color:#fff;border-color:rgba(255,255,255,.65);background:rgba(255,255,255,.10);backdrop-filter:blur(7px)}
.hero-scene .pill.outline:hover{background:rgba(255,255,255,.2);border-color:#fff}
.hero-scene .pill.outline .arrow-char{color:#fff;background:rgba(255,255,255,.18)}
/* Visual tokens — consistent across themes, with richer Creative accents */
html[data-space="marketing"]{--a:#ff936f;--on-a:#251421;--second:#eb6ca9;--deep:#301c37}
html[data-space="marketing"][data-theme="light"]{--bg:#f9f2f7;--surface:#fffafb;--surface2:#f4e8f0;--ink:#28182c;--muted:#675468;--edge:#e8d5e4;--glass:rgba(255,250,253,.70)}
html[data-space="marketing"][data-theme="dark"]{--bg:#1a101e;--surface:#291b2f;--surface2:#38263e;--ink:#fff4fa;--muted:#cfbed0;--edge:#59415d;--glass:rgba(41,26,49,.75)}
html[data-space="portal"][data-theme="light"]{--a:#4ca58d;--on-a:#092c23}
html[data-space="portal"][data-theme="dark"]{--a:#bcf1ca;--on-a:#0d2c23}
/* Proper original MARV logo on contrasting surfaces */
.brand-logo{gap:9px!important;flex:none;direction:ltr!important;align-items:center;min-width:0}
.brand-logo .brand-original{height:clamp(35px,3.8vw,46px);width:auto;max-width:104px;object-fit:contain;display:block}
.brand-logo .brand-caption{font-family:Manrope,Arial,sans-serif;letter-spacing:.12em;font-size:9px;color:var(--muted);font-weight:900;white-space:nowrap}
.brand-original.brand-night{display:none!important}
html[data-theme="dark"] .brand-original.brand-day{display:none!important}
html[data-theme="dark"] .brand-original.brand-night{display:block!important}
/* Strong frosted, truly legible navigation */
.site-topbar{background:rgba(250,254,252,.64)!important;backdrop-filter:blur(45px) saturate(190%)!important;-webkit-backdrop-filter:blur(45px) saturate(190%)!important;box-shadow:0 18px 65px rgba(6,28,37,.16),inset 0 1px rgba(255,255,255,.66)!important;border:1px solid rgba(255,255,255,.59)!important}
html[data-theme="dark"] .site-topbar{background:rgba(21,23,30,.80)!important;border-color:rgba(234,239,255,.18)!important;box-shadow:0 18px 65px rgba(0,0,0,.4),inset 0 1px rgba(255,255,255,.06)!important}
.site-topbar .control{background:color-mix(in srgb,var(--surface) 73%,transparent);border:1px solid var(--edge);color:var(--ink)}
.site-topbar .control:hover{background:var(--a);color:var(--on-a)}
.site-topbar .desktop-links a:hover{color:var(--ink)}
.mobile-nav{backdrop-filter:blur(38px) saturate(170%)!important;-webkit-backdrop-filter:blur(38px) saturate(170%)!important;background:var(--glass)!important}
/* Animated gradients behind landing and hero while retaining real imagery */
.gateway{isolation:isolate}
.gateway-ambient{height:100%;inset:0;opacity:.95!important;z-index:-1;filter:blur(30px);background:radial-gradient(circle at 15% 15%,rgba(40,188,181,.24),transparent 35%),radial-gradient(circle at 85% 32%,rgba(225,116,154,.26),transparent 38%),radial-gradient(circle at 52% 85%,rgba(138,112,247,.12),transparent 43%)!important;animation:portalGlow 15s ease-in-out infinite alternate}
@keyframes portalGlow{0%{transform:translate3d(-2%,0,0) scale(1)}100%{transform:translate3d(2%,-3%,0) scale(1.06)}}
.gateway-shot{animation:gatewayPan 19s cubic-bezier(.36,.02,.34,1) infinite alternate!important}
@keyframes gatewayPan{0%{transform:scale(1.05) translate3d(-1%,0,0)}100%{transform:scale(1.16) translate3d(1.5%,-1%,0)}}
.gateway-option{box-shadow:0 22px 75px rgba(10,25,31,.17);isolation:isolate}
.gateway-option:hover .gateway-shot{animation-play-state:running!important}
.gateway-option .gateway-overlay{backdrop-filter:blur(1.5px)}
.hero-scene{isolation:isolate}
.hero-scene::before{content:"";position:absolute;inset:-20%;z-index:-1;pointer-events:none;background:radial-gradient(circle at 75% 30%,rgba(130,218,217,.18),transparent 38%),radial-gradient(circle at 15% 65%,rgba(254,157,111,.15),transparent 38%);filter:blur(25px);animation:heroAmbient 14s ease-in-out infinite alternate}
.marketing .hero-scene::before{background:radial-gradient(circle at 72% 24%,rgba(255,155,119,.26),transparent 38%),radial-gradient(circle at 15% 70%,rgba(220,107,175,.20),transparent 42%)}
@keyframes heroAmbient{from{transform:translateX(-2%) scale(1)}to{transform:translateX(3%) translateY(-2%) scale(1.06)}}
.hero-visual{animation:heroPan2 21s ease-in-out infinite alternate!important}
@keyframes heroPan2{from{transform:scale(1.07) translateX(-1%)}to{transform:scale(1.17) translateX(1.5%)}}
/* Stronger typographic hierarchy but smaller page titles */
.section-head h2{font-size:clamp(30px,4.6vw,66px)!important;letter-spacing:-1.8px!important}
.page-banner{min-height:clamp(235px,31vw,370px)!important;padding:clamp(32px,5vw,75px)!important;backdrop-filter:blur(16px)}
.page-banner h1{font-size:clamp(34px,5.9vw,77px)!important;letter-spacing:-1.5px!important;animation:titleEnter .78s both}
.page-banner .page-banner-glyph{animation:pageGlyph 20s linear infinite}
@keyframes pageGlyph{to{transform:rotate(90deg)}}
@keyframes titleEnter{from{opacity:0;transform:translateY(19px);filter:blur(7px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
/* Polished rectangular services on homepage */
.services-list.services-tiles{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;border:0!important}
.services-tiles .service-line{display:flex!important;min-height:225px;position:relative;flex-direction:column;align-items:flex-start!important;gap:0!important;padding:27px!important;background:var(--surface);border:1px solid var(--edge)!important;border-radius:26px!important;box-shadow:0 8px 30px rgba(18,29,42,.035);overflow:hidden;transition:transform .38s var(--ease),box-shadow .4s,border-color .3s!important}
.services-tiles .service-line::after{content:"";position:absolute;inset:auto auto -130px -40px;width:180px;height:180px;border-radius:50%;background:var(--a);opacity:.10;filter:blur(20px);pointer-events:none;transition:transform .55s}
.services-tiles .service-line:hover{padding:27px!important;transform:translateY(-6px);box-shadow:0 22px 46px rgba(18,29,42,.11);border-color:var(--a)!important}
.services-tiles .service-line:hover::after{transform:scale(1.7)}
.services-tiles .service-line h3{font-size:clamp(19px,2vw,28px);line-height:1.4;margin:14px 40px 10px 0}
.services-tiles .service-line p{font-size:clamp(12px,1vw,15px);line-height:1.75;max-width:490px}
.services-tiles .service-index{font-size:10px;font-weight:800;letter-spacing:.15em;color:var(--muted)}
.services-tiles .service-arrow{position:absolute;inset-inline-end:22px;top:24px;width:38px;height:38px;font-size:21px}
/* Expanded services: accessible click-to-open service explorer */
.v47-service-accordion{display:grid;gap:14px;max-width:1400px;margin:auto}
.v47-service-item{border-radius:26px;background:var(--surface);border:1px solid var(--edge);box-shadow:var(--cardshadow);overflow:hidden;transition:border-color .28s,background .28s}
.v47-service-item[open]{border-color:color-mix(in srgb,var(--a) 80%,var(--edge))}
.v47-service-item summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:70px 1fr 46px;align-items:center;gap:18px;padding:21px clamp(18px,3vw,35px);min-height:98px}
.v47-service-item summary::-webkit-details-marker{display:none}
.v47-service-no{font:900 16px Manrope;color:var(--muted)}
.v47-service-title{font-size:clamp(18px,2.4vw,31px);line-height:1.4;font-weight:850}
.v47-service-plus{border-radius:50%;width:42px;height:42px;display:grid;place-items:center;font:400 30px Manrope;background:var(--surface2);transition:transform .25s,background .25s}
.v47-service-item[open] .v47-service-plus{background:var(--a);color:var(--on-a);transform:rotate(45deg)}
.v47-service-open{padding:4px clamp(18px,3vw,35px) 32px;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.85fr);gap:28px;animation:titleEnter .4s both}
.v47-service-open h3{font-size:clamp(20px,2.5vw,32px);margin:0 0 10px}
.v47-service-open p{font-size:clamp(14px,1.12vw,16px);line-height:2;color:var(--muted);max-width:780px;margin:0 0 23px}
.v47-deliverables{border-radius:20px;padding:20px;background:var(--surface2);display:grid;gap:12px}
.v47-deliverables>div{padding:8px 0;display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--edge)}
.v47-deliverables>div:last-child{border:0}.v47-deliverables b{font:900 12px Manrope;color:var(--muted)}.v47-deliverables span{font-size:14px;font-weight:700}
/* Editorial features + video work display, no clipped frame or massive empty card */
.feature-work-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.feature-work-story{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:0;background:var(--surface);border:1px solid var(--edge);border-radius:31px;overflow:hidden;min-height:365px}
.feature-work-image{appearance:none;background:var(--surface2);border:0;position:relative;cursor:zoom-in;padding:18px;display:flex;justify-content:center;align-items:center;overflow:hidden}
.feature-work-image img{max-height:340px!important;width:auto!important;height:auto!important;max-width:100%!important;object-fit:contain!important;transition:transform .55s var(--ease)}
.feature-work-image:hover img{transform:scale(1.035)}
.feature-zoom{position:absolute;top:20px;inset-inline-end:20px;width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:var(--a);color:var(--on-a)}
.feature-work-copy{padding:clamp(20px,2vw,36px);display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.feature-work-copy h3{font-size:clamp(19px,2.1vw,32px);line-height:1.35;margin:20px 0 12px;letter-spacing:-.5px}
.feature-work-copy p{font-size:13px;line-height:1.85;color:var(--muted);margin:0 0 23px}
.v47-motion{padding-top:70px}.v47-motion-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1190px;margin-inline:auto}
.v47-motion-card{min-width:0;background:var(--surface);border:1px solid var(--edge);border-radius:30px;padding:12px;display:flex;flex-direction:column}
.v47-motion-screen{aspect-ratio:9/16;overflow:hidden;border-radius:22px;background:#131119;display:flex;align-items:center;justify-content:center}
.v47-motion-screen video{width:100%;height:100%;object-fit:contain!important;display:block;background:#100c11}
.v47-motion-label{padding:15px 12px 10px}.v47-motion-label small{font:800 10px Manrope;letter-spacing:.06em;color:var(--muted)}.v47-motion-label h3{font-size:clamp(16px,1.5vw,21px);margin:7px 0 4px}
.v47-endwork{border-top:1px solid var(--edge)}.v47-endwork-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px}
.v47-endwork-grid button{padding:12px;background:var(--surface);border:1px solid var(--edge);border-radius:25px;display:flex;flex-direction:column;align-items:center;min-width:0;cursor:zoom-in;transition:transform .35s}
.v47-endwork-grid button:hover{transform:translateY(-5px)}
.v47-endwork-grid img{height:340px;max-width:100%;width:auto;object-fit:contain}
.v47-endwork-grid button span{display:flex;justify-content:space-between;align-items:center;width:100%;padding:12px 10px 6px;font:800 11px Manrope;color:var(--ink)}
/* Infinite client logo ticker: EXACT 3 duplicate full groups, mathematically normalized */
.logo-loop{overflow:hidden;touch-action:pan-y;cursor:grab;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);user-select:none}
.logo-loop.is-dragging{cursor:grabbing}
.logo-loop-track{display:flex;align-items:center;width:max-content;will-change:transform;direction:ltr}
.logo-loop-group{display:flex;flex:none;gap:16px;padding-inline-end:16px;align-items:center}
.logo-loop .client-chip{flex:none!important;width:clamp(140px,14vw,184px)!important;height:clamp(135px,13vw,170px)!important;padding:14px!important;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.82)!important;border:1px solid rgba(220,225,230,.8)!important;border-radius:22px!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);overflow:hidden}
.logo-loop .client-chip img{display:block;width:100%;height:100%;object-fit:contain!important;max-height:115px;pointer-events:none}
.logo-loop-actions{display:flex;gap:20px;align-items:center;justify-content:center;margin-top:22px;color:var(--muted);font-size:12px}
.logo-loop-actions button{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--edge);background:var(--surface);color:var(--ink);font-size:19px}
.logo-loop-actions button:hover{background:var(--a);color:var(--on-a)}
/* Full dimension media previews */
.film-viewport video{width:100%;height:100%;object-fit:contain!important;background:#0e0e11}
.portfolio-image-card img{object-fit:contain!important}
.content-cover img{object-fit:contain!important}
/* Enter motion from alternating directions with modest blur */
.reveal{transition:opacity .8s var(--ease),transform .8s var(--ease),filter .8s var(--ease)}
.reveal:not(.visible){filter:blur(7px)}
.reveal.reveal-dir-0:not(.visible){transform:translateY(24px)}
.reveal.reveal-dir-1:not(.visible){transform:translateX(-24px)}
.reveal.reveal-dir-2:not(.visible){transform:translateX(24px)}
.reveal.reveal-dir-3:not(.visible){transform:scale(.97) translateY(14px)}
.reveal.visible{transform:none!important;filter:blur(0)}
/* Light and dark specific contrasts */
html[data-theme="dark"] .feature-work-image,html[data-theme="dark"] .v47-motion-card{border-color:var(--edge)}
html[data-theme="dark"] .v47-deliverables{background:var(--surface2)}
html[data-theme="light"] .pill.outline{color:var(--ink);border-color:var(--edge)}
html[data-theme="dark"] .pill.outline{color:var(--ink);border-color:var(--edge)}
.hero-scene .pill.outline{color:#fff!important;border-color:rgba(255,255,255,.65)!important;background:rgba(9,9,20,.22)!important;backdrop-filter:blur(20px)}
/* Mobile + tablet refinements */
@media(max-width:1130px){.feature-work-grid{grid-template-columns:1fr}.feature-work-story{grid-template-columns: minmax(0,.65fr) minmax(0,1fr)}.services-list.services-tiles{grid-template-columns:1fr 1fr}.feature-work-image img{max-height:310px!important}}
@media(max-width:760px){.services-list.services-tiles{grid-template-columns:1fr}.services-tiles .service-line{min-height:168px;padding:22px!important}.services-tiles .service-line:hover{padding:22px!important}.services-tiles .service-line h3{font-size:22px;margin:12px 35px 8px 0}.feature-work-story{grid-template-columns:1fr}.feature-work-image{min-height:240px;padding:15px}.feature-work-image img{max-height:280px!important}.feature-work-copy{padding:20px}.v47-motion-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.v47-motion-card{padding:7px;border-radius:20px}.v47-motion-screen{border-radius:14px}.v47-motion-label{padding:11px 6px}.v47-motion-label h3{font-size:14px}.v47-endwork-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.v47-endwork-grid img{height:240px}.v47-service-item summary{grid-template-columns:42px 1fr 35px;gap:8px;padding:18px 14px}.v47-service-title{font-size:17px}.v47-service-open{grid-template-columns:1fr;gap:17px}.logo-loop .client-chip{width:158px!important;height:153px!important}.logo-loop-actions{gap:12px}.site-topbar .brand-original{height:37px;max-width:70px}.brand-logo .brand-caption{font-size:8px}.hero-scene{margin-top:18px}}
@media(max-width:480px){.v47-motion-grid{grid-template-columns:1fr 1fr}.v47-motion-card:nth-child(3){grid-column:span 2;max-width:260px;justify-self:center}.v47-endwork-grid button:last-child{grid-column:span 2;max-width:260px;justify-self:center}.page-banner{min-height:240px!important}.page-banner h1{font-size:clamp(32px,9vw,44px)!important}.section-head h2{font-size:clamp(29px,8vw,40px)!important}.feature-work-image img{max-height:260px!important}}
@media(prefers-reduced-motion:reduce){.gateway-ambient,.gateway-shot,.hero-visual,.hero-scene::before,.page-banner .page-banner-glyph{animation:none!important}.reveal{opacity:1!important;filter:none!important;transform:none!important}}


/* V48 — true-to-ratio still designs, never mix movie posters into design galleries */
.portfolio-images{align-items:flex-start;scroll-padding-inline:20px}
.portfolio-image-card{height:auto!important;aspect-ratio:9/16!important;flex:0 0 clamp(245px,25vw,340px)!important;box-shadow:0 14px 34px rgba(0,0,0,.10);border:0!important;background:transparent!important;border-radius:18px!important;padding:0!important}
.portfolio-image-card img{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important}
.portfolio-image-card .image-expand{z-index:2;background:var(--a)}
/* Mobile selected work: show each full vertical artwork edge-to-edge, never in a short padded card. */
@media(max-width:760px){
 .feature-work-grid{grid-template-columns:1fr!important;gap:26px!important}
 .feature-work-story{width:min(100%,430px);margin-inline:auto;display:flex!important;flex-direction:column;min-height:0!important;overflow:hidden}
 .feature-work-image{aspect-ratio:9/16!important;width:100%;height:auto!important;min-height:0!important;padding:0!important;background:transparent!important;display:block!important;overflow:visible!important}
 .feature-work-image img{display:block;width:100%!important;height:100%!important;max-width:100%!important;max-height:none!important;object-fit:contain!important;object-position:center!important;border-radius:18px 18px 0 0}
 .feature-work-copy{padding:18px 18px 22px!important}
 .portfolio-image-card{flex-basis:min(77vw,360px)!important;height:auto!important;aspect-ratio:9/16!important;border-radius:14px!important}
 .portfolio-inner{padding:12px!important}
 .portfolio-images{gap:12px;padding-block:8px 20px!important}
 .v47-endwork-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .v47-endwork-grid button{padding:0!important;border-radius:15px!important;overflow:hidden}
 .v47-endwork-grid img{height:auto!important;width:100%!important;max-height:none!important;aspect-ratio:9/16;object-fit:contain!important;background:transparent}
}
/* Button state and accessible animated hamburger icon */
.menu-toggle{position:relative}
.menu-lines{width:19px;height:16px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;pointer-events:none}
.menu-lines i{display:block;height:2px;width:100%;background:currentColor;border-radius:99px;transform-origin:center;transition:transform .25s ease,opacity .18s ease}
.menu-toggle.is-open .menu-lines i:first-child{transform:translateY(7px) rotate(45deg)}
.menu-toggle.is-open .menu-lines i:nth-child(2){opacity:0;transform:scaleX(.2)}
.menu-toggle.is-open .menu-lines i:last-child{transform:translateY(-7px) rotate(-45deg)}
.menu-toggle.is-open{background:var(--a);color:var(--on-a)}
/* Unbroken single row, no gaps between full repeated logo sequences */
.logo-loop{direction:ltr!important;overflow:hidden!important}
.logo-loop-track{gap:0!important;direction:ltr!important;min-width:max-content;display:flex!important}
.logo-loop-group{display:flex!important;flex:none!important;align-items:center;gap:16px!important;padding-inline-end:16px!important;min-width:max-content}
.logo-loop .client-chip img{opacity:1!important;visibility:visible!important;object-fit:contain!important}
@media(prefers-reduced-motion:reduce){.logo-loop-track{transform:none}}

/* Remove the old nested panels on narrow screens: artwork owns the full frame. */
@media(max-width:760px){
 .feature-work-story{background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important}
 .feature-work-image img{border-radius:18px 18px 0 0!important}
 .feature-work-copy{background:var(--surface);border:1px solid var(--edge);border-top:0;border-radius:0 0 20px 20px}
 .portfolio-inner{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
 .portfolio-image-card img{border-radius:14px!important}
}
@media(hover:none){.menu-toggle:not(.is-open):hover{transform:none!important;background:var(--surface2)!important;color:var(--ink)!important}}


/* MARV V49 — precise header contrast and no-layout-shift title sizing */
/* Keep the floating header translucent. The expanded phone menu is independent
   and deliberately much more opaque to protect legibility above hero imagery. */
html[data-theme="light"] .site-topbar{
  background:rgba(250,254,252,.49)!important;
  border-color:rgba(255,255,255,.59)!important;
  backdrop-filter:blur(56px) saturate(185%)!important;
  -webkit-backdrop-filter:blur(56px) saturate(185%)!important;
}
html[data-theme="dark"] .site-topbar{
  background:rgba(16,24,30,.56)!important;
  border-color:rgba(232,240,249,.22)!important;
  backdrop-filter:blur(56px) saturate(180%)!important;
  -webkit-backdrop-filter:blur(56px) saturate(180%)!important;
}
@media(max-width:1020px){
 .shell .mobile-nav.open{
   display:grid!important;
   background:rgba(248,251,249,.97)!important;
   color:#172824!important;
   border:1px solid rgba(130,154,148,.65)!important;
   box-shadow:0 28px 75px rgba(0,16,26,.28)!important;
   backdrop-filter:blur(40px) saturate(125%)!important;
   -webkit-backdrop-filter:blur(40px) saturate(125%)!important;
 }
 html[data-theme="dark"] .shell .mobile-nav.open{
   background:rgba(19,30,34,.97)!important;
   color:#eef8f4!important;
   border-color:rgba(167,195,191,.36)!important;
   box-shadow:0 28px 85px rgba(0,0,0,.55)!important;
 }
 .shell .mobile-nav.open a{
   background:rgba(17,55,51,.07)!important;
   color:inherit!important;
   border:1px solid rgba(24,65,59,.10);
 }
 html[data-theme="dark"] .shell .mobile-nav.open a{
   background:rgba(241,255,250,.08)!important;
   border-color:rgba(233,255,246,.13);
 }
 .shell .mobile-nav.open a:focus-visible{outline:3px solid var(--a);outline-offset:2px}
}
/* Fixed, independent type line: word changes cannot reflow the heading. */
.hero-copy{width:100%;min-width:0;max-width:min(820px,100%)}
.hero-copy h1{
 font-size:clamp(44px,5.55vw,83px)!important;
 line-height:1.22!important;
 letter-spacing:-1.5px!important;
 margin:clamp(12px,2vw,22px) 0 clamp(19px,3vw,34px)!important;
 overflow:visible;
}
.hero-type-line{
 display:block;
 width:100%;
 height:1.3em;
 line-height:1.3;
 font-size:clamp(33px,5.1vw,75px);
 white-space:nowrap;
 overflow:hidden;
 letter-spacing:-.018em;
 font-weight:900;
}
.hero-type-line .hero-type{white-space:nowrap;display:inline;vertical-align:baseline}
.hero-type-line .typing-cursor{height:.72em;margin-inline:6px;width:4px}
.hero-inner{gap:clamp(18px,3vw,40px)}
@media(max-width:760px){
 .site-topbar .brand-logo{
   display:flex!important;
   flex-direction:column!important;
   justify-content:center;
   align-items:center;
   gap:1px!important;
   flex-shrink:0;
   min-width:62px;
   text-align:center;
 }
 .site-topbar .brand-original{height:clamp(29px,8vw,37px)!important;max-width:74px!important}
 .site-topbar .brand-caption{
   display:block!important;
   margin:1px 0 0!important;
   font-size:7px!important;
   letter-spacing:.06em!important;
   text-align:center;
   line-height:1.25;
 }
 .hero-copy h1{
   font-size:clamp(36px,8.5vw,54px)!important;
   line-height:1.22!important;
   letter-spacing:-.8px!important;
 }
 .hero-type-line{font-size:clamp(29px,8vw,49px);height:1.3em}
 .hero-copy p{font-size:clamp(13px,3.55vw,16px)!important;line-height:1.8!important}
 .hero-inner{padding:clamp(49px,9vw,78px) clamp(18px,6vw,30px) 75px!important}
}
@media(max-width:380px){
 .hero-copy h1{font-size:clamp(32px,8.7vw,39px)!important}
 .hero-type-line{font-size:clamp(26px,7.4vw,35px)}
 .site-topbar{gap:5px!important}
}


/* V50 — uncluttered auto/touch logo ribbon + stacked brand label on all screens */
.site-topbar .brand-logo{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  text-align:center!important;
  flex-shrink:0!important;
  min-width:76px;
  direction:ltr!important;
}
.site-topbar .brand-original{
  height:clamp(35px,3.4vw,43px)!important;
  width:auto;
  max-width:103px!important;
  object-fit:contain;
}
.site-topbar .brand-caption{
  display:block!important;
  margin:1px 0 0!important;
  font-size:clamp(8px,.72vw,10px)!important;
  letter-spacing:.1em!important;
  line-height:1.1!important;
  color:var(--muted)!important;
  text-align:center!important;
}
/* The ribbon is self-moving and supports drag/swipe; no arrows or progress UI. */
.logo-loop-actions{display:none!important}
.logo-loop{touch-action:pan-y;cursor:grab}
.logo-loop.is-dragging{cursor:grabbing}
@media(max-width:760px){
 .site-topbar .brand-logo{min-width:62px!important;gap:1px!important}
 .site-topbar .brand-original{height:clamp(29px,8vw,37px)!important;max-width:74px!important}
 .site-topbar .brand-caption{font-size:7px!important;letter-spacing:.06em!important}
}


/* MARV V52 — responsive one-screen gateway, animated editorial entrance */
.shell.portal{min-height:100dvh;min-height:100vh;display:flex;flex-direction:column;overflow-x:clip}
.shell.portal .site-topbar{flex:0 0 auto}
.shell.portal .gateway{
  box-sizing:border-box;
  flex:1 1 auto;
  width:100%;
  height:calc(100dvh - 100px);
  min-height:580px;
  max-width:1620px;
  margin:0 auto;
  padding:clamp(10px,1.8dvh,22px) clamp(17px,3vw,48px) clamp(10px,1.4dvh,18px);
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  align-items:stretch;
  row-gap:clamp(12px,1.8dvh,19px);
}
.shell.portal .gateway-intro{
  margin:0 auto;
  padding:0;
  width:100%;
  max-width:880px;
  text-align:center;
}
.shell.portal .gateway-intro .tiny-label{
  font-size:clamp(9px,.75vw,11px);
  letter-spacing:1.8px;
  line-height:1.25;
}
.shell.portal .gateway-intro h1{
  margin:clamp(9px,1.4dvh,13px) auto clamp(8px,1.5dvh,14px);
  font-size:clamp(42px,5.1vw,76px);
  line-height:1.14;
  letter-spacing:-.038em;
  font-weight:900;
}
.shell.portal .gateway-intro .gateway-headline-row{display:block}
.shell.portal .gateway-intro h1 em{font-style:normal}
.shell.portal .gateway-intro p{
  font-size:clamp(12px,1.1vw,16px);
  line-height:1.65;
  max-width:630px;
  margin:0 auto;
}
.shell.portal .gateway-options{
  width:100%;
  max-width:1320px;
  align-self:center;
  min-height:0;
  height:100%;
  max-height:430px;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(12px,1.4vw,20px);
}
.shell.portal .gateway-option{
  height:100%;
  min-height:0;
  border-radius:clamp(25px,3.5vw,49px);
  box-shadow:0 18px 58px rgba(15,20,27,.14);
}
.shell.portal .gateway-option:hover{transform:translateY(-5px);border-radius:clamp(24px,3vw,46px)}
.shell.portal .gateway-option-content{
  padding:clamp(19px,2.8vw,40px);
  gap:14px;
}
.shell.portal .gateway-option-content h2{
  font-size:clamp(25px,2.45vw,37px);
  letter-spacing:-.035em;
  line-height:1.18;
  margin:7px 0 13px;
}
.shell.portal .option-symbol{font-size:clamp(60px,8.2vw,120px);letter-spacing:-.08em;line-height:.85}
.shell.portal .option-index{top:clamp(16px,2vw,25px);inset-inline-start:clamp(18px,2vw,30px);font-size:10px;letter-spacing:2px}
.shell.portal .option-cta{min-width:0;width:max-content;min-height:40px;gap:14px;padding:7px 10px 7px 16px;font-size:clamp(10px,.8vw,12px)}
.shell.portal .option-cta span{width:26px;height:26px;flex:none}
.shell.portal .option-sublabel{font-size:8px;letter-spacing:1.5px}
.shell.portal .gateway-end{width:100%;margin:0 auto;font-size:clamp(8px,.75vw,10px);min-height:18px;line-height:1.4}
/* Stagger the intro and choices without altering document flow or card dimensions. */
.shell.portal .gateway-intro.reveal{transform:translateY(11px);transition:opacity .65s ease,transform .75s var(--ease)}
.shell.portal .gateway-intro.reveal.visible{transform:translateY(0)}
.shell.portal .gateway-intro.reveal.visible .gateway-headline-row{animation:marvGatewayWords .78s var(--ease) both}
.shell.portal .gateway-intro.reveal.visible .gateway-headline-row:nth-child(2){animation-delay:.11s}
@keyframes marvGatewayWords{from{opacity:.12;transform:translate3d(0,13px,0);filter:blur(5px)}to{opacity:1;transform:translate3d(0,0,0);filter:blur(0)}}
.shell.portal .gateway-option{animation:marvGatewayCardIn .8s var(--ease) both;will-change:transform}
.shell.portal .gateway-option.business-option{animation-delay:.16s}
.shell.portal .gateway-option.creative-option{animation-delay:.29s}
@keyframes marvGatewayCardIn{from{opacity:0;transform:translate3d(0,22px,0) scale(.975)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
.shell.portal .gateway-option .gateway-shot{animation-duration:26s!important}
.shell.portal .gateway-option .option-cta{transition:transform .35s var(--ease),background .25s}
.shell.portal .gateway-option:hover .option-cta{transform:translateX(-3px)}
html[dir="ltr"] .shell.portal .gateway-option:hover .option-cta{transform:translateX(3px)}
@media(min-width:701px) and (max-height:800px){
 .shell.portal .gateway{min-height:540px;height:calc(100dvh - 100px);row-gap:11px}
 .shell.portal .gateway-intro h1{font-size:clamp(38px,4.5vw,63px);margin:7px auto 8px;line-height:1.1}
 .shell.portal .gateway-intro p{font-size:13px;line-height:1.5}
 .shell.portal .gateway-options{max-height:360px}
}
@media(max-width:700px){
 .shell.portal .gateway{
   height:calc(100dvh - 77px);
   min-height:0;
   padding:clamp(10px,1.8dvh,17px) 14px clamp(10px,1.8dvh,16px);
   row-gap:clamp(9px,1.6dvh,14px);
   grid-template-rows:auto minmax(0,1fr) auto;
 }
 .shell.portal .gateway-intro{max-width:520px}
 .shell.portal .gateway-intro .tiny-label{font-size:9px;letter-spacing:1.1px;gap:7px}
 .shell.portal .gateway-intro h1{
   font-size:clamp(28px,7.65vw,42px);
   line-height:1.19;
   letter-spacing:-.035em;
   margin:clamp(8px,1.3dvh,11px) auto clamp(6px,1dvh,9px);
 }
 .shell.portal .gateway-intro p{
   font-size:clamp(11px,3.05vw,13px);
   line-height:1.53;
   max-width:340px;
 }
 .shell.portal .gateway-options{
   width:100%;
   max-width:540px;
   height:100%;
   max-height:430px;
   grid-template-columns:1fr;
   grid-template-rows:repeat(2,minmax(0,1fr));
   gap:clamp(9px,1.4dvh,13px);
 }
 .shell.portal .gateway-option{height:100%;min-height:0;border-radius:25px}
 .shell.portal .gateway-option:hover{border-radius:24px;transform:none}
 .shell.portal .gateway-option-content{
   padding:clamp(16px,3.7vw,21px);
   align-items:flex-end;
   gap:12px;
 }
 .shell.portal .option-symbol{font-size:clamp(57px,14vw,74px);letter-spacing:-.07em}
 .shell.portal .gateway-option-content h2{font-size:clamp(23px,5.6vw,30px);line-height:1.2;margin:5px 0 10px}
 .shell.portal .option-cta{font-size:10px;min-height:34px;padding:5px 7px 5px 13px;gap:9px}
 .shell.portal .option-cta span{width:24px;height:24px}
 .shell.portal .option-sublabel{font-size:7px;letter-spacing:.85px}
 .shell.portal .option-index{top:16px;inset-inline-start:18px;font-size:9px}
 .shell.portal .gateway-end{font-size:8px;line-height:1.4;gap:12px}
}
@media(max-width:700px) and (max-height:690px){
 .shell.portal .gateway{height:calc(100dvh - 73px);padding-top:8px;padding-bottom:8px;row-gap:9px}
 .shell.portal .gateway-intro h1{font-size:clamp(26px,6.8vw,33px);margin:6px auto;line-height:1.12}
 .shell.portal .gateway-intro p{font-size:11px;line-height:1.38}
 .shell.portal .option-symbol{font-size:53px}
 .shell.portal .gateway-option-content{padding:12px 15px}
 .shell.portal .gateway-option-content h2{font-size:22px;margin:2px 0 6px}
 .shell.portal .option-cta{min-height:32px;font-size:9px}
 .shell.portal .gateway-option{border-radius:20px}
}
@media(max-width:700px) and (max-height:540px){
 .shell.portal{overflow-y:visible}
 .shell.portal .gateway{height:auto;min-height:calc(100dvh - 73px)}
 .shell.portal .gateway-options{height:auto;grid-template-rows:repeat(2,minmax(142px,auto))}
}
@media(prefers-reduced-motion:reduce){
 .shell.portal .gateway-option,.shell.portal .gateway-intro.reveal.visible .gateway-headline-row{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}
}

@media(min-width:701px) and (max-height:675px){
 .shell.portal .gateway{min-height:0;row-gap:8px;padding-top:6px;padding-bottom:8px}
 .shell.portal .gateway-intro h1{font-size:clamp(36px,4vw,55px);line-height:1.06;margin:4px auto 6px}
 .shell.portal .gateway-intro p{font-size:12px;line-height:1.4}
 .shell.portal .gateway-options{max-height:280px}
}


/* V53 | Standalone welcome composition: no navigation header */
.shell.portal{position:relative;min-height:100vh;min-height:100dvh;display:block;overflow-x:clip}
.shell.portal .gateway{
 position:relative;display:flex;flex-direction:column;align-items:stretch;
 justify-content:flex-start;width:100%;max-width:1620px;
 min-height:100dvh;height:100dvh;box-sizing:border-box;
 margin:0 auto;padding:clamp(14px,2.2dvh,25px) clamp(16px,3vw,48px) clamp(14px,2dvh,22px);
 row-gap:clamp(10px,1.65dvh,18px);
}
.shell.portal .portal-switches{
 position:absolute;top:clamp(16px,2.2dvh,27px);left:clamp(16px,3vw,48px);
 z-index:20;display:flex;align-items:center;gap:9px;direction:rtl;
}
.shell.portal .portal-switches .control{
 width:42px;height:42px;background:var(--glass);color:var(--ink);
 backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
 border:1px solid var(--edge);box-shadow:0 5px 24px rgba(0,0,0,.06);
}
.shell.portal .portal-switches .control:hover{background:var(--a);color:var(--on-a)}
.shell.portal .gateway-intro{
 flex:0 0 auto;margin:0 auto;padding:0;max-width:960px;
 width:100%;text-align:center;
}
.shell.portal .gateway-brand{display:flex;align-items:center;justify-content:center;height:clamp(55px,8dvh,79px);margin-bottom:5px}
.shell.portal .gateway-brand img{display:block;width:auto;height:100%;max-width:148px;object-fit:contain}
.shell.portal .gateway-brand .brand-night{display:none}
html[data-theme="dark"] .shell.portal .gateway-brand .brand-day{display:none}
html[data-theme="dark"] .shell.portal .gateway-brand .brand-night{display:block}
.shell.portal .gateway-intro .tiny-label{font-size:clamp(9px,.85vw,11px);line-height:1.2;letter-spacing:1.7px}
.shell.portal .gateway-intro h1{
 font-size:clamp(51px,5.9vw,88px);line-height:1.05;letter-spacing:-.041em;
 font-weight:900;margin:clamp(8px,1.2dvh,12px) auto clamp(7px,1dvh,10px);
}
.shell.portal .gateway-intro p{font-size:clamp(12px,1.13vw,16px);line-height:1.56;max-width:650px;margin:0 auto}
.shell.portal .gateway-options{
 flex:1 1 auto;width:100%;max-width:1180px;min-height:0;height:auto;
 max-height:clamp(270px,45dvh,370px);margin:0 auto;
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(11px,1.5vw,18px);
}
.shell.portal .gateway-option{height:100%;min-height:0;border-radius:clamp(22px,2.9vw,42px)}
.shell.portal .gateway-option-content{padding:clamp(17px,2.3vw,34px)}
.shell.portal .gateway-option-content h2{font-size:clamp(25px,2.4vw,37px);line-height:1.22;margin:6px 0 12px}
.shell.portal .option-symbol{font-size:clamp(64px,8.6vw,115px)}
.shell.portal .gateway-end{flex:0 0 auto;margin:auto auto 0;width:100%;max-width:1180px;min-height:18px;padding-top:2px}
/* Gentle sequential entrance without changing document flow. */
.shell.portal .gateway-brand{animation:marvV53Brand .85s var(--ease) both}
@keyframes marvV53Brand{from{opacity:0;transform:translateY(-13px) scale(.96);filter:blur(3px)}to{opacity:1;transform:none;filter:blur(0)}}
@media(min-width:701px) and (max-height:780px){
 .shell.portal .gateway{row-gap:9px;padding-top:10px;padding-bottom:10px}
 .shell.portal .gateway-brand{height:61px}
 .shell.portal .gateway-intro h1{font-size:clamp(48px,5vw,73px);margin:5px auto 6px}
 .shell.portal .gateway-options{max-height:clamp(250px,43dvh,345px)}
}
@media(max-width:700px){
 .shell.portal .gateway{
  min-height:100dvh;height:100dvh;padding:clamp(9px,1.8dvh,17px) 14px clamp(10px,1.5dvh,15px);
  row-gap:clamp(8px,1.25dvh,12px)
 }
 .shell.portal .portal-switches{top:clamp(12px,1.6dvh,19px);left:14px;gap:7px}
 .shell.portal .portal-switches .control{width:37px;height:37px;font-size:13px}
 .shell.portal .gateway-brand{height:clamp(48px,7dvh,64px);margin-bottom:5px}
 .shell.portal .gateway-brand img{max-width:110px}
 .shell.portal .gateway-intro .tiny-label{font-size:8px;letter-spacing:1px}
 .shell.portal .gateway-intro h1{
  font-size:clamp(33px,8.9vw,44px);letter-spacing:-.04em;
  line-height:1.09;margin:6px auto 6px
 }
 .shell.portal .gateway-intro p{max-width:360px;font-size:clamp(11px,3vw,13px);line-height:1.5}
 .shell.portal .gateway-options{
   flex:1 1 auto;width:100%;max-width:530px;min-height:0;height:auto;
   max-height:clamp(310px,46dvh,392px);
   grid-template-columns:1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:clamp(8px,1.2dvh,12px)
 }
 .shell.portal .gateway-option{height:100%;min-height:0;border-radius:24px}
 .shell.portal .gateway-option-content{padding:clamp(14px,3.5vw,19px)}
 .shell.portal .gateway-option-content h2{font-size:clamp(22px,5.5vw,28px);margin:4px 0 9px}
 .shell.portal .option-symbol{font-size:clamp(53px,13vw,70px)}
 .shell.portal .gateway-end{font-size:8px;line-height:1.35;margin:auto auto 0}
}
@media(max-width:700px) and (max-height:690px){
 .shell.portal .gateway{row-gap:7px;padding-top:7px;padding-bottom:8px}
 .shell.portal .gateway-brand{height:46px;margin-bottom:1px}
 .shell.portal .gateway-intro h1{font-size:clamp(29px,7.5vw,36px);margin:3px auto 4px}
 .shell.portal .gateway-intro p{font-size:10px;line-height:1.37}
 .shell.portal .gateway-options{max-height:clamp(268px,44dvh,335px)}
 .shell.portal .gateway-option-content h2{font-size:21px;margin:3px 0 6px}
 .shell.portal .gateway-option-content{padding:12px 14px}
 .shell.portal .option-symbol{font-size:49px}
}
@media(max-height:535px){
 .shell.portal .gateway{height:auto;min-height:100dvh}
 .shell.portal .gateway-options{flex:0 0 auto;height:auto;min-height:260px}
}
@media(prefers-reduced-motion:reduce){.shell.portal .gateway-brand{animation:none!important}}


/* V54 — editorial breathing room for the standalone gateway */
/* The intro stays in normal document flow; only the space between its elements changes. */
.shell.portal .gateway{
  row-gap:clamp(15px,2.5dvh,28px);
  padding-top:clamp(19px,2.8dvh,31px);
  padding-bottom:clamp(16px,2dvh,22px);
}
.shell.portal .gateway-intro{
  display:flex;flex-direction:column;align-items:center;
  justify-content:flex-start;
}
.shell.portal .gateway-brand{
  flex:none;
  margin-bottom:clamp(12px,1.65dvh,18px);
}
.shell.portal .gateway-intro .tiny-label{
  flex:none;
  margin:0 0 clamp(13px,1.9dvh,20px);
}
.shell.portal .gateway-intro h1{
  flex:none;
  margin:0 auto clamp(12px,1.8dvh,19px);
  line-height:1.12;
}
.shell.portal .gateway-intro p{
  max-width:730px;
  font-size:clamp(13px,1.15vw,16px);
  line-height:1.65;
  margin:0 auto;
}
.shell.portal .gateway-options{
  margin:clamp(4px,.75dvh,10px) auto 0;
  max-height:clamp(230px,40dvh,360px);
}
.shell.portal .gateway-end{margin:auto auto 0}
@media(min-width:701px) and (max-height:790px){
  .shell.portal .gateway{row-gap:clamp(11px,1.7dvh,18px);padding-top:12px;padding-bottom:10px}
  .shell.portal .gateway-brand{height:clamp(50px,7dvh,66px);margin-bottom:clamp(7px,1.15dvh,12px)}
  .shell.portal .gateway-intro .tiny-label{margin-bottom:clamp(9px,1.35dvh,13px)}
  .shell.portal .gateway-intro h1{margin-bottom:clamp(10px,1.4dvh,15px)}
  .shell.portal .gateway-options{margin-top:5px;max-height:clamp(235px,39dvh,320px)}
}
@media(max-width:700px){
  .shell.portal .gateway{padding-top:clamp(12px,2dvh,19px);padding-bottom:12px;row-gap:clamp(13px,2.2dvh,20px)}
  .shell.portal .gateway-brand{height:clamp(49px,7.1dvh,64px);margin-bottom:clamp(8px,1.25dvh,14px)}
  .shell.portal .gateway-intro .tiny-label{margin:0 0 clamp(9px,1.45dvh,14px)}
  .shell.portal .gateway-intro h1{margin:0 auto clamp(11px,1.65dvh,15px);line-height:1.13}
  .shell.portal .gateway-intro p{font-size:clamp(11px,3vw,13px);line-height:1.6;max-width:355px}
  .shell.portal .gateway-options{margin:clamp(5px,1dvh,11px) auto 0;max-height:clamp(285px,45dvh,370px);gap:clamp(12px,1.7dvh,16px)}
  .shell.portal .gateway-end{margin:auto auto 0}
}
@media(max-width:700px) and (max-height:700px){
  .shell.portal .gateway{padding-top:8px;padding-bottom:8px;row-gap:clamp(8px,1.25dvh,12px)}
  .shell.portal .gateway-brand{height:46px;margin-bottom:6px}
  .shell.portal .gateway-intro .tiny-label{margin-bottom:8px}
  .shell.portal .gateway-intro h1{margin:0 auto 8px;line-height:1.12}
  .shell.portal .gateway-intro p{line-height:1.45}
  .shell.portal .gateway-options{margin-top:3px;max-height:clamp(270px,44dvh,315px);gap:9px}
}
@media(max-height:560px){
  .shell.portal .gateway{height:auto;min-height:100dvh}
  .shell.portal .gateway-options{flex:0 0 auto;min-height:250px}
}
/* V54 final optical spacing balance after viewport checks. */
@media(min-width:701px){
 .shell.portal .gateway-brand{margin-bottom:clamp(18px,2.4dvh,24px)}
 .shell.portal .gateway-intro .tiny-label{margin-bottom:clamp(17px,2.25dvh,22px)}
 .shell.portal .gateway-intro h1{margin-bottom:clamp(17px,2.2dvh,22px)}
 .shell.portal .gateway-options{margin-top:clamp(21px,3dvh,29px)}
}
@media(min-width:701px) and (max-height:790px){
 .shell.portal .gateway-brand{margin-bottom:12px}
 .shell.portal .gateway-intro .tiny-label{margin-bottom:13px}
 .shell.portal .gateway-intro h1{margin-bottom:13px}
 .shell.portal .gateway-options{margin-top:clamp(17px,2.6dvh,24px)}
}
@media(max-width:700px){
 .shell.portal .gateway-brand{margin-bottom:13px}
 .shell.portal .gateway-intro .tiny-label{margin-bottom:13px}
 .shell.portal .gateway-intro h1{margin-bottom:16px}
 .shell.portal .gateway-options{margin-top:clamp(17px,2.65dvh,25px)}
}
@media(max-width:700px) and (max-height:700px){
 .shell.portal .gateway-brand{margin-bottom:8px}
 .shell.portal .gateway-intro .tiny-label{margin-bottom:9px}
 .shell.portal .gateway-intro h1{margin-bottom:9px}
 .shell.portal .gateway-options{margin-top:10px}
}


/* V55 — align gateway CTA positions consistently in both cards */
.shell.portal .gateway-option-content{align-items:flex-end}
.shell.portal .gateway-option-content > div:last-child{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-self:stretch;
  min-height:100%;
  flex:1 1 auto;
}
.shell.portal .gateway-option-content h2{margin-bottom:12px}
.shell.portal .gateway-option-content .option-cta{margin-top:auto;align-self:flex-start}
@media(max-width:700px){
  .shell.portal .gateway-option-content > div:last-child{min-height:100%}
  .shell.portal .gateway-option-content .option-cta{margin-top:auto}
}


/* V56 — natural vertical balance for welcome. Flexible spare-space tracks, no JS centering. */
.shell.portal .gateway{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  height:100dvh;
  min-height:100dvh;
  max-width:1620px;
  padding-top:clamp(14px,2.3dvh,27px);
  padding-bottom:max(12px,env(safe-area-inset-bottom));
  gap:clamp(9px,1.55dvh,16px);
}
/* Pseudo-items share leftover space proportionally; intro/cards remain in normal flow. */
.shell.portal .gateway::before,
.shell.portal .gateway::after{
  content:"";
  display:block;
  width:1px;
  min-height:0;
  pointer-events:none;
}
.shell.portal .gateway::before{order:1;flex:1.22 1 0}
.shell.portal .gateway-intro{order:2;flex:0 0 auto;max-width:960px;margin:0 auto}
.shell.portal .gateway-options{
  order:3;
  flex:0 0 auto;
  width:100%;
  height:clamp(260px,35dvh,330px);
  min-height:0;
  max-height:none;
  margin:0 auto;
}
.shell.portal .gateway::after{order:4;flex:.78 1 0}
.shell.portal .gateway-end{order:5;flex:0 0 auto;width:100%;margin:0 auto;max-width:1180px}
/* Match the card CTAs at the same vertical baseline without affecting text layout. */
.shell.portal .gateway-option-content > div:last-child{min-width:0}
.shell.portal .gateway-option-content .option-cta{margin-top:auto}
@media(min-width:701px) and (max-height:780px){
  .shell.portal .gateway{gap:clamp(7px,1.2dvh,12px);padding-top:9px;padding-bottom:9px}
  .shell.portal .gateway-options{height:clamp(215px,35dvh,285px);margin:0 auto}
}
@media(max-width:700px){
  .shell.portal .gateway{padding:clamp(10px,1.7dvh,16px) 14px max(10px,env(safe-area-inset-bottom));gap:clamp(8px,1.25dvh,12px)}
  .shell.portal .gateway::before{flex-grow:1.3}
  .shell.portal .gateway::after{flex-grow:.7}
  .shell.portal .gateway-options{
    width:100%;max-width:530px;
    flex:0 0 auto;height:clamp(285px,42dvh,365px);
    max-height:none;min-height:0;
    grid-template-columns:1fr;grid-template-rows:repeat(2,minmax(0,1fr));
    margin:0 auto;gap:clamp(9px,1.3dvh,13px);
  }
  .shell.portal .gateway-end{margin:0 auto}
}
@media(max-width:700px) and (max-height:700px){
  .shell.portal .gateway{padding-top:8px;padding-bottom:8px;gap:7px}
  .shell.portal .gateway-options{height:clamp(245px,42dvh,290px);margin:0 auto;gap:9px}
  .shell.portal .gateway::before{flex-grow:1.1}
  .shell.portal .gateway::after{flex-grow:.9}
}
/* Only exceptionally short viewports scroll; never crop the two entry links. */
@media(max-height:550px){
  .shell.portal{overflow-y:visible}
  .shell.portal .gateway{height:auto;min-height:100dvh}
  .shell.portal .gateway::before,.shell.portal .gateway::after{min-height:0;flex-basis:0}
  .shell.portal .gateway-options{height:250px;flex-shrink:0}
}
@media(max-width:700px) and (max-height:570px){
  .shell.portal .gateway{height:auto;min-height:100dvh}
  .shell.portal .gateway-options{height:250px}
}

/* V57 — true geometric centering for the desktop navigation.
   Equal-width side tracks keep the links centered irrespective of
   differences between the logo and action-button widths. */
@media (min-width:1021px){
  .shell.business .site-topbar,
  .shell.marketing .site-topbar{
    display:grid;
    grid-template-columns:minmax(0,1fr) max-content minmax(0,1fr);
    align-items:center;
    column-gap:clamp(9px,1.3vw,22px);
    padding-inline:16px;
  }
  .shell.business .site-topbar .brand-logo,
  .shell.marketing .site-topbar .brand-logo{
    grid-column:1;
    justify-self:start;
  }
  .shell.business .site-topbar .desktop-links,
  .shell.marketing .site-topbar .desktop-links{
    grid-column:2;
    justify-self:center;
    justify-content:center;
    gap:clamp(12px,1.85vw,32px);
    white-space:nowrap;
  }
  .shell.business .site-topbar .nav-actions,
  .shell.marketing .site-topbar .nav-actions{
    grid-column:3;
    justify-self:end;
    white-space:nowrap;
  }
}
/* V58 — MARV BTS: editorial film experience, full uncropped original frames */
.shell.marketing .desktop-links{gap:clamp(12px,1.45vw,24px)}
.shell.marketing .desktop-links a{font-size:clamp(10px,.8vw,12px);white-space:nowrap}
.bts-teaser{position:relative;padding-top:clamp(58px,7vw,100px);padding-bottom:clamp(58px,7vw,100px);display:grid;grid-template-columns:minmax(225px,.72fr) minmax(0,1.65fr);align-items:center;gap:clamp(22px,3vw,50px);max-width:1500px}
.bts-teaser::before{content:'';position:absolute;inset:9% 2%;background:linear-gradient(133deg,color-mix(in srgb,var(--a) 13%,transparent),transparent 55%,color-mix(in srgb,var(--second) 13%,transparent));border-radius:clamp(24px,5vw,66px);z-index:-1;pointer-events:none}
.bts-teaser-intro{max-width:450px}
.bts-teaser-intro h2{font-weight:900;font-size:clamp(35px,4.3vw,66px);line-height:1.2;letter-spacing:-.038em;margin:16px 0}
.bts-teaser-intro p{color:var(--muted);line-height:1.9;font-size:clamp(13px,1.16vw,17px);margin:0 0 25px}
.bts-teaser-reel{display:grid;grid-template-columns:1.13fr .95fr .95fr;gap:clamp(8px,1.1vw,16px);align-items:center;min-width:0}
.bts-teaser-reel .bts-shot:nth-child(2){transform:translateY(-14px)}
.bts-teaser-reel .bts-shot:nth-child(2).visible{transform:translateY(-14px)!important}
.bts-teaser-reel .bts-shot:nth-child(3){transform:translateY(17px)}
.bts-teaser-reel .bts-shot:nth-child(3).visible{transform:translateY(17px)!important}
.bts-teaser-foot{grid-column:2;display:flex;justify-content:space-between;letter-spacing:.12em;font:700 10px Manrope,sans-serif;color:var(--muted);margin-top:-25px}
.bts-shot{min-width:0;position:relative;isolation:isolate}
.bts-shot-open{position:relative;display:block;width:100%;aspect-ratio:9/16;min-height:0;padding:0;border:1px solid color-mix(in srgb,var(--edge) 70%,transparent);background:color-mix(in srgb,var(--surface2) 78%,#060912);color:white;cursor:pointer;border-radius:clamp(18px,2.3vw,32px);overflow:hidden;box-shadow:0 20px 45px rgba(8,7,19,.14);transition:transform .42s var(--ease),box-shadow .42s var(--ease),border-color .3s}
.bts-shot-open:hover{transform:translateY(-7px);box-shadow:0 30px 65px rgba(8,7,19,.23);border-color:color-mix(in srgb,var(--a) 60%,transparent)}
.bts-shot-open:focus-visible{outline:3px solid var(--a);outline-offset:4px}
.bts-shot-open video{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:contain;pointer-events:none;background:#0b0c13;transition:filter .45s,transform .8s var(--ease)}
.bts-shot-open:hover video{transform:scale(1.02)}
.bts-video-gradient{position:absolute;inset:36% 0 0;background:linear-gradient(0deg,rgba(1,5,11,.89),rgba(1,5,11,.45) 37%,transparent);pointer-events:none}
.bts-play-icon{position:absolute;top:15px;inset-inline-end:15px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(248,248,255,.85);color:#181421;backdrop-filter:blur(15px);font-size:22px;transition:background .3s,transform .3s}
.bts-shot-open:hover .bts-play-icon{background:var(--a);transform:rotate(45deg)}
.bts-shot-label{position:absolute;bottom:clamp(14px,2.4vw,30px);inset-inline:clamp(13px,2vw,24px);text-align:start;display:flex;flex-direction:column;gap:5px}
.bts-shot-label small{font:750 clamp(8px,.68vw,11px) Manrope,sans-serif;letter-spacing:.15em;opacity:.85}
.bts-shot-label strong{font-size:clamp(11px,1.05vw,17px);line-height:1.4}
.bts-page .bts-cover{min-height:clamp(590px,78svh,800px);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(260px,.78fr);gap:clamp(30px,7vw,130px);align-items:center;position:relative;padding-top:clamp(45px,6vw,85px);padding-bottom:clamp(70px,8vw,125px)}
.bts-cover::before{content:'';position:absolute;inset:28px 15px 28px;background:radial-gradient(ellipse at 70% 27%,color-mix(in srgb,var(--a) 24%,transparent),transparent 50%),radial-gradient(ellipse at 8% 70%,color-mix(in srgb,var(--second) 17%,transparent),transparent 50%);border-radius:60px;z-index:-1;pointer-events:none;animation:bts-drift 14s ease-in-out infinite alternate}
@keyframes bts-drift{to{filter:hue-rotate(12deg);transform:scale(1.02)}}
.bts-cover-text{max-width:690px}
.bts-cover-text h1{font-weight:900;font-size:clamp(54px,7.2vw,112px);line-height:1.15;letter-spacing:-.055em;margin:20px 0}
.bts-cover-text p{max-width:550px;color:var(--muted);font-size:clamp(15px,1.35vw,21px);line-height:1.9}
.bts-cover-pills{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.bts-cover-media{width:min(100%,440px);justify-self:center;position:relative}
.bts-cover-media .bts-shot{width:min(100%,375px);margin-inline:auto}
.bts-cover-decoration{position:absolute;font:900 clamp(64px,12vw,170px) Manrope,sans-serif;letter-spacing:-.12em;bottom:-30px;inset-inline-end:-18px;color:var(--a);opacity:.75;z-index:2;pointer-events:none;line-height:.8}
.bts-cover-decoration span{font-size:18px;vertical-align:top}
.bts-marquee{padding:17px 0;overflow:hidden;border-block:1px solid var(--edge);color:var(--muted);font:800 13px Manrope,sans-serif;letter-spacing:5px;white-space:nowrap}
.bts-marquee span{display:block;width:max-content;animation:bts-scroll 42s linear infinite}
@keyframes bts-scroll{to{transform:translateX(-40%)}}
.bts-chapter{padding-top:clamp(60px,8vw,115px);padding-bottom:clamp(54px,7vw,95px)}
.bts-chapter:nth-of-type(2n){background:color-mix(in srgb,var(--surface2) 58%,transparent);border-radius:clamp(25px,4vw,60px)}
.bts-chapter-heading{display:grid;grid-template-columns:75px minmax(0,1fr) auto;gap:clamp(12px,2vw,32px);align-items:start;margin-bottom:clamp(24px,3vw,52px)}
.bts-chapter-heading .section-head{margin:0;gap:10px}
.bts-chapter-heading .section-head h2{font-size:clamp(29px,4.5vw,63px)}
.bts-chapter-index,.bts-chapter-count{color:var(--muted);font:700 12px Manrope,sans-serif;letter-spacing:.1em;white-space:nowrap;padding-top:9px}
.bts-collection{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(11px,1.8vw,25px);align-items:start}
.bts-collection .bts-shot:nth-child(6n + 2){margin-top:clamp(14px,3vw,40px)}
.bts-collection .bts-shot:nth-child(6n + 4){margin-top:clamp(26px,5vw,64px)}
.bts-collection-setup{grid-template-columns:minmax(0,300px);justify-content:center}
.bts-collection-setup .bts-shot{width:100%}
.bts-closing{border-radius:clamp(25px,4vw,60px);margin:40px max(10px,2vw);text-align:center;background:var(--surface2)}
.bts-closing h2{font-size:clamp(34px,5.5vw,75px);line-height:1.23;max-width:780px;margin:15px auto 29px}
.bts-closing p{font:700 12px Manrope,sans-serif;letter-spacing:.15em;color:var(--muted)}
.bts-lightbox{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;background:rgba(4,5,12,.92);backdrop-filter:blur(19px);-webkit-backdrop-filter:blur(19px);padding:clamp(12px,2vw,28px)}
.bts-lightbox-frame{display:flex;flex-direction:column;align-items:center;justify-content:center;height:min(90dvh,100%);max-width:calc(100vw - 44px);gap:8px}
.bts-lightbox-frame video{display:block;max-height:calc(90dvh - 38px);max-width:100%;height:auto;width:auto;aspect-ratio:9/16;object-fit:contain;border-radius:13px;background:#05060b}
.bts-lightbox-frame p{font-size:12px;color:white;text-align:center;margin:0}
.bts-lightbox-close{position:fixed;top:clamp(14px,4dvh,37px);right:clamp(14px,4vw,48px);z-index:2;background:#fff;color:#151221;border:0;border-radius:50%;width:43px;height:43px;font-size:30px;cursor:pointer;display:grid;place-items:center}
@media (max-width:1100px){.bts-teaser{grid-template-columns:1fr;gap:25px}.bts-teaser-intro{max-width:740px}.bts-teaser-reel{max-width:850px;margin:auto;width:100%}.bts-teaser-foot{grid-column:1;margin-top:0}.bts-collection{grid-template-columns:repeat(3,minmax(0,1fr))}.bts-cover-text h1{font-size:clamp(44px,7vw,76px)}}
@media (max-width:700px){.bts-teaser{padding:58px 19px 70px;gap:20px}.bts-teaser-intro h2{font-size:clamp(32px,8vw,44px);margin:13px 0}.bts-teaser-reel{grid-template-columns:1.12fr .94fr;gap:10px}.bts-teaser-reel .bts-shot:nth-child(3){display:none}.bts-teaser-reel .bts-shot:nth-child(2){transform:translateY(13px)}.bts-teaser-reel .bts-shot:nth-child(2).visible{transform:translateY(13px)!important}.bts-teaser-foot{font-size:9px}.bts-shot-label strong{font-size:12px}.bts-shot-label small{font-size:8px}.bts-shot-open{border-radius:19px}.bts-play-icon{top:10px;inset-inline-end:10px;width:31px;height:31px;font-size:17px}.bts-page .bts-cover{grid-template-columns:1fr;min-height:unset;padding-top:50px;padding-bottom:48px;gap:32px}.bts-cover-text h1{font-size:clamp(44px,11vw,62px)}.bts-cover-text p{font-size:14px;line-height:1.8}.bts-cover-media{max-width:300px}.bts-cover-media .bts-shot{max-width:230px}.bts-cover-decoration{font-size:85px;bottom:-14px}.bts-chapter{padding:61px 15px}.bts-chapter-heading{grid-template-columns:42px minmax(0,1fr);gap:7px}.bts-chapter-index,.bts-chapter-count{font-size:9px}.bts-chapter-count{display:none}.bts-chapter-heading .section-head h2{font-size:clamp(28px,8vw,40px)}.bts-collection{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.bts-collection .bts-shot:nth-child(6n + 2){margin-top:12px}.bts-collection .bts-shot:nth-child(6n + 4){margin-top:16px}.bts-collection-setup{grid-template-columns:minmax(0,220px)}.bts-closing{padding:52px 20px;margin:20px 8px}.bts-closing h2{font-size:37px}.bts-lightbox-frame video{max-height:80dvh}}
@media(prefers-reduced-motion:reduce){.bts-marquee span,.bts-cover::before{animation:none!important}.bts-teaser-reel .bts-shot{transform:none!important}}


/* MARV V59 — balanced multi-take setup and horizontally centered story panel */
.bts-page .bts-collection-setup{
  width:100%;
  max-width:1230px;
  margin-inline:auto;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:start;
  justify-content:center;
  gap:clamp(12px,1.6vw,23px);
}
.bts-page .bts-collection-setup .bts-shot{
  width:100%;
  min-width:0;
  margin-top:0;
}
.bts-page .bts-collection-setup .bts-shot .bts-shot-open{
  width:100%;aspect-ratio:9 / 16;
}
.bts-page .bts-closing.section-pad{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  width:min(calc(100% - 40px),1320px);
  max-width:1320px;
  margin:clamp(35px,5vw,72px) auto;
  padding:clamp(54px,7vw,110px) clamp(22px,4vw,65px);
  text-align:center;
}
.bts-page .bts-closing h2{
  max-width:800px;
  margin:15px auto 28px;
  text-align:center;
}
.bts-page .bts-closing .pill{align-self:center}
@media (max-width:1050px){
  .bts-page .bts-collection-setup{grid-template-columns:repeat(2,minmax(0,1fr));max-width:630px;gap:clamp(12px,2vw,22px)}
}
@media (max-width:700px){
  .bts-page .bts-collection-setup{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    max-width:560px;
  }
  .bts-page .bts-collection-setup .bts-shot{margin-top:0!important}
  .bts-page .bts-closing.section-pad{
    width:calc(100% - 24px);
    margin:28px auto;
    padding:clamp(43px,9vw,65px) 20px;
    border-radius:clamp(22px,6vw,34px);
  }
  .bts-page .bts-closing h2{font-size:clamp(29px,8.4vw,40px);line-height:1.35;margin:13px auto 22px}
}

/* V61 — portfolio editorial: same visual grammar as Behind the Scenes. */
.portfolio-editorial-page .portfolio-chapter{max-width:1500px;margin-inline:auto;padding-block:clamp(54px,7vw,108px)}
.portfolio-editorial-page .portfolio-chapter-heading{margin-bottom:clamp(25px,4vw,55px)}
.portfolio-editorial-page .portfolio-editorial-inner{max-width:1280px;margin-inline:auto;padding:0!important}
.portfolio-editorial-page .portfolio-section-title{display:flex;align-items:baseline;justify-content:space-between;gap:15px;margin:clamp(28px,4vw,55px) 0 23px}
.portfolio-editorial-page .portfolio-reel{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.7vw,23px);width:100%}
.portfolio-editorial-page .portfolio-reel .bts-shot{min-width:0}
.portfolio-editorial-page .portfolio-editorial-images{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.5vw,19px);align-items:start}
.portfolio-editorial-page .portfolio-image-card{width:100%;height:auto;aspect-ratio:4/5;border:0;overflow:hidden;border-radius:clamp(16px,2vw,27px);background:var(--surface2);box-shadow:0 14px 45px #0001}
.portfolio-editorial-page .portfolio-image-card img{width:100%;height:100%;object-fit:contain!important;background:var(--surface2);border-radius:0!important}
.portfolio-editorial-page .portfolio-image-card:hover{transform:translateY(-5px)}
.portfolio-editorial-page .portfolio-chapter + .portfolio-chapter{border-top:1px solid var(--edge)}
@media(max-width:1100px){.portfolio-editorial-page .portfolio-reel{grid-template-columns:repeat(3,minmax(0,1fr))}.portfolio-editorial-page .portfolio-editorial-images{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.portfolio-editorial-page .portfolio-chapter{padding:61px 15px}.portfolio-editorial-page .portfolio-reel,.portfolio-editorial-page .portfolio-editorial-images{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.portfolio-editorial-page .portfolio-reel .bts-shot{margin-top:0!important}.portfolio-editorial-page .portfolio-reel .bts-shot:nth-child(even){margin-top:13px!important}.portfolio-editorial-page .portfolio-section-title{display:block;margin:27px 0 18px}.portfolio-editorial-page .portfolio-section-title span{display:block;margin-top:7px}}

/* V63 — Seamless translated tickers, same visual identity. */
.moving-band,.bts-marquee{direction:ltr;overflow:hidden}
.moving-band .moving-band-inner,.bts-marquee .bts-marquee-track{
 display:flex;gap:0;width:max-content;animation:marv-seamless-track 35s linear infinite;
 will-change:transform;direction:ltr;transform:translate3d(0,0,0)
}
.moving-band .loop-band-copy,.bts-marquee .loop-band-copy{display:flex;flex:none;align-items:center;gap:clamp(24px,3vw,60px);padding-inline-end:clamp(24px,3vw,60px);width:max-content;white-space:nowrap}
.moving-band .loop-band-copy span,.bts-marquee .loop-band-copy span{flex:none;width:max-content;min-width:0}
.bts-marquee .bts-marquee-track{animation-duration:43s}
@keyframes marv-seamless-track{to{transform:translate3d(-50%,0,0)}}
/* Keep the original gateway design; reduce repainting and entrance delay. */
.shell.portal .gateway-shot{animation:none;transform:scale(1.035);transition:transform .48s ease-out}
.shell.portal .gateway-option:hover .gateway-shot{transform:scale(1.085)}
.shell.portal .gateway-option{transition:transform .25s ease-out,border-radius .25s ease-out}
.shell.portal .gateway-option:hover{transform:translateY(-3px)}
.shell.portal .gateway-intro.reveal{transition:opacity .38s ease-out,transform .38s ease-out}
.shell.portal .gateway-brand{animation-duration:.5s}
.shell.portal .gateway-ambient{animation:none}
@media(max-width:700px){.shell.portal .gateway-option:hover{transform:none}}
@media(prefers-reduced-motion:reduce){
 .moving-band .moving-band-inner,.bts-marquee .bts-marquee-track{animation:none!important;will-change:auto}
 .shell.portal .gateway-brand,.shell.portal .gateway-shot{animation:none!important}
 .shell.portal .gateway-intro.reveal{transition:none!important}
}
/* Prevent legacy single-span animation from fighting the unified track. */
.bts-marquee .loop-band-copy span{animation:none!important}

/* V64 — Slow, silky image zoom inside the two gateway cards. */
@keyframes marvPortalCardSlowZoom {
  0% { transform:translate3d(0,0,0) scale(1.035); }
  100% { transform:translate3d(0,0,0) scale(1.12); }
}
.shell.portal .gateway-option .gateway-shot {
  animation:marvPortalCardSlowZoom 30s cubic-bezier(.45,0,.55,1) infinite alternate!important;
  animation-play-state:running!important;
  transform-origin:center center;
  transition:none!important;
  backface-visibility:hidden;
}
.shell.portal .gateway-option:hover .gateway-shot {
  animation-play-state:running!important;
}
@media(prefers-reduced-motion:reduce){
  .shell.portal .gateway-option .gateway-shot {
    animation:none!important;
    transform:scale(1.035)!important;
  }
}

/* V66 — more perceptible, still gentle zoom on gateway card photos. */
@keyframes marvPortalCardVisibleZoom {
  from { transform:translate3d(0,0,0) scale(1.04); }
  to { transform:translate3d(0,0,0) scale(1.25); }
}
.shell.portal .gateway-option .gateway-shot {
  animation:marvPortalCardVisibleZoom 26s ease-in-out infinite alternate!important;
  transform-origin:center center;
  transition:none!important;
  will-change:transform;
}
.shell.portal .gateway-option:hover .gateway-shot {animation-play-state:running!important;}
@media(prefers-reduced-motion:reduce) {
  .shell.portal .gateway-option .gateway-shot {animation:none!important;transform:scale(1.04)!important;will-change:auto;}
}

/* V73 — static poster previews, touch-first iOS support and lighter mobile rendering */
.bts-shot-open .bts-static-poster{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;background:#0b0c13;pointer-events:none;transform:none!important;transition:none!important}
.bts-shot-open .bts-play-icon{top:50%;left:50%;right:auto;inset-inline-end:auto;transform:translate(-50%,-50%)!important;width:clamp(42px,4.5vw,62px);height:clamp(42px,4.5vw,62px);font-size:clamp(18px,2vw,25px);border:1px solid rgba(255,255,255,.55);color:#14151b;background:rgba(255,255,255,.9);box-shadow:0 4px 25px rgba(0,0,0,.3);-webkit-backdrop-filter:none;backdrop-filter:none}
.bts-shot-open:hover .bts-play-icon{transform:translate(-50%,-50%) scale(1.07)!important;background:#fff}
.bts-shot-open .bts-shot-label{pointer-events:none}
@supports (-webkit-touch-callout:none){
  .shell,.site-topbar,.mobile-nav,.bts-page,.portfolio-editorial-page{min-width:0}
  .bts-shot-open,.portfolio-image-card,.bts-static-poster{-webkit-transform:translateZ(0);transform:translateZ(0)}
  .bts-lightbox{-webkit-backdrop-filter:none;backdrop-filter:none}
  .bts-lightbox-frame{max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px)}
  .bts-lightbox-frame video{max-height:calc(100vh - 120px);max-height:calc(100dvh - 120px)}
}
@media(max-width:700px){
  .bts-shot-open:hover{transform:none;box-shadow:0 8px 22px rgba(8,7,19,.14)}
  .bts-shot-open .bts-play-icon{width:42px;height:42px;font-size:18px}
  .bts-collection .bts-shot,.portfolio-reel .bts-shot{margin-top:0!important}
  .bts-shot-open{box-shadow:0 8px 22px rgba(8,7,19,.14)}
  .bts-page .bts-chapter,.portfolio-editorial-page .portfolio-chapter{content-visibility:auto;contain-intrinsic-size:auto 900px}
  .bts-marquee span,.bts-cover::before{animation:none!important}
  .reveal,.reveal.visible{transition-duration:.24s!important;transition-delay:0s!important}
  .shell.portal .gateway-option .gateway-shot{animation-duration:45s!important;will-change:auto}
}
@media(hover:none){.bts-shot-open:hover .bts-static-poster{transform:none!important}}
@media(prefers-reduced-motion:reduce){.bts-shot-open,.bts-play-icon{transition:none!important}}

/* V73 — no resident video decoders on marketing home either */
.v73-motion-open{position:relative;display:block;width:100%;height:100%;min-height:0;padding:0;border:0;background:#0b0c13;color:#111;cursor:pointer;overflow:hidden}
.v73-motion-open img{display:block;width:100%;height:100%;object-fit:contain}
.v73-motion-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.9);box-shadow:0 5px 20px rgba(0,0,0,.3);font-size:21px}
@media(max-width:700px){.v73-motion-play{width:43px;height:43px;font-size:18px}}

/* V74 — center play badge in both RTL and LTR layouts.
   Physical inset shorthand deliberately overrides the old logical inset-inline-end
   (in RTL it mapped to left:auto and displaced the play badge). */
.bts-shot-open > .bts-play-icon{
  inset:50% auto auto 50%!important;
  translate:none;
  transform:translate(-50%,-50%)!important;
  margin:0!important;
  z-index:3;
  pointer-events:none;
}
.bts-shot-open:hover > .bts-play-icon{
  transform:translate(-50%,-50%) scale(1.07)!important;
}

/* V77 — unified editorial lightbox controls: optical alignment and accessible touch targets */
.lightbox,.bts-lightbox{isolation:isolate}
.lightbox button.lightbox-close,.lightbox button.lightbox-prev,.lightbox button.lightbox-next,
.bts-lightbox button.bts-lightbox-close{
  position:absolute;z-index:12;display:flex;align-items:center;justify-content:center;
  box-sizing:border-box;flex:0 0 auto;width:48px;height:48px;padding:0;margin:0;
  border-radius:50%;border:1px solid rgba(255,255,255,.24);
  background:rgba(30,31,43,.75);color:#faf9ff;
  box-shadow:0 8px 28px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.07);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  appearance:none;-webkit-appearance:none;
  font-size:0;line-height:1;cursor:pointer;
  transform:none;transition:background-color .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.lightbox button svg,.bts-lightbox button.bts-lightbox-close svg{display:block;width:21px;height:21px;flex:none;overflow:visible}
.lightbox button.lightbox-close,.bts-lightbox button.bts-lightbox-close{top:max(20px,env(safe-area-inset-top));right:max(20px,env(safe-area-inset-right));left:auto;bottom:auto}
.lightbox button.lightbox-prev{left:max(18px,env(safe-area-inset-left));right:auto;top:50%;translate:0 -50%}
.lightbox button.lightbox-next{right:max(18px,env(safe-area-inset-right));left:auto;top:50%;translate:0 -50%}
.lightbox button:is(:hover,:focus-visible),.bts-lightbox button.bts-lightbox-close:is(:hover,:focus-visible){background:rgba(67,67,81,.95);border-color:rgba(255,255,255,.65);box-shadow:0 10px 32px rgba(0,0,0,.35)}
.lightbox button:focus-visible,.bts-lightbox button.bts-lightbox-close:focus-visible{outline:2px solid white;outline-offset:3px}
.lightbox-count{pointer-events:none}
@media(max-width:700px){
  .lightbox button.lightbox-close,.lightbox button.lightbox-prev,.lightbox button.lightbox-next,
  .bts-lightbox button.bts-lightbox-close{width:42px;height:42px}
  .lightbox button svg,.bts-lightbox button.bts-lightbox-close svg{width:19px;height:19px}
  .lightbox button.lightbox-close,.bts-lightbox button.bts-lightbox-close{top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right))}
  .lightbox button.lightbox-prev{left:max(6px,env(safe-area-inset-left))}
  .lightbox button.lightbox-next{right:max(6px,env(safe-area-inset-right))}
}
@media(prefers-reduced-motion:reduce){.lightbox button,.bts-lightbox button.bts-lightbox-close{transition:none}}

/* V79 — iPhone/Safari final CTA: avoid color emoji replacing the decorative glyph. */
.final-cta{isolation:isolate}
.final-cta>.final-blob{
  position:absolute;
  z-index:0;
  width:clamp(210px,43vw,560px);
  height:auto;
  aspect-ratio:1;
  top:50%;
  inset-inline-end:-8%;
  transform:translateY(-50%);
  border:clamp(16px,3vw,45px) solid currentColor;
  border-radius:50%;
  opacity:.075;
  font-size:0;
  line-height:0;
  background:transparent;
  color:var(--on-a);
  pointer-events:none;
}
.final-cta>.final-blob::before,.final-cta>.final-blob::after{
  content:"";position:absolute;inset:16%;border:clamp(8px,1.4vw,20px) solid currentColor;border-radius:50%;
}
.final-cta>.final-blob::after{inset:37%;border-width:clamp(5px,.9vw,12px)}
.final-cta> :not(.final-blob){position:relative;z-index:1}
@media(max-width:700px){
  .final-cta{min-height:360px;overflow:hidden}
  .final-cta>.final-blob{width:min(68vw,260px);top:50%;inset-inline-end:-19%;border-width:17px;opacity:.065}
  .final-cta>.final-blob::before{border-width:9px}
  .final-cta>.final-blob::after{border-width:6px}
  .final-cta h2{font-size:clamp(28px,8vw,36px);overflow-wrap:anywhere}
}


/* V80 - uniform platform-independent CSS-drawn iconography */
.marv-spark{display:inline-block;position:relative;width:1em;height:1em;min-width:1em;vertical-align:-.12em;line-height:1;font-size:inherit;isolation:isolate;color:inherit}
.marv-spark::before{content:"";position:absolute;inset:2%;background:currentColor;clip-path:polygon(44% 0,56% 0,58% 30%,76% 8%,85% 16%,65% 40%,100% 43%,100% 56%,65% 60%,85% 84%,76% 93%,58% 69%,56% 100%,44% 100%,42% 69%,24% 93%,15% 84%,35% 60%,0 56%,0 43%,35% 40%,15% 16%,24% 8%,42% 30%)}
.marv-moon,.marv-sun{display:inline-block;width:18px;height:18px;position:relative;vertical-align:middle;color:inherit;flex:none}
.marv-moon::before{content:"";position:absolute;inset:2px;border-radius:50%;box-shadow:-4px 2px 0 0 currentColor;transform:translateX(4px)}
.marv-sun::before{content:"";position:absolute;inset:5px;border-radius:50%;background:currentColor}
.marv-sun::after{content:"";position:absolute;inset:0;border:2px dashed currentColor;border-radius:50%}
/* Suppress Safari emoji composition on legacy decorative lettering */
.page-banner-glyph,.about-figure,.large-symbol,.studio-auth-mark,.studio-dot{font-family:Manrope,Arial,sans-serif}
.page-banner-glyph,.about-figure,.studio-page-hero::after,.studio-auth-art::after{font-size:0!important;pointer-events:none}
.page-banner-glyph::before,.about-figure::before,.studio-page-hero::after,.studio-auth-art::after{content:"";display:block;background:currentColor;clip-path:polygon(44% 0,56% 0,58% 30%,76% 8%,85% 16%,65% 40%,100% 43%,100% 56%,65% 60%,85% 84%,76% 93%,58% 69%,56% 100%,44% 100%,42% 69%,24% 93%,15% 84%,35% 60%,0 56%,0 43%,35% 40%,15% 16%,24% 8%,42% 30%)}
.page-banner-glyph::before{width:clamp(130px,28vw,410px);height:clamp(130px,28vw,410px)}
.about-figure::before{width:min(78%,360px);aspect-ratio:1;margin:auto}
.studio-page-hero::after{width:clamp(100px,20vw,240px);aspect-ratio:1;top:10%;inset-inline-end:4%;opacity:.38}
.studio-auth-art::after{width:clamp(240px,55vw,650px);aspect-ratio:1;bottom:-190px;left:-190px;opacity:.4}
@media(max-width:700px){.page-banner-glyph::before{width:150px;height:150px}.about-figure::before{width:180px}.studio-auth-art::after{width:260px;bottom:-85px;left:-75px}}

/* V80: CSS play icons, never native emoji glyphs */
.bts-play-icon,.v73-motion-play{font-size:0!important;display:grid!important;place-items:center}
.bts-play-icon::before,.v73-motion-play::before{content:"";display:block;width:20px;height:24px;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%);transform:translateX(2px)}


/* V81: platform-independent icons; no Unicode arrows or emoji glyphs in controls. */
.marv-arrow{display:inline-block!important;position:relative!important;box-sizing:border-box!important;flex:none!important;width:1.05em!important;height:1.05em!important;min-width:0!important;min-height:0!important;font-size:inherit!important;line-height:1!important;vertical-align:-.12em!important;transform:none!important;background:transparent!important;border:0!important;border-radius:0!important;color:inherit!important;filter:none!important;box-shadow:none!important;isolation:isolate!important}
.marv-arrow::before{content:""!important;position:absolute!important;width:63%!important;height:1.6px!important;top:48%!important;left:19%!important;transform:rotate(-45deg)!important;transform-origin:center!important;background:currentColor!important;border:0!important;opacity:1!important}
.marv-arrow::after{content:""!important;position:absolute!important;width:46%!important;height:46%!important;top:15%!important;right:13%!important;border-top:1.8px solid currentColor!important;border-right:1.8px solid currentColor!important;transform:none!important;clip-path:none!important;background:transparent!important;border-radius:0!important;opacity:1!important}
.marv-arrow-back{transform:rotate(225deg)!important}.marv-arrow-down{transform:rotate(135deg)!important}
.marv-refresh,.marv-mail,.marv-menu,.marv-play{display:inline-block;position:relative;flex:none;width:1em;height:1em;font-size:inherit;vertical-align:-.1em;color:inherit}
.marv-refresh::before{content:"";position:absolute;inset:18%;border:2px solid currentColor;border-right-color:transparent;border-radius:50%}
.marv-refresh::after{content:"";position:absolute;right:7%;top:13%;border:4px solid transparent;border-bottom-color:currentColor;transform:rotate(40deg)}
.marv-menu::before{content:"";position:absolute;inset:18% 9%;border-top:2px solid currentColor;border-bottom:2px solid currentColor}
.marv-menu::after{content:"";position:absolute;left:9%;right:9%;top:50%;border-top:2px solid currentColor}
.marv-mail::before{content:"";position:absolute;inset:15% 5%;border:1.5px solid currentColor;border-radius:3px}
.marv-mail::after{content:"";position:absolute;left:20%;top:26%;width:58%;height:45%;border-bottom:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)}
.marv-play::before{content:"";position:absolute;left:28%;top:16%;width:0;height:0;border-top:.35em solid transparent;border-bottom:.35em solid transparent;border-left:.52em solid currentColor}
/* Decorative arrows have their own fixed artwork, never text at 200–600px. */
.statement-mark{display:flex;align-items:center;justify-content:center;width:clamp(110px,18vw,235px);height:clamp(110px,18vw,235px);bottom:-35px;left:2%;font-size:45px!important;pointer-events:none}
.statement-mark .marv-arrow{font-size:clamp(90px,16vw,210px)!important}
.large-symbol .marv-arrow{font-size:clamp(88px,13vw,190px)!important}
.page-banner-glyph .marv-arrow,.about-figure .marv-arrow{font-size:inherit}
/* Robust mobile geometry and navigation for Safari/WebKit and Android. */
@media(max-width:700px){
 .marv-arrow{width:1.05em!important;height:1.05em!important}
 .v46-sector-arrow .marv-arrow,.service-arrow .marv-arrow,.process-card i .marv-arrow{font-size:20px!important}
 .process-card i{display:grid;place-items:center;width:25px;height:25px;font-size:20px!important;font-style:normal;line-height:1}
 .process-card>span{align-items:center}
 .v46-sector-card,.v46-journey-card{min-width:0;overflow:hidden}
 .v46-sector-card h3,.v46-journey-card h3{overflow-wrap:break-word}
 .statement-mark{bottom:-12px;left:0;width:125px;height:125px}
 .statement-mark .marv-arrow{font-size:105px!important;opacity:.28}
 .final-cta>.pill,.final-cta>p,.final-cta>h2,.final-cta>span{position:relative;z-index:2}
}
@media(prefers-reduced-motion:reduce){.marv-arrow,.marv-refresh,.marv-menu,.marv-mail,.marv-play{animation:none!important;transition:none!important}}

/* V82: platform-independent theme / language controls, responsive and accessible */
#theme-switch,#lang-switch{box-sizing:border-box;display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;vertical-align:middle;min-width:42px;width:42px;height:42px;padding:0;border:1px solid var(--edge);border-radius:15px;background:var(--surface2);color:var(--ink);font-family:Manrope,Arial,sans-serif;line-height:1;appearance:none;-webkit-appearance:none;cursor:pointer;transition:background-color .22s ease,border-color .22s ease,color .22s ease,box-shadow .22s ease,transform .22s ease}
#theme-switch:hover,#lang-switch:hover{transform:translateY(-1px);background:var(--a);color:var(--on-a)}
#theme-switch:active,#lang-switch:active{transform:scale(.96)}
#theme-switch:focus-visible,#lang-switch:focus-visible{outline:2px solid var(--a);outline-offset:3px}
.marv-mode-svg{width:21px;height:21px;display:block;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.marv-mode-sun-core,.marv-mode-rays,.marv-mode-moon-path{transition:opacity .24s ease,transform .3s ease;transform-origin:center}
[data-theme="light"] .marv-mode-moon-path{opacity:1;transform:scale(1)}
[data-theme="light"] .marv-mode-rays,[data-theme="light"] .marv-mode-sun-core{opacity:0;transform:scale(.66)}
[data-theme="dark"] .marv-mode-rays,[data-theme="dark"] .marv-mode-sun-core{opacity:1;transform:scale(1)}
[data-theme="dark"] .marv-mode-moon-path{opacity:0;transform:scale(.66)}
.marv-lang-label{font-family:Manrope,Arial,sans-serif;display:block;letter-spacing:.02em;font-size:12px;font-weight:800;line-height:1}
.shell.portal .portal-switches #theme-switch,.shell.portal .portal-switches #lang-switch{width:44px;height:44px;min-width:44px;border-radius:15px;font-size:12px}
@media(max-width:700px){.nav-actions{gap:7px}.nav-actions #theme-switch,.nav-actions #lang-switch{width:42px;height:42px;min-width:42px;border-radius:14px}.shell.portal .portal-switches #theme-switch,.shell.portal .portal-switches #lang-switch{width:42px;height:42px;min-width:42px;border-radius:14px}}
@media(max-width:390px){.nav-actions{gap:5px}.nav-actions #theme-switch,.nav-actions #lang-switch{width:38px;height:38px;min-width:38px;border-radius:12px}}
@media(prefers-reduced-motion:reduce){#theme-switch,#lang-switch,.marv-mode-sun-core,.marv-mode-rays,.marv-mode-moon-path{transition:none!important}}
/* Custom section media and bilingual content managed through MARV Studio. */
.marv-cms-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px;margin:25px auto;width:100%;max-width:1200px}.marv-cms-card{background:rgba(125,150,144,.09);border:1px solid rgba(130,160,150,.22);border-radius:20px;padding:20px;min-width:0}.marv-cms-card h3{font-size:clamp(18px,2vw,26px);margin:12px 0 8px}.marv-cms-card p{font-size:14px;line-height:1.8}.marv-cms-media{display:block;max-width:100%;width:auto;max-height:360px;object-fit:contain;margin-inline:auto;border-radius:13px}.marv-cms-card video{max-height:390px}@media(max-width:740px){.marv-cms-items{grid-template-columns:1fr}}

/* V86 — bilingual impact numbers */
.marv-impact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(24px,5vw,80px);align-items:center}.marv-impact-intro h2{font-size:clamp(24px,3vw,43px);line-height:1.3;margin-top:12px}.marv-impact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.marv-impact-item{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;text-align:center;min-width:0;padding:clamp(20px,3vw,36px) 12px;border-radius:22px;border:1px solid color-mix(in srgb,currentColor 17%,transparent);background:color-mix(in srgb,currentColor 3%,transparent)}.marv-impact-item strong{font:800 clamp(33px,4vw,64px)/1.1 Manrope,Arial,sans-serif;letter-spacing:-.055em;font-variant-numeric:tabular-nums}.marv-impact-item span{font-size:clamp(12px,1.4vw,16px);font-weight:700}@media(max-width:850px){.marv-impact{grid-template-columns:1fr}.marv-impact-grid{gap:8px}}@media(max-width:430px){.marv-impact-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.marv-impact-item{padding:19px 5px;border-radius:14px;gap:8px}.marv-impact-item strong{font-size:clamp(26px,8vw,35px)}.marv-impact-item span{font-size:11px}}

/* V87 — two-row service carousel, same behavior in both divisions */
.services-block .marv-services-carousel{width:100%;min-width:0;display:flex;flex-direction:column}
.services-block .services-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1.15vw,16px)}
.services-block .services-tiles{align-content:start;align-items:stretch}.services-block .services-tiles>.service-line{box-sizing:border-box;min-width:0;height:auto;min-height:clamp(190px,16.5vw,235px);justify-content:center;isolation:isolate}
.services-block .services-tiles>.service-line[hidden]{display:none!important}
.services-block .services-tiles .service-body{width:100%;min-width:0}
.services-block .services-tiles .service-line h3{font-size:clamp(19px,1.8vw,26px);margin:12px 42px 8px 0}
.services-block .marv-services-nav{display:flex;align-items:center;justify-content:center;gap:14px;margin:18px auto 0;direction:ltr}
.services-block .marv-services-nav[hidden]{display:none!important}
.services-block .marv-services-nav button{width:54px;height:54px;border:1px solid color-mix(in srgb,var(--a) 28%, var(--edge));border-radius:50%;background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 88%, white 12%),var(--surface));color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 24px rgba(12,20,28,.12);transition:background .2s,transform .2s,box-shadow .2s,color .2s,border-color .2s}
.services-block .marv-services-nav button:hover{background:var(--a);color:var(--on-a);border-color:var(--a);box-shadow:0 14px 28px rgba(12,20,28,.18);transform:translateY(-2px)}
.services-block .marv-services-nav button:disabled{opacity:.45;cursor:default;box-shadow:none}.services-block .marv-services-nav button:disabled:hover{background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 88%, white 12%),var(--surface));color:var(--ink);border-color:color-mix(in srgb,var(--a) 28%, var(--edge));transform:none}.services-block .service-nav-icon{width:22px;height:22px;display:block}
.services-block .marv-services-page{font:800 12px Manrope,Arial,sans-serif;letter-spacing:.16em;color:var(--muted);min-width:58px;text-align:center}
.services-block .services-tiles.marv-services-enter>.service-line:not([hidden]){animation:marvServiceReveal .5s cubic-bezier(.22,1,.36,1) both}
@keyframes marvServiceReveal{from{opacity:.25;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.services-block .services-tiles{grid-template-columns:minmax(0,1fr)!important;gap:12px}.services-block .services-tiles>.service-line{height:auto;min-height:172px;padding:20px!important}.services-block .services-tiles .service-line h3{font-size:20px;line-height:1.4}.services-block .marv-services-nav{margin-top:14px}.services-block .marv-services-nav button{width:50px;height:50px}}
@media(prefers-reduced-motion:reduce){.services-block .services-tiles.marv-services-enter>.service-line:not([hidden]){animation:none!important}.services-block .marv-services-nav button{transition:none!important}}

/* V90 — stable framed services grid, fixed three-row viewport independent of card count */
.services-block .marv-services-carousel{
  --marv-service-height:clamp(190px,16.5vw,235px);
  --marv-service-gap:clamp(10px,1.15vw,16px);
  position:relative;box-sizing:border-box;overflow:hidden;
  border:1px solid var(--edge);border-radius:clamp(24px,3vw,38px);
  background:var(--surface2);padding:clamp(14px,2vw,26px);
  isolation:isolate;
}
.services-block .services-tiles{
  gap:var(--marv-service-gap)!important;
  grid-auto-rows:var(--marv-service-height);
  min-height:calc(3 * var(--marv-service-height) + 2 * var(--marv-service-gap));
  align-content:start;align-items:stretch;
  transition:opacity .19s ease,transform .19s ease;
}
.services-block .services-tiles>.service-line{
  height:100%!important;min-height:0!important;
  overflow:hidden;
}
.services-block .services-tiles.marv-services-leaving{opacity:0;transform:translateY(-8px)}
.services-block .services-tiles.marv-services-arriving{animation:marvServicePageEnter .36s cubic-bezier(.22,1,.36,1) both}
@keyframes marvServicePageEnter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.services-block .marv-services-nav{position:relative;z-index:1;flex:none}
@media(max-width:1130px) and (min-width:761px){
 .services-block .services-tiles{min-height:calc(2 * var(--marv-service-height) + var(--marv-service-gap))}
}
@media(max-width:760px){
 .services-block .marv-services-carousel{--marv-service-height:172px;--marv-service-gap:12px;padding:12px;border-radius:24px}
 .services-block .services-tiles{min-height:calc(3 * var(--marv-service-height) + 2 * var(--marv-service-gap))}
 .services-block .services-tiles>.service-line{height:100%!important;min-height:0!important}
}
@media(prefers-reduced-motion:reduce){
 .services-block .services-tiles{transition:none!important}
 .services-block .services-tiles.marv-services-leaving,.services-block .services-tiles.marv-services-arriving{animation:none!important;transform:none!important;opacity:1!important}
}


/* V91 — compact two-row mobile carousel with safe arrow/text separation */
@media(max-width:760px){
 .services-block .marv-services-carousel{
   --marv-service-height:clamp(150px,38vw,174px);
   --marv-service-gap:10px;
   padding:12px!important;
   border-radius:22px;
   touch-action:pan-y;
   overscroll-behavior-x:contain;
 }
 .services-block .services-tiles{
   display:grid!important;
   grid-template-columns:minmax(0,1fr)!important;
   grid-auto-rows:var(--marv-service-height)!important;
   min-height:calc(2 * var(--marv-service-height) + var(--marv-service-gap))!important;
   max-height:calc(2 * var(--marv-service-height) + var(--marv-service-gap));
   gap:var(--marv-service-gap)!important;
 }
 .services-block .services-tiles>.service-line{
   position:relative!important;
   min-height:0!important;height:100%!important;
   padding:16px 17px!important;
   justify-content:center!important;
 }
 .services-block .services-tiles>.service-line:hover{padding:16px 17px!important}
 .services-block .services-tiles .service-index{
   position:absolute;inset-block-start:14px;inset-inline-start:16px;
   font-size:10px;line-height:1.2;
 }
 .services-block .services-tiles .service-arrow{
   position:absolute!important;inset-block-start:13px!important;
   inset-inline-end:14px!important;
   width:32px!important;height:32px!important;
   margin:0!important;
 }
 .services-block .services-tiles .service-body{
   box-sizing:border-box;
   min-width:0;width:100%;
   padding-top:31px;
 }
 .services-block .services-tiles .service-line h3{
   font-size:clamp(16px,4.7vw,21px)!important;
   line-height:1.35!important;
   margin:0 0 6px!important;
   overflow-wrap:anywhere;
 }
 .services-block .services-tiles .service-line p{
   font-size:clamp(10px,2.7vw,12px)!important;
   line-height:1.5!important;
   margin:0!important;
   display:-webkit-box;
   -webkit-line-clamp:3;
   -webkit-box-orient:vertical;
   overflow:hidden;
 }
 .services-block .marv-services-nav{margin:12px auto 0!important;gap:16px}
 .services-block .marv-services-nav button{width:46px!important;height:46px!important}
}
@media(max-width:375px){
 .services-block .marv-services-carousel{--marv-service-height:158px}
 .services-block .services-tiles>.service-line{padding:13px 14px!important}
 .services-block .services-tiles>.service-line:hover{padding:13px 14px!important}
}

/* V93 — interruptible, tactile card transitions across iOS, Android and desktop */
.services-block .services-tiles{transition:none!important;transform:none!important;opacity:1!important;touch-action:pan-y}
.services-block .services-tiles.marv-services-animated{animation:none!important}
.services-block .services-tiles.marv-services-animated>.service-line:not([hidden]){
 animation:marvServiceCardLift .48s cubic-bezier(.2,.85,.23,1) both;
 animation-delay:var(--service-stagger,0ms);
}
@keyframes marvServiceCardLift{
 0%{opacity:.2;transform:translateY(15px) scale(.975);filter:brightness(.93)}
 70%{opacity:1;transform:translateY(-2px) scale(1.007);filter:brightness(1)}
 100%{opacity:1;transform:translateY(0) scale(1);filter:brightness(1)}
}
.services-block .services-tiles .service-line{transform-origin:center center}
.services-block .services-tiles .service-line:active{border-color:var(--a)!important;box-shadow:0 8px 30px rgba(20,25,30,.14)!important}
.services-block .marv-services-nav button:active:not(:disabled){transform:scale(.92);box-shadow:0 3px 12px rgba(20,25,30,.12)}
@media(hover:hover) and (pointer:fine){.services-block .services-tiles .service-line:hover{transform:translateY(-3px) scale(1.008)}}
@media(max-width:760px){.services-block .services-tiles.marv-services-animated>.service-line:not([hidden]){animation-duration:.4s}}
@media(prefers-reduced-motion:reduce){.services-block .services-tiles.marv-services-animated>.service-line:not([hidden]){animation:none!important}}

/* V94 — iOS/Safari reliable animations and stable first paint. */
html:not(.marv-ready) #app{visibility:hidden}
html:not(.marv-ready){background:#101b21}
@keyframes marv94CardBreath{0%,100%{transform:translate3d(0,0,0) scale(1.04)}50%{transform:translate3d(0,0,0) scale(1.23)}}
@keyframes marv94HeroBreath{0%,100%{transform:translate3d(0,0,0) scale(1.04)}50%{transform:translate3d(0,0,0) scale(1.13)}}
.shell.portal .gateway-option .gateway-shot{animation:marv94CardBreath 24s ease-in-out infinite!important;transform-origin:center!important;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.shell.portal .gateway-option:hover .gateway-shot{animation-play-state:running!important}
.shell.business .hero-visual,.shell.marketing .hero-visual{animation:marv94HeroBreath 26s ease-in-out infinite!important;transform-origin:center!important;backface-visibility:hidden}
/* Keep iOS Safari and reduced-motion preferences from freezing functional carousels. */
.logo-loop-track{will-change:transform;transform:translate3d(0,0,0)}
@media(max-width:760px){.shell.portal .gateway-option .gateway-shot{animation:marv94CardBreath 25s ease-in-out infinite!important;will-change:transform!important}.shell.business .hero-visual,.shell.marketing .hero-visual{animation:marv94HeroBreath 28s ease-in-out infinite!important}}
@media(prefers-reduced-motion:reduce){.shell.portal .gateway-option .gateway-shot{animation:marv94CardBreath 40s ease-in-out infinite!important}.shell.business .hero-visual,.shell.marketing .hero-visual{animation:marv94HeroBreath 42s ease-in-out infinite!important}}

/* V108 — Creative identity: vivid terracotta / orange-red on warm charcoal or ivory.
   Business retains its independent teal palette. */
html[data-space="marketing"]{
  --a:#e76140;--on-a:#27130d;--second:#f28b5d;--deep:#261612;
}
html[data-space="marketing"][data-theme="light"]{
  --a:#d75232;--on-a:#fffaf6;--second:#b83e2b;--deep:#351c17;
  --bg:#fcf6f1;--surface:#fffcfa;--surface2:#f5e7df;--ink:#302019;
  --muted:#796259;--edge:#e9d6cc;--glass:rgba(255,249,244,.87);
  --overlay:rgba(41,18,13,.71);
}
html[data-space="marketing"][data-theme="dark"]{
  --a:#f47b53;--on-a:#29150e;--second:#ffae7e;--deep:#271611;
  --bg:#170f0d;--surface:#281a16;--surface2:#39231e;--ink:#fff1e8;
  --muted:#c9afa2;--edge:#53352c;--glass:rgba(39,24,19,.88);
  --overlay:rgba(22,10,8,.83);
}
html[data-space="marketing"] .hero-curtain{
  background:linear-gradient(90deg,rgba(34,14,9,.22),rgba(25,10,8,.91));
}
html[data-space="marketing"] .hero-scene::before{
  background:radial-gradient(circle at 76% 25%,rgba(241,108,60,.24),transparent 38%),
             radial-gradient(circle at 16% 74%,rgba(168,51,30,.23),transparent 45%);
}
html[data-space="marketing"] .site-footer{background:#23130f}
html[data-space="marketing"] .site-footer a:hover{color:#ffae7e}
html[data-space="marketing"] .process-section{
  background:linear-gradient(125deg,#311b16,#683020);color:#fff3e9;
}
html[data-space="marketing"] .services-tiles .service-line::after{background:#e76140}
html[data-space="marketing"] .bts-page,
html[data-space="marketing"] .bts-chapter,
html[data-space="marketing"] .portfolio-page{--bts-accent:#e76140}
/* Welcome portal mixes Business turquoise with Creative vermilion, not blue/purple. */
html[data-space="portal"]{--a:#ed7651;--on-a:#2b160f;--second:#4da69a;--deep:#1b2420}
html[data-space="portal"][data-theme="light"]{
 --bg:#f8f6f1;--surface:#fffaf6;--surface2:#f0e9e3;--ink:#262923;--muted:#66736d;--edge:#dce2da;
}
html[data-space="portal"][data-theme="dark"]{
 --bg:#111b1a;--surface:#1c2b28;--surface2:#293c37;--ink:#f7f2eb;--muted:#b4c8c0;--edge:#39504a;
}
html[data-space="portal"][data-theme="light"] .gateway-ambient,
html[data-space="portal"][data-theme="dark"] .gateway-ambient{
  background:radial-gradient(ellipse at 16% 24%,rgba(42,163,151,.26),transparent 49%),
             radial-gradient(ellipse at 84% 34%,rgba(234,99,55,.27),transparent 50%),
             radial-gradient(ellipse at 52% 84%,rgba(235,155,103,.11),transparent 52%)!important;
}
html[data-space="portal"] .creative-option .gateway-overlay{
 background:linear-gradient(0deg,rgba(47,18,12,.97),rgba(126,43,23,.54) 65%,rgba(227,98,53,.2));
}
html[data-space="portal"] .creative-option .option-cta{
 background:#ee7350;color:#26130d;box-shadow:0 9px 27px rgba(58,20,13,.25);
}
html[data-space="portal"] .creative-option .option-cta>span{background:#421e16;color:#fff3eb}
html[data-space="portal"] .creative-option .option-sublabel{color:#ffe0cc}
html[data-space="portal"] .business-option .gateway-overlay{
 background:linear-gradient(0deg,rgba(4,29,33,.95),rgba(6,56,58,.36) 65%,rgba(36,108,106,.16));
}
html[data-space="portal"][data-theme="light"] .gateway-intro h1 em{color:#bf553b}
html[data-space="portal"][data-theme="dark"] .gateway-intro h1 em{color:#f48b65}
@media(max-width:760px){
 html[data-space="marketing"] .hero-curtain{background:linear-gradient(0deg,rgba(31,12,9,.94),rgba(91,38,23,.42))}
 html[data-space="portal"] .creative-option .gateway-overlay{background:linear-gradient(0deg,rgba(45,15,10,.97),rgba(174,61,34,.38) 83%)}
}

/* V97 — Balanced, compact end-of-page CTA for both verticals and themes. */
.shell.business .final-cta,.shell.marketing .final-cta{
  min-height:clamp(285px,29vw,365px);
  padding:clamp(28px,4.8vw,70px);
  border-radius:clamp(28px,4.2vw,64px);
  margin:16px clamp(10px,2vw,34px) 34px;
  gap:0;
}
.shell.business .final-cta h2,.shell.marketing .final-cta h2{
  font-size:clamp(34px,4.4vw,69px);
  line-height:1.27;
  letter-spacing:-.035em;
  margin:8px 0 10px;
  max-width:100%;
  text-wrap:balance;
}
.shell.business .final-cta>span,.shell.marketing .final-cta>span{
  margin-bottom:20px;
  font-size:clamp(13px,1.12vw,16px);
  line-height:1.7;
}
.shell.business .final-cta>.pill,.shell.marketing .final-cta>.pill{min-height:44px}
@media(max-width:700px){
 .shell.business .final-cta,.shell.marketing .final-cta{
   min-height:285px;
   padding:30px 23px;
   margin:10px 9px 24px;
   border-radius:29px;
 }
 .shell.business .final-cta h2,.shell.marketing .final-cta h2{
   font-size:clamp(28px,7.7vw,40px);
   line-height:1.3;
   margin:10px 0;
   letter-spacing:-.025em;
 }
 .shell.business .final-cta>span,.shell.marketing .final-cta>span{font-size:13px;margin-bottom:16px}
 .shell.business .final-cta>p,.shell.marketing .final-cta>p{font-size:10px;letter-spacing:1.3px}
}

/* V98 — quieter, longer service-card reveal. Native CSS keyframes work on WebKit,
   including Safari iOS; no scroll-linked animation or high-cost filters. */
.services-block .services-tiles.marv-services-animated>.service-line:not([hidden]){
  -webkit-animation:marv98ServiceSoftIn .78s cubic-bezier(.22,1,.36,1) both!important;
  animation:marv98ServiceSoftIn .78s cubic-bezier(.22,1,.36,1) both!important;
  -webkit-animation-delay:var(--service-stagger,0ms)!important;
  animation-delay:var(--service-stagger,0ms)!important;
}
@-webkit-keyframes marv98ServiceSoftIn{
  0%{opacity:.18;-webkit-transform:translate3d(0,16px,0) scale(.985)}
  100%{opacity:1;-webkit-transform:translate3d(0,0,0) scale(1)}
}
@keyframes marv98ServiceSoftIn{
  0%{opacity:.18;transform:translate3d(0,16px,0) scale(.985)}
  100%{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@media(max-width:760px){
  .services-block .services-tiles.marv-services-animated>.service-line:not([hidden]){
    -webkit-animation-duration:.72s!important;animation-duration:.72s!important;
  }
}
@media(prefers-reduced-motion:reduce){
  .services-block .services-tiles.marv-services-animated>.service-line:not([hidden]){
    -webkit-animation:none!important;animation:none!important;
  }
}

/* V99: directional, interactive horizontal card transition with steady sizing. */
.services-block .marv-services-carousel{position:relative}
.services-block .services-tiles{position:relative;isolation:isolate}
.services-block .marv-service-ghost{position:absolute;z-index:5;inset:0 0 auto;pointer-events:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-content:start;will-change:transform,opacity}
.services-block .marv-service-ghost .service-line{height:auto;min-height:clamp(190px,16.5vw,235px);display:flex;flex-direction:column;justify-content:center;padding:27px!important;border:1px solid var(--edge);border-radius:26px;background:var(--surface);position:relative;overflow:hidden;box-sizing:border-box;pointer-events:none;text-decoration:none;color:var(--ink)}
.services-block .marv-service-ghost .service-arrow{position:absolute;inset-inline-end:22px;top:24px;width:38px;height:38px}
@media(max-width:1130px){.services-block .marv-service-ghost{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.services-block .marv-service-ghost{grid-template-columns:minmax(0,1fr);gap:12px}.services-block .marv-service-ghost .service-line{min-height:172px;padding:20px!important}}
@media(prefers-reduced-motion:reduce){.services-block .marv-service-ghost{display:none!important}}

/* V100: two independent column entrances; no cloned/overlapping outgoing cards. */
.services-block .services-tiles>.service-line{backface-visibility:hidden;-webkit-backface-visibility:hidden;contain:paint}
.services-block .services-tiles{overflow:visible}
.services-block .marv-service-ghost{display:none!important}
@media(max-width:760px){.services-block .services-tiles>.service-line{contain:paint}}

/* V102 — tighten the vertical rhythm between impact metrics and services only. */
.shell.business .marv-impact.section-pad,
.shell.marketing .marv-impact.section-pad{
  padding-bottom:clamp(24px,3vw,44px);
}
.shell.business .marv-impact.section-pad + .services-block.section-pad,
.shell.marketing .marv-impact.section-pad + .services-block.section-pad{
  padding-top:clamp(28px,3.5vw,52px);
}
@media(max-width:760px){
  .shell.business .marv-impact.section-pad,
  .shell.marketing .marv-impact.section-pad{padding-bottom:23px}
  .shell.business .marv-impact.section-pad + .services-block.section-pad,
  .shell.marketing .marv-impact.section-pad + .services-block.section-pad{padding-top:28px}
}

/* V103 — single lightweight service transition across Safari/iOS, Android and desktop. */
.services-block .services-tiles{grid-template-columns:repeat(2,minmax(0,1fr))!important;align-content:start!important}
.services-block .services-tiles>.service-line{height:auto;min-height:clamp(180px,15vw,220px);transform:none;animation:none!important;-webkit-animation:none!important;will-change:auto}
.services-block .services-tiles.marv-v103-transition>.service-line:not([hidden]){animation:marv103CardIn .58s cubic-bezier(.2,.75,.25,1) both!important;-webkit-animation:marv103CardIn .58s cubic-bezier(.2,.75,.25,1) both!important}
.services-block .services-tiles.marv-v103-transition>.service-line:not([hidden]):nth-child(even){animation-delay:45ms!important;-webkit-animation-delay:45ms!important}
@keyframes marv103CardIn{from{opacity:.25;transform:translate3d(0,12px,0) scale(.99)}to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@-webkit-keyframes marv103CardIn{from{opacity:.25;-webkit-transform:translate3d(0,12px,0) scale(.99)}to{opacity:1;-webkit-transform:translate3d(0,0,0) scale(1)}}
.services-block .services-tiles{touch-action:pan-y}
@media(max-width:760px){.services-block .services-tiles{grid-template-columns:1fr!important}.services-block .services-tiles>.service-line{min-height:170px}}
@media(prefers-reduced-motion:reduce){.services-block .services-tiles.marv-v103-transition>.service-line:not([hidden]){animation:none!important;-webkit-animation:none!important}}

/* V104: two-row fixed-size service viewport, no leftover third-row space. */
.services-block .marv-services-carousel{
  --marv-service-height:clamp(178px,14vw,220px);
  --marv-service-gap:clamp(10px,1.15vw,16px);
}
.services-block .services-tiles{
  grid-auto-rows:var(--marv-service-height)!important;
  min-height:calc(2 * var(--marv-service-height) + var(--marv-service-gap))!important;
  height:calc(2 * var(--marv-service-height) + var(--marv-service-gap));
  max-height:calc(2 * var(--marv-service-height) + var(--marv-service-gap));
  align-content:start!important;
}
.services-block .services-tiles>.service-line{min-height:0!important;height:100%!important}
@media(max-width:760px){
  .services-block .marv-services-carousel{
    --marv-service-height:clamp(150px,38vw,174px);
    --marv-service-gap:10px;
  }
  .services-block .services-tiles{
    grid-template-columns:minmax(0,1fr)!important;
    min-height:calc(2 * var(--marv-service-height) + var(--marv-service-gap))!important;
    height:calc(2 * var(--marv-service-height) + var(--marv-service-gap));
    max-height:calc(2 * var(--marv-service-height) + var(--marv-service-gap));
  }
}

/* V105 — animate the complete service group as a single composited surface. */
.services-block .services-tiles{will-change:transform,opacity;transform:translateZ(0);-webkit-transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.services-block .services-tiles.marv-v103-transition>.service-line:not([hidden]),
.services-block .services-tiles.marv-services-animated>.service-line:not([hidden]){animation:none!important;-webkit-animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){.services-block .services-tiles{will-change:auto}}

/* V106 — simultaneous two-page horizontal service transition */
.services-block .services-tiles{position:relative!important;isolation:isolate;overflow:visible!important}
.services-block .marv-services-carousel{overflow:hidden}
.services-block .marv-service-page-out{
  position:absolute;inset:0;z-index:3;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-rows:var(--marv-service-height);
  gap:var(--marv-service-gap);
  pointer-events:none;will-change:transform,opacity;
  backface-visibility:hidden;-webkit-backface-visibility:hidden;
}
.services-block .services-tiles{z-index:1}
.services-block .marv-service-page-out>.service-line{
  display:flex!important;flex-direction:column;justify-content:center;
  position:relative;min-width:0;min-height:0!important;height:100%;
  padding:27px!important;box-sizing:border-box;overflow:hidden;
  background:var(--surface);color:var(--ink);border:1px solid var(--edge);
  border-radius:26px;text-decoration:none;
}
.services-block .marv-service-page-out>.service-line .service-arrow{position:absolute;inset-inline-end:22px;top:24px;width:38px;height:38px}
.services-block .marv-service-page-out>.service-line h3{font-size:clamp(19px,1.8vw,26px);line-height:1.4;margin:12px 42px 8px 0}
.services-block .marv-service-page-out>.service-line p{color:var(--muted);font-size:clamp(12px,1vw,15px);line-height:1.75}
@media(max-width:760px){
  .services-block .marv-service-page-out{grid-template-columns:minmax(0,1fr)}
  .services-block .marv-service-page-out>.service-line{padding:20px!important}
  .services-block .marv-service-page-out>.service-line h3{font-size:20px}
}
@media(prefers-reduced-motion:reduce){.services-block .marv-service-page-out{display:none!important}}

/* V107 — actual page track; no opacity or card enter effects. */
.services-block .marv-service-viewport{overflow:hidden;min-width:0;width:100%;border-radius:inherit;touch-action:pan-y;overscroll-behavior-x:contain}
.services-block .marv-service-track{display:flex!important;flex-wrap:nowrap;width:100%;align-items:stretch;transform:translate3d(0,0,0);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.services-block .marv-service-slide{flex:0 0 100%;width:100%;min-width:0;box-sizing:border-box;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-content:start;align-items:stretch;animation:none!important;transition:none!important}
.services-block .marv-service-slide>.service-line{animation:none!important;transform:none;min-width:0;height:100%!important}
.services-block .marv-service-slide>.service-line:hover{transform:none!important}
@media(max-width:760px){.services-block .marv-service-slide{grid-template-columns:minmax(0,1fr)!important}}
@media(prefers-reduced-motion:reduce){.services-block .marv-service-track{transition:none!important}}

/* V108 | Reliable horizontal carousel in Arabic and English.
   Track coordinates MUST be LTR; each service slide restores reading direction via dir. */
.services-block .marv-service-viewport,
.services-block .marv-service-track{direction:ltr!important}
.services-block .marv-service-slide{flex-shrink:0!important;max-width:100%;}
.services-block .marv-service-slide[dir="rtl"]{direction:rtl}
.services-block .marv-service-slide[dir="ltr"]{direction:ltr}
/* iOS/WebKit: continuous text ribbons are animated on their single track (not on spans).
   Dedicated prefixed keyframes avoid Safari animation resetting when Arabic dir changes. */
@-webkit-keyframes marv108Ribbon{from{-webkit-transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(-50%,0,0)}}
@keyframes marv108Ribbon{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.moving-band .moving-band-inner,
.bts-marquee .bts-marquee-track{
 direction:ltr!important;display:-webkit-flex;display:flex;
 -webkit-animation:marv108Ribbon 38s linear infinite!important;
 animation:marv108Ribbon 38s linear infinite!important;
 -webkit-animation-play-state:running!important;animation-play-state:running!important;
 -webkit-backface-visibility:hidden;backface-visibility:hidden;
 will-change:transform;
}
.bts-marquee .bts-marquee-track{-webkit-animation-duration:44s!important;animation-duration:44s!important}
/* If Reduce Motion is enabled, the decorative ribbon becomes much slower rather
   than silently disappearing; functional carousels still respect that setting. */
@media(prefers-reduced-motion:reduce){
 .moving-band .moving-band-inner,.bts-marquee .bts-marquee-track{
  -webkit-animation:marv108Ribbon 105s linear infinite!important;
  animation:marv108Ribbon 105s linear infinite!important;
 }
}
@supports(-webkit-touch-callout:none){
 .moving-band,.bts-marquee,.logo-loop{-webkit-transform:translateZ(0);transform:translateZ(0)}
 .moving-band .moving-band-inner,.bts-marquee .bts-marquee-track{
  -webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);
  -webkit-backface-visibility:hidden;backface-visibility:hidden;
 }
}
/* Portal title ties the two divisions together with a subtle teal-to-vermilion blend. */
html[data-space="portal"][data-theme="light"] .gateway-intro h1 em{
 background:linear-gradient(105deg,#278b79 8%,#dc6344 93%);
 -webkit-background-clip:text;background-clip:text;
 -webkit-text-fill-color:transparent;color:transparent!important;
}
html[data-space="portal"][data-theme="dark"] .gateway-intro h1 em{
 background:linear-gradient(105deg,#9bd4c6 8%,#ff966d 93%);
 -webkit-background-clip:text;background-clip:text;
 -webkit-text-fill-color:transparent;color:transparent!important;
}


/* V109 — Saudi landmark creative backgrounds + adaptive floating contact */
html[data-space="marketing"]{--a:#e78462;--on-a:#2b1615;--second:#f1a17f;--deep:#36201f}
html[data-space="marketing"][data-theme="light"]{--bg:#fbf4ef;--surface:#fffaf7;--surface2:#f5e6dd;--ink:#2f1e1b;--muted:#7d665e;--edge:#ead4c7;--glass:rgba(255,249,245,.78)}
html[data-space="marketing"][data-theme="dark"]{--bg:#191111;--surface:#261a19;--surface2:#382625;--ink:#fff5f0;--muted:#d0bdb5;--edge:#5a4540;--glass:rgba(41,27,25,.79)}
html[data-space="marketing"] .hero-visual{background-position:center 42%}
html[data-space="marketing"] .hero-curtain{background:linear-gradient(90deg,rgba(31,16,16,.30),rgba(28,14,14,.84) 52%,rgba(31,15,17,.96))!important}
html[data-space="marketing"] .page-banner{position:relative;isolation:isolate;background:linear-gradient(135deg,rgba(255,251,247,.96),rgba(247,234,225,.90))!important;border-color:color-mix(in srgb,var(--edge) 80%,#f6b491)!important}
html[data-theme="dark"][data-space="marketing"] .page-banner{background:linear-gradient(135deg,rgba(40,24,22,.93),rgba(28,19,18,.97))!important}
html[data-space="marketing"] .page-banner::before{content:"";position:absolute;inset:0;z-index:-2;background-image:url('/assets/saudi/maraya-creative-real.png');background-size:cover;background-position:center 35%;opacity:.33;transform:scale(1.03)}
html[data-space="marketing"] .page-banner::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(255,249,244,.90) 0%,rgba(255,248,241,.82) 35%,rgba(243,225,214,.45) 100%)}
html[data-theme="dark"][data-space="marketing"] .page-banner::after{background:linear-gradient(90deg,rgba(25,16,15,.88) 0%,rgba(25,16,15,.78) 42%,rgba(25,16,15,.38) 100%)}
html[data-space="marketing"] .gateway-option.creative-option .gateway-overlay{background:linear-gradient(0deg,rgba(36,18,18,.94),rgba(82,34,24,.22) 65%,rgba(145,86,56,.08) 100%)!important}

.floating-contact{position:fixed;left:max(14px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));z-index:120;display:flex;flex-direction:column;gap:10px;pointer-events:none}
.floating-action{pointer-events:auto;display:flex;align-items:center;gap:11px;min-height:56px;padding:10px 15px 10px 11px;border-radius:18px;background:var(--surface);color:var(--ink);border:1px solid var(--edge);box-shadow:0 14px 40px rgba(0,0,0,.12);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);transition:transform .28s var(--ease),box-shadow .28s var(--ease),background .28s var(--ease),color .28s var(--ease),border-color .28s var(--ease);max-width:220px}
.floating-action:hover{transform:translateY(-3px) scale(1.01);box-shadow:0 18px 46px rgba(0,0,0,.17)}
.floating-action .floating-icon{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;flex:none}
.floating-action .floating-icon svg{width:19px;height:19px;display:block}
.floating-action .floating-text{display:flex;flex-direction:column;line-height:1.12;gap:4px}
.floating-action .floating-text strong{font-size:13px;font-weight:900}
.floating-action .floating-text small{font-size:11px;color:var(--muted);direction:ltr;text-align:start}
.floating-action.call{background:var(--a);border-color:color-mix(in srgb,var(--a) 80%,#fff);color:var(--on-a)}
.floating-action.call .floating-icon{background:rgba(0,0,0,.13);color:inherit}
.floating-action.call .floating-text small{color:color-mix(in srgb,var(--on-a) 70%,transparent)}
.floating-action.whatsapp{background:color-mix(in srgb,var(--surface) 82%,var(--second));border-color:color-mix(in srgb,var(--edge) 45%,var(--second));color:var(--ink)}
.floating-action.whatsapp .floating-icon{background:color-mix(in srgb,var(--second) 18%,var(--surface2));color:color-mix(in srgb,var(--ink) 72%,var(--second))}
html[data-theme="dark"] .floating-action{box-shadow:0 18px 42px rgba(0,0,0,.34)}
html[data-space="portal"] .floating-action.call{background:linear-gradient(135deg,#4ca58d,#ff9072);color:#fff;border-color:transparent}
html[data-space="portal"][data-theme="dark"] .floating-action.call{background:linear-gradient(135deg,#6fb8a4,#ff8d73)}
html[data-space="business"] .floating-action.whatsapp{background:color-mix(in srgb,var(--surface) 74%,#7dd3c1)}
html[data-space="marketing"] .floating-action.whatsapp{background:color-mix(in srgb,var(--surface) 72%,#f3b08d)}
html[data-space="marketing"] .floating-action.whatsapp .floating-icon{background:color-mix(in srgb,var(--a) 22%,var(--surface2));color:color-mix(in srgb,var(--a) 58%,var(--ink))}
@media(max-width:700px){.floating-contact{left:max(10px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom));gap:8px}.floating-action{min-height:50px;padding:9px 12px 9px 9px;border-radius:16px;max-width:186px}.floating-action .floating-icon{width:34px;height:34px;border-radius:12px}.floating-action .floating-text strong{font-size:12px}.floating-action .floating-text small{font-size:10px}}

/* V110 — unified, clickable MARV contact directory */
.marv-contact-hub{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(16px,3vw,38px);align-items:start;min-width:0}
.marv-contact-direct-group,.marv-contact-social-group{display:flex;flex-direction:column;min-width:0;gap:14px}
.marv-hub-kicker{display:flex;align-items:center;gap:12px;font:800 11px Manrope,'Cairo',sans-serif;letter-spacing:.095em;line-height:1.5;color:var(--muted);flex-wrap:wrap}
.marv-hub-kicker span{font-weight:700;letter-spacing:0;color:var(--second)}
.marv-direct-links{display:flex;gap:10px;flex-wrap:wrap;min-width:0}
.marv-direct-link{display:flex;align-items:center;gap:12px;flex:1 1 165px;min-width:0;min-height:66px;padding:11px 14px;background:var(--surface);border:1px solid var(--edge);border-radius:19px;color:var(--ink);transition:transform .25s var(--ease),border-color .25s,background .25s;box-shadow:0 12px 35px rgba(8,24,24,.05)}
.marv-direct-link:hover{transform:translateY(-3px);border-color:var(--a);background:var(--surface2)}
.marv-direct-icon{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:12px;color:var(--on-a);background:var(--a)}
.marv-direct-link.marv-direct-whatsapp .marv-direct-icon{background:var(--second);color:var(--on-a)}
.marv-direct-icon svg{width:20px;height:20px;display:block}
.marv-direct-details{display:flex;flex-direction:column;gap:2px;min-width:0}
.marv-direct-details strong{font-size:12px;line-height:1.5;font-weight:900;white-space:normal}
.marv-direct-details small{font:700 11px Manrope,sans-serif;letter-spacing:.025em;color:var(--muted);align-self:flex-start;unicode-bidi:isolate}
.marv-social-links{display:flex;gap:9px;flex-wrap:wrap;align-items:stretch;min-width:0}
.marv-social-link{display:flex;align-items:center;justify-content:center;gap:9px;min-width:0;min-height:46px;padding:9px 13px;border:1px solid var(--edge);border-radius:15px;background:var(--surface);color:var(--ink);font:800 11px Manrope,'Cairo',sans-serif;letter-spacing:0;transition:transform .25s var(--ease),background .25s,border-color .25s;box-shadow:0 9px 22px rgba(9,22,23,.035)}
.marv-social-link:hover{transform:translateY(-3px);border-color:var(--a);background:var(--surface2)}
.marv-social-icon{display:grid;place-items:center;width:25px;height:25px;flex:none;color:var(--ink)}
.marv-social-icon svg{width:23px;height:23px;display:block}
.marv-social-name{white-space:nowrap}
.marv-social-instagram .marv-social-icon{color:#ce577c}
.marv-social-snapchat .marv-social-icon{color:#dfb900}
.marv-social-tiktok .marv-social-icon{color:var(--ink)}
/* Footer contact directory follows each section's existing footer identity. */
.footer-top>.marv-footer-connect{grid-column:1/-1;min-width:0;padding:clamp(22px,2.5vw,36px);border:1px solid rgba(255,255,255,.16);border-radius:27px;background:rgba(255,255,255,.055)}
.marv-footer-connect .marv-hub-kicker{color:#dadbd5}
.marv-footer-connect .marv-hub-kicker span{color:var(--a)}
.marv-footer-connect .marv-direct-link,.marv-footer-connect .marv-social-link{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#fff;box-shadow:none}
.marv-footer-connect .marv-direct-link:hover,.marv-footer-connect .marv-social-link:hover{background:rgba(255,255,255,.16);border-color:var(--a)}
.marv-footer-connect .marv-direct-link small{color:#d8d8d7}
.marv-footer-connect .marv-social-icon{color:#fff}
.marv-footer-connect .marv-social-snapchat .marv-social-icon{color:#f6db5c}
.marv-footer-connect .marv-social-instagram .marv-social-icon{color:#ffa5b9}
.marketing .site-footer{background:#231716}
/* Contact details sit alongside the original request form in both divisions. */
.contact-info>.marv-contact-page{margin-top:clamp(26px,4vw,48px);padding:clamp(18px,2.6vw,27px);background:var(--surface);border:1px solid var(--edge);border-radius:27px}
.contact-info .marv-contact-hub{display:flex;flex-direction:column;gap:25px}
.contact-info .marv-direct-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
.contact-info .marv-direct-link{flex:auto;min-height:79px;align-items:flex-start;flex-direction:column;gap:8px}
.contact-info .marv-direct-icon{width:38px;height:38px}
.contact-info .marv-social-link{flex:1 1 105px}
/* The portal has a real footer, with the same directory and recognizable social icons. */
.shell.portal .gateway{height:auto;min-height:100dvh}
.shell.portal .gateway-contact-footer{order:6;width:100%;max-width:1180px;margin:0 auto;flex:0 0 auto;border:1px solid var(--edge);border-radius:24px;padding:19px 25px;background:var(--glass);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:0 8px 35px rgba(17,32,32,.045)}
.shell.portal .gateway-contact-footer .marv-contact-hub{grid-template-columns:1.16fr 1fr;gap:22px;align-items:center}
.shell.portal .gateway-contact-footer .marv-contact-direct-group,.shell.portal .gateway-contact-footer .marv-contact-social-group{gap:8px}
.shell.portal .gateway-contact-footer .marv-direct-link{min-height:49px;padding:6px 10px;border-radius:13px}
.shell.portal .gateway-contact-footer .marv-direct-icon{width:29px;height:29px;border-radius:10px}
.shell.portal .gateway-contact-footer .marv-direct-icon svg{width:16px;height:16px}
.shell.portal .gateway-contact-footer .marv-direct-details strong{font-size:10px}
.shell.portal .gateway-contact-footer .marv-direct-details small{font-size:9px}
.shell.portal .gateway-contact-footer .marv-social-link{min-height:49px;padding:8px 10px}
.shell.portal .gateway-contact-footer .marv-social-name{font-size:10px}
.shell.portal .gateway-contact-footer .marv-social-icon svg{width:20px;height:20px}
/* Correct spacing and prevent fixed floating call buttons from hiding the last footer links. */
@media(max-width:1050px){
 .footer-top>.marv-footer-connect .marv-contact-hub{grid-template-columns:1fr 1fr}
 .shell.portal .gateway-contact-footer .marv-contact-hub{grid-template-columns:1fr 1fr}
 .shell.portal .gateway-contact-footer{padding:15px}
}
@media(max-width:760px){
 .footer-top>.marv-footer-connect .marv-contact-hub,.shell.portal .gateway-contact-footer .marv-contact-hub{grid-template-columns:1fr;gap:19px}
 .shell.portal .gateway-contact-footer{width:100%;padding:17px 15px;margin:3px auto 0}
 .shell.portal .gateway{height:auto;min-height:100dvh;padding-bottom:max(12px,env(safe-area-inset-bottom))}
 .shell.portal .gateway-options{height:clamp(275px,43dvh,375px)}
 .shell.portal .gateway::before,.shell.portal .gateway::after{flex-grow:0;flex-basis:0}
 .footer-top>.marv-footer-connect{padding:17px;border-radius:22px}
 .marv-contact-hub{gap:22px}
 .marv-direct-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .marv-direct-link{flex:initial;padding:9px;gap:8px;min-height:62px}
 .marv-direct-icon{width:31px;height:31px;border-radius:10px}
 .marv-direct-icon svg{width:17px;height:17px}
 .marv-direct-details strong{font-size:11px}
 .marv-direct-details small{font-size:10px}
 .marv-social-link{flex:1 1 102px;padding:9px 8px;gap:5px;font-size:10px;min-height:44px}
 .marv-social-icon svg{width:21px;height:21px}
 .contact-info .marv-contact-page{margin-top:23px}
 .contact-info .marv-direct-link{min-height:74px}
 .site-footer{padding-bottom:max(24px,env(safe-area-inset-bottom))}
}
@media(max-width:375px){
 .marv-social-name{font-size:10px}
 .marv-direct-details small{font-size:9px}
 .marv-direct-details strong{font-size:10px}
 .shell.portal .gateway-contact-footer .marv-social-link{flex-basis:90px}
}


/* V111 — contact and WhatsApp are icons everywhere except the contact pages. */
.floating-contact{gap:10px;align-items:center;left:max(16px,env(safe-area-inset-left));bottom:max(18px,env(safe-area-inset-bottom))}
.floating-contact .floating-action{width:54px;height:54px;min-width:54px;min-height:54px;max-width:54px;max-height:54px;padding:0;display:grid;place-items:center;gap:0;border-radius:50%;box-shadow:0 10px 29px rgba(0,0,0,.2)}
.floating-contact .floating-action .floating-icon{width:100%;height:100%;border-radius:50%;background:transparent!important;display:grid;place-items:center;box-shadow:none;color:inherit}
.floating-contact .floating-action .floating-icon svg{width:25px;height:25px;display:block}
.floating-contact .floating-action .floating-text{display:none!important}
.floating-contact .floating-action.whatsapp{color:var(--ink)}
.floating-contact .floating-action:hover{transform:translateY(-4px) scale(1.06)}
.floating-contact .floating-action:active{transform:scale(.94)}
/* One compact row of five social-style icons in both section footers and welcome footer. */
:root{--marv-footer-gold:#f1d36f;--marv-footer-gold-soft:#ffe8a2;--marv-footer-gold-border:rgba(241,211,111,.34);--marv-footer-gold-surface:rgba(241,211,111,.12);--marv-footer-gold-surface-strong:rgba(241,211,111,.2)}
.marv-contact-icon-nav{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:clamp(10px,1.35vw,18px);min-width:0;direction:ltr}
.marv-contact-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;flex:none;border:1px solid var(--edge);background:var(--surface);color:var(--ink);box-shadow:0 9px 27px rgba(10,20,18,.055);transition:transform .25s var(--ease),border-color .25s,background .25s,color .25s}
.marv-contact-icon svg{width:24px;height:24px;display:block}
.marv-contact-icon:hover{transform:translateY(-4px);border-color:var(--a);background:var(--surface2)}
.marv-contact-icon-phone{background:var(--a);color:var(--on-a);border-color:transparent}
.marv-contact-icon-whatsapp{color:var(--ink);border-color:var(--second);background:color-mix(in srgb,var(--surface) 74%,var(--second))}
.marv-contact-icon-instagram{color:#ce577c}
.marv-contact-icon-snapchat{color:#c7a500}
.marv-contact-icon-tiktok{color:var(--ink)}
/* Footer and welcome-footer icons use a unified warm yellow language for better brand cohesion. */
.marv-footer-connect{display:flex;justify-content:center;align-items:center}
.marv-footer-connect .marv-contact-icon,
.shell.portal .gateway-contact-footer .marv-contact-icon{background:linear-gradient(180deg,var(--marv-footer-gold-surface),rgba(255,255,255,.03));border-color:var(--marv-footer-gold-border);color:var(--marv-footer-gold);box-shadow:none}
.marv-footer-connect .marv-contact-icon-phone,
.shell.portal .gateway-contact-footer .marv-contact-icon-phone{background:linear-gradient(180deg,var(--marv-footer-gold-soft),var(--marv-footer-gold));border-color:transparent;color:#22170d}
.marv-footer-connect .marv-contact-icon-whatsapp,
.marv-footer-connect .marv-contact-icon-instagram,
.marv-footer-connect .marv-contact-icon-snapchat,
.marv-footer-connect .marv-contact-icon-tiktok,
.shell.portal .gateway-contact-footer .marv-contact-icon-whatsapp,
.shell.portal .gateway-contact-footer .marv-contact-icon-instagram,
.shell.portal .gateway-contact-footer .marv-contact-icon-snapchat,
.shell.portal .gateway-contact-footer .marv-contact-icon-tiktok{color:var(--marv-footer-gold)}
.marv-footer-connect .marv-contact-icon:hover,
.shell.portal .gateway-contact-footer .marv-contact-icon:hover{transform:translateY(-4px);background:linear-gradient(180deg,var(--marv-footer-gold-surface-strong),rgba(255,255,255,.06));border-color:rgba(255,232,162,.54)}
.marv-footer-connect .marv-contact-icon-phone:hover,
.shell.portal .gateway-contact-footer .marv-contact-icon-phone:hover{background:linear-gradient(180deg,#ffeeb7,#f1d36f);color:#20160c}
.shell.portal .gateway-contact-footer{display:flex;align-items:center;justify-content:center;padding:18px 22px;border-color:rgba(241,211,111,.18);background:linear-gradient(180deg,rgba(22,31,31,.52),rgba(17,25,25,.64))}
.shell.portal .gateway-contact-footer .marv-contact-icon-nav{width:100%;justify-content:center}
@media(max-width:700px){
 .floating-contact{left:max(12px,env(safe-area-inset-left));bottom:max(13px,env(safe-area-inset-bottom));gap:9px}
 .floating-contact .floating-action{width:48px;height:48px;min-width:48px;min-height:48px;max-width:48px;max-height:48px}
 .floating-contact .floating-action .floating-icon svg{width:23px;height:23px}
 .marv-contact-icon-nav{gap:10px}
 .marv-contact-icon{width:46px;height:46px}
 .marv-contact-icon svg{width:21px;height:21px}
 .shell.portal .gateway-contact-footer{padding:13px 12px}
}


.shell.portal .gateway-contact-footer{box-shadow:0 10px 34px rgba(0,0,0,.12)}
html[data-theme="light"] .shell.portal .gateway-contact-footer{background:linear-gradient(180deg,rgba(18,31,29,.5),rgba(20,23,18,.58))}
html[data-space="business"] .marv-footer-connect .marv-contact-icon,
html[data-space="marketing"] .marv-footer-connect .marv-contact-icon{background:linear-gradient(180deg,rgba(241,211,111,.11),rgba(255,255,255,.05));border-color:rgba(241,211,111,.28)}
html[data-space="business"] .marv-footer-connect .marv-contact-icon:hover,
html[data-space="marketing"] .marv-footer-connect .marv-contact-icon:hover{background:linear-gradient(180deg,rgba(241,211,111,.2),rgba(255,255,255,.08))}


/* V114 — footer contact/social icons: smaller, plain, no card, black/white by theme */
.footer-top>.marv-footer-connect{
  grid-column:1/-1;
  min-width:0;
  padding:0 !important;
  border:none !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  margin-top:10px;
}
.marv-footer-connect,
.shell.portal .gateway-contact-footer{
  display:flex;
  justify-content:center;
  align-items:center;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.shell.portal .gateway-contact-footer{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  padding:6px 0 0 !important;
}
.marv-footer-connect .marv-contact-icon-nav,
.shell.portal .gateway-contact-footer .marv-contact-icon-nav{
  gap:16px;
  width:auto;
  justify-content:center;
}
.marv-footer-connect .marv-contact-icon,
.shell.portal .gateway-contact-footer .marv-contact-icon{
  width:30px !important;
  height:30px !important;
  min-width:30px;
  min-height:30px;
  padding:0 !important;
  border:none !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#101010 !important;
  opacity:.92;
  transition:transform .22s var(--ease), opacity .22s var(--ease), color .22s var(--ease);
}
.marv-footer-connect .marv-contact-icon svg,
.shell.portal .gateway-contact-footer .marv-contact-icon svg{
  width:20px !important;
  height:20px !important;
}
.marv-footer-connect .marv-contact-icon:hover,
.shell.portal .gateway-contact-footer .marv-contact-icon:hover{
  transform:translateY(-2px);
  background:transparent !important;
  border:none !important;
  opacity:1;
}
html[data-theme="dark"] .marv-footer-connect .marv-contact-icon,
html[data-theme="dark"] .shell.portal .gateway-contact-footer .marv-contact-icon{
  color:#ffffff !important;
}
html[data-theme="light"] .marv-footer-connect .marv-contact-icon,
html[data-theme="light"] .shell.portal .gateway-contact-footer .marv-contact-icon{
  color:#111111 !important;
}
@media(max-width:700px){
  .marv-footer-connect .marv-contact-icon-nav,
  .shell.portal .gateway-contact-footer .marv-contact-icon-nav{gap:12px}
  .marv-footer-connect .marv-contact-icon,
  .shell.portal .gateway-contact-footer .marv-contact-icon{width:27px !important;height:27px !important;min-width:27px;min-height:27px}
  .marv-footer-connect .marv-contact-icon svg,
  .shell.portal .gateway-contact-footer .marv-contact-icon svg{width:18px !important;height:18px !important}
  .shell.portal .gateway-contact-footer{padding-top:4px !important}
}


/* V115 | Mobile spacing recovery: no artificial 145px gap after the footer. */
@media (max-width: 760px) {
  /* Avoid changing viewport heights as mobile browser bars appear/disappear. */
  .shell.portal .gateway {
    box-sizing: border-box;
    height: auto !important;
    min-height: 100svh !important;
    padding-top: clamp(12px, 2svh, 20px) !important;
    padding-bottom: max(14px, env(safe-area-inset-bottom)) !important;
    gap: clamp(9px, 1.45svh, 15px) !important;
  }
  /* Old flexible decorative spacers created unwanted vertical displacement. */
  .shell.portal .gateway::before,
  .shell.portal .gateway::after {
    display: none !important;
    content: none !important;
  }
  /* Keep the same card presentation while removing the forced extra height. */
  .shell.portal .gateway-options {
    flex: 0 0 auto !important;
    height: clamp(285px, 42svh, 365px) !important;
    max-height: none !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
    margin: 0 auto !important;
  }
  .shell.portal .gateway-end {
    margin: 4px auto 0 !important;
  }
  /* Any spare viewport height belongs above the icons, never below them. */
  .shell.portal .gateway-contact-footer {
    margin: auto auto 0 !important;
    padding: 4px 0 0 !important;
  }
  .site-footer {
    padding-bottom: max(24px, env(safe-area-inset-bottom)) !important;
  }
  /* Center footer end-notes to avoid the fixed bottom-left actions. */
  .site-footer .footer-bottom {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 27px;
    padding-top: 20px;
    text-align: center;
  }
  .site-footer .footer-bottom > span {
    max-width: calc(100% - 20px);
    line-height: 1.6;
  }
}
@media (max-width: 360px) {
  .shell.portal .gateway {
    padding-inline: 10px !important;
  }
  .shell.portal .gateway-contact-footer .marv-contact-icon-nav {
    gap: 10px;
  }
}

/* V116 — welcome mobile: breathe below the browser chrome.
   Shift the entire welcome content down, not the footer. Keep the document in
   natural flow (no translate/absolute centering), so small phones may scroll. */
@media (max-width: 760px) {
  .shell.portal .gateway {
    /* Compensates for mobile browser chrome and visually balances the bottom
       free space created by the small icon-only footer. */
    padding-top: clamp(58px, 9.5svh, 94px) !important;
    padding-bottom: max(14px, env(safe-area-inset-bottom)) !important;
    height: auto !important;
    min-height: 100svh !important;
    justify-content: flex-start !important;
  }
  .shell.portal .gateway-intro,
  .shell.portal .gateway-options,
  .shell.portal .gateway-end {
    flex-shrink: 0;
  }
  /* Footer retains the bottom slot; it doesn't inherit the welcome offset. */
  .shell.portal .gateway-contact-footer {
    margin: auto auto 0 !important;
  }
}
/* Compact viewports: prefer natural scroll rather than compressing the intro. */
@media (max-width: 760px) and (max-height: 650px) {
  .shell.portal .gateway {
    padding-top: clamp(24px, 5svh, 40px) !important;
  }
}

/* V117 — Android/iOS welcome scroll-end fix.
   The generic #app 100vh floor used the browser's large viewport, while the
   portal itself used 100svh. Their mismatch left scrollable empty space after
   the final contact icon row. Keep these overrides scoped to the welcome page. */
@media (max-width: 760px) {
  html[data-space="portal"] #app {
    min-height: 0 !important;
    height: auto !important;
  }
  html[data-space="portal"] .shell.portal {
    min-height: 0 !important;
    height: auto !important;
    overflow: clip;
  }
  html[data-space="portal"] .shell.portal .gateway {
    box-sizing: border-box;
    height: auto !important;
    min-height: 100svh !important;
    /* The scaled/blurred decorative glow must not extend scrollable bounds. */
    overflow: clip;
  }
  html[data-space="portal"] .shell.portal .gateway-contact-footer {
    margin-bottom: 0 !important;
    flex-shrink: 0;
  }
}


/* V121 — Country code selector in both contact forms */
.lead-phone-field{grid-column:1/-1;display:flex;flex-direction:column;gap:7px;min-width:0}
.lead-phone-label{font-size:12px;font-weight:900}
.lead-phone-controls{display:flex;align-items:stretch;gap:9px;min-width:0;direction:ltr}
.lead-phone-controls #lead-country-code,.lead-phone-controls #lead-national-phone{min-width:0;margin:0;padding:14px 12px;min-height:53px;border:1px solid var(--edge);border-radius:15px;background:var(--bg);color:var(--ink);font:700 13px 'Cairo',system-ui,sans-serif;outline-color:var(--a)}
.lead-phone-controls #lead-country-code{flex:0 0 clamp(123px,11vw,153px);width:clamp(123px,11vw,153px);max-width:45%;cursor:pointer;text-align:left;direction:ltr;padding-inline:9px 5px}
.lead-phone-controls #lead-country-code option,.lead-phone-controls #lead-country-code optgroup{color:var(--ink);background:var(--surface);font-size:13px}
.lead-phone-controls #lead-national-phone{flex:1 1 auto;width:100%;text-align:left}
.lead-phone-controls #lead-national-phone::placeholder{color:var(--muted);font-weight:500;opacity:.8}
.lead-phone-help{color:var(--muted);font-size:10px;line-height:1.65}
.lead-form button[type="submit"]:disabled{cursor:wait;opacity:.62;pointer-events:none}
@media(max-width:700px){.lead-phone-controls{gap:8px}.lead-phone-controls #lead-country-code{flex-basis:123px;width:123px}.lead-phone-controls #lead-national-phone{min-width:0}.lead-phone-help{font-size:10px}}
@media(max-width:350px){.lead-phone-controls #lead-country-code{flex-basis:112px;width:112px}.lead-phone-controls #lead-country-code,.lead-phone-controls #lead-national-phone{font-size:12px;padding:12px 8px}}


/* V124 — semantic main links, clean and responsive without replacing the MARV design */
.gateway-main-links,.marv-site-directory{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:clamp(14px,2.2vw,31px)}
.gateway-main-links{margin:12px auto 8px;padding:12px 16px;max-width:1000px}
.gateway-main-links a{color:var(--ink);font-size:clamp(10px,.96vw,13px);font-weight:800;opacity:.78;transition:opacity .22s,color .22s}
.gateway-main-links a:hover,.gateway-main-links a:focus-visible{opacity:1;color:var(--a)}
.marv-site-directory{grid-column:1/-1;width:100%;padding:13px 0 0;margin:10px auto 0;border-top:1px solid rgba(255,255,255,.14)}
.marv-site-directory a{font-size:clamp(10px,1vw,13px);font-weight:700;color:rgba(255,255,255,.86)}
.marv-site-directory a:hover{color:#fff;text-decoration:underline;text-underline-offset:5px}
.marv-hub-page{display:flex;flex-direction:column;align-items:center;gap:clamp(15px,2vw,26px);padding-top:clamp(40px,5vw,72px)!important;padding-bottom:clamp(20px,3vw,38px)!important}
.marv-hub-page .portal-switches{position:absolute;top:12px;left:12px}
.marv-hub-brand img{height:clamp(70px,9vw,105px);width:auto;object-fit:contain}
.marv-hub-brand a{display:block}
.marv-hub-intro{text-align:center;max-width:850px;position:relative}
.marv-hub-intro h1{font-size:clamp(40px,6vw,80px);line-height:1.24;margin:13px 0}
.marv-hub-intro p{font-size:clamp(13px,1.3vw,18px);line-height:1.95;color:var(--muted);margin:0 auto;max-width:690px}
.marv-hub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;width:min(1100px,100%)}
.marv-hub-card{border:1px solid var(--edge);border-radius:clamp(24px,3vw,42px);padding:clamp(23px,3vw,44px);min-height:240px;background:var(--surface);display:flex;flex-direction:column;align-items:flex-start;gap:15px;transition:transform .28s,border-color .28s}
.marv-hub-card:hover{transform:translateY(-5px);border-color:var(--a)}
.marv-hub-card small{font:800 11px Manrope,sans-serif;color:var(--muted);letter-spacing:2px}
.marv-hub-card h2{font-size:clamp(25px,3vw,38px);line-height:1.25;margin:0}
.marv-hub-card p{color:var(--muted);font-size:clamp(12px,1.15vw,16px);line-height:1.9;margin:0}
.marv-hub-card>span{margin-top:auto;color:var(--ink);font-size:13px;font-weight:900}
.marv-hub-card.business{background:linear-gradient(130deg,var(--surface),color-mix(in srgb,#87d9cb 15%,var(--surface)))}
.marv-hub-card.marketing{background:linear-gradient(130deg,var(--surface),color-mix(in srgb,#ed9378 14%,var(--surface)))}
.marv-hub-contact{border-top:1px solid var(--edge);width:min(1100px,100%);padding:24px 0 12px}
.marv-hub-contact>h2{text-align:center;font-size:clamp(23px,2.5vw,33px);margin:0 0 20px}
.marv-hub-contact .marv-contact-hub{width:100%;margin:0}
@media(max-width:700px){
 .gateway-main-links{gap:13px 20px;padding:11px 10px}
 .gateway-main-links a{font-size:11px}
 .marv-site-directory{gap:12px 20px}
 .marv-site-directory a{font-size:11px}
 .marv-hub-page{padding-top:75px!important}
 .marv-hub-page .portal-switches{top:9px;left:9px}
 .marv-hub-grid{grid-template-columns:1fr;gap:10px}
 .marv-hub-card{min-height:170px;padding:25px}
 .marv-hub-contact{padding:18px 0}
}
/* Specificity-safe hub layout: old welcome-page viewport rules must not stretch info pages. */
.shell.portal .gateway.marv-hub-page{height:auto!important;min-height:0!important;justify-content:flex-start!important}
.shell.portal .gateway.marv-hub-page .gateway-contact-footer{margin:5px auto 0!important}
.shell.portal .gateway.marv-hub-page .marv-hub-brand img{max-width:140px}
@media(max-width:760px){
 .shell.portal .gateway.marv-hub-page{padding-top:clamp(42px,7svh,72px)!important;gap:17px!important;min-height:0!important}
 .shell.portal .gateway.marv-hub-page .gateway-contact-footer{margin:6px auto 0!important}
}


/* V126 | Welcome page: keep all four primary site links in exactly one row.
   Equal fluid columns instead of a wrapping flex line, with abbreviated mobile
   labels and zero min-content overflow on narrow iPhone/Android viewports. */
.shell.portal .gateway:not(.marv-hub-page) > .gateway-main-links {
  display: grid;
  /* The welcome layout gives its intro/cards/footer explicit flex orders.
     Place these links after the end-note instead of unexpectedly at the top. */
  order: 5;
  flex: 0 0 auto;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: center;
  justify-content: center;
  width: min(100%, 720px);
  max-width: 100%;
  min-width: 0;
  margin: 9px auto 6px;
  padding: 9px 0;
  column-gap: clamp(6px, 2.1vw, 23px);
  row-gap: 0;
}
.shell.portal .gateway:not(.marv-hub-page) > .gateway-main-links > a {
  display: block;
  min-width: 0;
  max-width: 100%;
  font-size: clamp(11px, 1.08vw, 13px);
  line-height: 1.65;
  white-space: nowrap;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}
.shell.portal .gateway:not(.marv-hub-page) .gateway-nav-label-compact { display: none; }
@media (max-width: 700px) {
  .shell.portal .gateway:not(.marv-hub-page) > .gateway-main-links {
    width: 100%;
    gap: clamp(3px, 1.25vw, 7px);
    margin: 5px auto 2px;
    padding: 7px 0;
  }
  .shell.portal .gateway:not(.marv-hub-page) > .gateway-main-links > a {
    font-size: clamp(9px, 2.65vw, 11px);
    line-height: 1.7;
  }
  .shell.portal .gateway:not(.marv-hub-page) .gateway-nav-label-full { display: none; }
  .shell.portal .gateway:not(.marv-hub-page) .gateway-nav-label-compact { display: inline; }
}
/* Avoid a 1–2px horizontal scrollbar caused by rounded viewport widths. */
html[data-space="portal"] { overflow-x: clip; }


/* V127 — portal contact and small-screen navigation: no overlapping tiles,
   duplicated contact strips or fixed actions in front of page links. */
.shell.portal .gateway.marv-hub-contact-page {
  min-width: 0;
  max-width: 100%;
}
.shell.portal .marv-hub-contact-page .marv-hub-contact {
  width: min(100%, 1020px);
  min-width: 0;
  padding: clamp(18px, 3vw, 30px) 0 8px;
}
.shell.portal .marv-hub-contact-page .marv-hub-contact > h2 {
  margin: 0 0 clamp(15px, 2.5vw, 25px);
}
.shell.portal .marv-hub-contact-page .marv-contact-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(16px, 3vw, 32px);
  align-items: start;
  min-width: 0;
  width: 100%;
}
.shell.portal .marv-hub-contact-page .marv-contact-direct-group,
.shell.portal .marv-hub-contact-page .marv-contact-social-group {
  min-width: 0;
  width: 100%;
  gap: 13px;
}
.shell.portal .marv-hub-contact-page .marv-direct-links {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  width: 100%;
  min-width: 0;
}
.shell.portal .marv-hub-contact-page .marv-direct-link {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex: none;
  width: 100%;
  min-width: 0;
  min-height: 76px;
  padding: 12px 16px;
  gap: 13px;
  border-radius: 18px;
}
.shell.portal .marv-hub-contact-page .marv-direct-icon {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
}
.shell.portal .marv-hub-contact-page .marv-direct-details {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  text-align: start;
  gap: 3px;
}
.shell.portal .marv-hub-contact-page .marv-direct-details strong {
  font-size: 13px;
  line-height: 1.5;
}
.shell.portal .marv-hub-contact-page .marv-direct-details small {
  display: block;
  align-self: flex-start;
  max-width: 100%;
  direction: ltr;
  white-space: nowrap;
  font-size: 12px;
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
}
.shell.portal .marv-hub-contact-page .marv-social-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  width: 100%;
  min-width: 0;
}
.shell.portal .marv-hub-contact-page .marv-social-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  width: 100%;
  min-height: 111px;
  padding: 12px 6px;
  gap: 10px;
  border-radius: 18px;
  text-align: center;
}
.shell.portal .marv-hub-contact-page .marv-social-icon,
.shell.portal .marv-hub-contact-page .marv-social-icon svg {
  width: 30px;
  height: 30px;
}
.shell.portal .marv-hub-contact-page .marv-social-name {
  font-size: clamp(10px, 1vw, 12px);
  line-height: 1.4;
  max-width: 100%;
}
.shell.portal .marv-hub-contact-page > .gateway-main-links {
  position: relative;
  width: 100%;
  max-width: 790px;
  min-width: 0;
  margin: 12px auto 0;
  padding: 12px 0;
  border-top: 1px solid var(--edge);
}
@media (max-width: 850px) {
  .shell.portal .marv-hub-contact-page .marv-contact-page {
    grid-template-columns: minmax(0, 1fr);
    gap: 25px;
  }
}
@media (max-width: 760px) {
  /* Portal and hub pages already offer direct call/WhatsApp icons. The fixed
     corner buttons otherwise cover the primary page navigation on phones. */
  html[data-space="portal"] .floating-contact {
    display: none !important;
  }
  .shell.portal .gateway.marv-hub-contact-page {
    padding-inline: clamp(12px, 4vw, 20px) !important;
    gap: clamp(14px, 2.4vw, 22px) !important;
  }
  .shell.portal .marv-hub-contact-page .marv-hub-contact {
    padding-top: 20px;
  }
  .shell.portal .marv-hub-contact-page .marv-hub-contact > h2 {
    font-size: clamp(23px, 6vw, 29px);
    line-height: 1.45;
  }
  .shell.portal .marv-hub-contact-page .marv-hub-kicker {
    font-size: 11px;
    line-height: 1.6;
    gap: 8px;
  }
  .shell.portal .marv-hub-contact-page .marv-direct-link {
    min-height: 70px;
    padding: 11px 14px;
    gap: 13px;
  }
  .shell.portal .marv-hub-contact-page .marv-direct-details strong {
    font-size: 12px;
  }
  .shell.portal .marv-hub-contact-page .marv-direct-details small {
    font-size: 11px;
  }
  .shell.portal .marv-hub-contact-page .marv-social-link {
    min-height: 91px;
    border-radius: 16px;
    padding: 10px 3px;
    gap: 7px;
  }
  .shell.portal .marv-hub-contact-page .marv-social-icon,
  .shell.portal .marv-hub-contact-page .marv-social-icon svg {
    width: 26px;
    height: 26px;
  }
  .shell.portal .marv-hub-contact-page .marv-social-name {
    font-size: clamp(9px, 2.75vw, 11px);
  }
  /* Hub links can flow onto a centered second line without clipping. The
     four welcome links retain their independent V126 one-row grid layout. */
  .shell.portal .gateway.marv-hub-page > .gateway-main-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 4px 10px;
    max-width: 100%;
    margin: 12px auto 0;
    padding: 11px 0;
  }
  .shell.portal .gateway.marv-hub-page > .gateway-main-links > a {
    flex: 0 0 auto;
    max-width: 100%;
    padding: 7px 5px;
    font-size: clamp(10px, 2.8vw, 12px);
    line-height: 1.55;
    white-space: normal;
    text-align: center;
  }
}
@media (max-width: 350px) {
  .shell.portal .marv-hub-contact-page .marv-social-links {
    gap: 6px;
  }
  .shell.portal .marv-hub-contact-page .marv-social-link {
    padding-inline: 2px;
  }
}

/* V128 — polished portal /contact layout for desktop, tablet and mobile.
   No duplicated fixed contact shortcuts; balance two premium contact panels.
   Scoped to the hub contact page so division contact forms and welcome cards
   retain their previous layout. */
html[data-space="portal"] .floating-contact {
  display: none !important;
}
.shell.portal .gateway.marv-hub-contact-page {
  max-width: 100%;
  overflow-x: clip;
}
.shell.portal .marv-hub-contact-page .marv-hub-grid,
.shell.portal .marv-hub-contact-page .marv-hub-contact {
  width: min(100%, 1160px);
}
.shell.portal .marv-hub-contact-page .marv-hub-card {
  min-width: 0;
  min-height: 226px;
  padding: clamp(25px, 2.7vw, 40px);
}
.shell.portal .marv-hub-contact-page .marv-hub-contact {
  border-top: 1px solid var(--edge);
  margin-top: clamp(8px, 1.3vw, 18px);
  padding: clamp(27px, 3vw, 43px) 0 0;
}
.shell.portal .marv-hub-contact-page .marv-hub-contact > h2 {
  text-align: center;
  font-size: clamp(27px, 2.5vw, 39px);
  line-height: 1.45;
  margin: 0 0 clamp(17px, 2.3vw, 30px);
}
.shell.portal .marv-hub-contact-page .marv-contact-page {
  grid-template-columns: minmax(0, 1.18fr) minmax(0, .93fr);
  align-items: stretch;
  gap: clamp(14px, 1.6vw, 22px);
  width: 100%;
}
.shell.portal .marv-hub-contact-page .marv-contact-direct-group,
.shell.portal .marv-hub-contact-page .marv-contact-social-group {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  min-width: 0;
  min-height: 208px;
  padding: clamp(19px, 2vw, 28px);
  gap: 17px;
  background: var(--surface);
  background: linear-gradient(135deg, var(--surface), color-mix(in srgb, var(--surface) 88%, var(--surface2)));
  border: 1px solid var(--edge);
  border-radius: clamp(20px, 2vw, 28px);
  box-shadow: 0 16px 44px rgba(0, 0, 0, .035);
}
.shell.portal .marv-hub-contact-page .marv-hub-kicker {
  min-height: 24px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.5;
  gap: 10px;
}
.shell.portal .marv-hub-contact-page .marv-hub-kicker span {
  font-size: 12px;
  white-space: nowrap;
}
.shell.portal .marv-hub-contact-page .marv-direct-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(10px, 1.1vw, 15px);
  flex: 1;
}
.shell.portal .marv-hub-contact-page .marv-direct-link {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
  min-height: 105px;
  height: 100%;
  padding: clamp(13px, 1.15vw, 18px);
  gap: clamp(10px, .9vw, 14px);
  border-radius: 19px;
  background: var(--glass);
}
.shell.portal .marv-hub-contact-page .marv-direct-link .marv-direct-icon {
  width: 44px;
  height: 44px;
  flex-basis: 44px;
  border-radius: 14px;
}
.shell.portal .marv-hub-contact-page .marv-direct-icon svg {
  width: 22px;
  height: 22px;
}
.shell.portal .marv-hub-contact-page .marv-direct-details {
  min-width: 0;
  flex: 1;
  align-items: flex-start;
  text-align: start;
}
.shell.portal .marv-hub-contact-page .marv-direct-details strong {
  font-size: clamp(12px, .98vw, 14px);
  font-weight: 900;
  line-height: 1.6;
}
.shell.portal .marv-hub-contact-page .marv-direct-details small {
  max-width: 100%;
  font-size: clamp(11px, .84vw, 13px);
  font-weight: 750;
  line-height: 1.5;
  white-space: nowrap;
  text-overflow: clip;
}
.shell.portal .marv-hub-contact-page .marv-social-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  flex: 1;
  gap: clamp(8px, .9vw, 13px);
  min-width: 0;
}
.shell.portal .marv-hub-contact-page .marv-social-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 105px;
  height: 100%;
  padding: 14px 8px;
  border-radius: 19px;
  gap: 12px;
  background: var(--glass);
}
.shell.portal .marv-hub-contact-page .marv-social-icon,
.shell.portal .marv-hub-contact-page .marv-social-icon svg {
  width: clamp(25px, 2.25vw, 33px);
  height: clamp(25px, 2.25vw, 33px);
}
.shell.portal .marv-hub-contact-page .marv-social-name {
  font-size: clamp(10px, .88vw, 13px);
  line-height: 1.4;
}
.shell.portal .marv-hub-contact-page > .gateway-main-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(14px, 2.25vw, 34px);
  width: min(100%, 1160px);
  max-width: 100%;
  padding: 22px 12px 10px;
  margin: 6px auto 0;
  border-top: 1px solid var(--edge);
}
.shell.portal .marv-hub-contact-page > .gateway-main-links > a {
  font-size: clamp(11px, .9vw, 13px);
  line-height: 1.7;
  font-weight: 800;
  text-align: center;
  white-space: nowrap;
}
@media (max-width: 1020px) {
  .shell.portal .marv-hub-contact-page .marv-contact-page {
    grid-template-columns: minmax(0, 1fr);
  }
  .shell.portal .marv-hub-contact-page .marv-contact-direct-group,
  .shell.portal .marv-hub-contact-page .marv-contact-social-group {
    min-height: 0;
  }
  .shell.portal .marv-hub-contact-page .marv-direct-link,
  .shell.portal .marv-hub-contact-page .marv-social-link {
    min-height: 90px;
  }
}
@media (max-width: 760px) {
  .shell.portal .marv-hub-contact-page .marv-hub-grid { width: 100%; }
  .shell.portal .marv-hub-contact-page .marv-hub-card { min-height: 170px; padding: 24px; }
  .shell.portal .marv-hub-contact-page .marv-hub-contact {
    margin-top: 3px;
    padding-top: 22px;
  }
  .shell.portal .marv-hub-contact-page .marv-contact-page { gap: 13px; }
  .shell.portal .marv-hub-contact-page .marv-contact-direct-group,
  .shell.portal .marv-hub-contact-page .marv-contact-social-group {
    padding: 16px;
    gap: 12px;
    border-radius: 20px;
  }
  .shell.portal .marv-hub-contact-page .marv-hub-kicker { font-size: 12px; }
  .shell.portal .marv-hub-contact-page .marv-direct-links { grid-template-columns: minmax(0, 1fr); gap: 9px; }
  .shell.portal .marv-hub-contact-page .marv-direct-link { min-height: 73px; padding: 10px 13px; }
  .shell.portal .marv-hub-contact-page .marv-direct-details strong { font-size: 12px; }
  .shell.portal .marv-hub-contact-page .marv-direct-details small { font-size: 11px; }
  .shell.portal .marv-hub-contact-page .marv-social-link { min-height: 90px; padding: 10px 3px; gap: 9px; }
  .shell.portal .marv-hub-contact-page .marv-social-name { font-size: clamp(10px, 2.7vw, 12px); }
  .shell.portal .gateway.marv-hub-contact-page > .gateway-main-links {
    gap: 4px 10px;
    margin-top: 8px;
    padding: 14px 0 4px;
  }
}
@media (max-width: 350px) {
  .shell.portal .marv-hub-contact-page .marv-social-link { padding-inline: 1px; }
  .shell.portal .marv-hub-contact-page .marv-social-name { font-size: 10px; }
}