/* Homepage cinematic gateway — intentionally isolated from editorial page styles. */
.mosaic-page{overflow-x:clip;background:#000;color:#fff}

.mosaic-home{min-height:100svh;min-inline-size:0;padding:clamp(10px,1.15vw,18px);overflow:clip;background:#000;isolation:isolate}
.cinema-window{position:relative;z-index:0;display:flex;flex-direction:column;min-height:calc(100svh - clamp(20px,2.3vw,36px));overflow:hidden;border:1px solid rgba(255,255,255,.1);padding:clamp(34px,5.5vh,66px) clamp(24px,6.2vw,96px) 18px;background:radial-gradient(ellipse at 17% 56%,rgba(80,227,223,.22),transparent 32%),radial-gradient(ellipse at 78% 30%,rgba(238,40,115,.20),transparent 42%),radial-gradient(ellipse at 50% 108%,rgba(80,227,223,.12),transparent 55%),linear-gradient(112deg,#000,#07090b 50%,#000);box-shadow:inset 0 0 130px #000,inset 0 0 0 8px rgba(0,0,0,.22),0 0 50px rgba(0,0,0,.8)}
.cinema-window:before{content:"";position:absolute;inset:8px;z-index:4;pointer-events:none;border:1px solid rgba(231,211,191,.045);clip-path:polygon(0 0,100% 0,100% calc(100% - 42px),calc(100% - 42px) 100%,0 100%)}
.cinema-window:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(to bottom,#000,transparent 85%)}
.cinema-grain{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.2'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
.projector-motif{position:absolute;z-index:-1;inset-inline-start:-88px;inset-block-start:5%;width:210px;height:440px;opacity:.23;border:7px solid #50e3df;border-radius:100px 100px 20px 20px;transform:rotate(-8deg)}
.projector-motif i{position:absolute;inset-inline-start:50%;width:108px;aspect-ratio:1;border:9px double #50e3df;border-radius:50%;transform:translateX(-50%)}
.projector-motif i:first-child{inset-block-start:20px}.projector-motif i:nth-child(2){inset-block-start:134px}.projector-motif span{position:absolute;inset-block-end:38px;inset-inline-start:68px;width:190px;height:55px;border:7px solid #ee2873;border-radius:50%;box-shadow:0 0 38px rgba(238,40,115,.55)}
.projector-beam{position:absolute;z-index:-1;inset-inline-start:5%;inset-block-start:43%;width:46%;height:19%;transform:rotate(-7deg);transform-origin:left center;background:linear-gradient(90deg,rgba(80,227,223,.30),rgba(80,227,223,.08) 50%,transparent);clip-path:polygon(0 42%,100% 0,100% 100%,0 58%);filter:blur(5px);animation:projector-breathe 7s ease-in-out infinite}
.film-strip{position:absolute;z-index:-1;inset-inline-end:-5%;inset-block-start:40%;width:48%;height:52px;opacity:.13;border-block:8px dotted #50e3df;background:linear-gradient(90deg,transparent 49%,#50e3df 50% 51%,transparent 52%);background-size:74px 100%;transform:rotate(-10deg)}
.clapper-motif{position:absolute;z-index:-1;inset-inline-end:-2%;inset-block-end:3%;width:29%;height:28%;opacity:.15;border:3px solid #ee2873;transform:rotate(-1deg);display:grid;grid-template-columns:repeat(3,1fr);align-items:end;color:#ee2873;font:700 13px/1 Arial,sans-serif}
.clapper-motif:before{content:"";position:absolute;inset-inline:-2%;inset-block-start:-30px;height:28px;border:3px solid #ee2873;background:repeating-linear-gradient(135deg,transparent 0 34px,#ee2873 35px 50px,transparent 51px 76px);transform:rotate(-15deg);transform-origin:right bottom}
.clapper-motif i{position:absolute;inset:32% 0 auto;border-block:2px solid #ee2873}.clapper-motif span{padding:12px;text-align:center;border-inline-start:2px solid #ee2873}
.window-index{position:absolute;inset-block-start:24px;inset-inline-start:27px;display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.34);font:600 9px/1 Arial,sans-serif;letter-spacing:.16em;direction:ltr}.window-index span{color:#50e3df}.window-index i{display:block;width:34px;height:1px;background:currentColor}.window-index bdi{font-weight:500}

.gateway-grid{inline-size:min(850px,74vw);max-inline-size:100%;min-inline-size:0;margin:auto;contain:inline-size;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(270px,.88fr);grid-template-rows:minmax(210px,1.08fr) minmax(150px,.76fr) minmax(150px,.76fr);grid-template-areas:"main main" "jera oud" "far oud";gap:clamp(16px,1.8vw,26px);direction:ltr}
.gateway-card{--edge:#fff;position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;min-width:0;padding:clamp(26px,2.7vw,40px);direction:rtl;color:#fff;border:1px solid var(--edge);border-radius:16px 4px;clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px));box-shadow:inset 0 0 46px rgba(0,0,0,.28),0 0 22px color-mix(in srgb,var(--edge) 32%,transparent);transition:transform .32s ease,filter .32s ease}
.gateway-card:before{content:"";position:absolute;inset:1px;z-index:-1;clip-path:inherit;background:linear-gradient(135deg,rgba(255,255,255,.15),transparent 42%)}
.gateway-card:after{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 50% 120%,rgba(255,255,255,.12),transparent 45%)}
.gateway-card:hover{transform:translateY(-5px);filter:brightness(1.14)}.gateway-card:focus-visible{outline:3px solid #fff;outline-offset:4px}.gateway-card:hover .enter-mark,.gateway-card:focus-visible .enter-mark{opacity:1;transform:translateX(-3px)}
.gateway-main{grid-area:main;--edge:#e05568;background:radial-gradient(circle at 13% 62%,rgba(214,72,90,.42) 0 16%,transparent 52%),linear-gradient(118deg,#a3202f 0%,#6f1826 44%,#340e15 80%,#180a0d 100%)}
.gateway-oud{grid-area:oud;--edge:#ee2873;background:radial-gradient(circle at 24% 34%,rgba(255,255,255,.34) 0 10%,transparent 56%),linear-gradient(158deg,#ee2873 0%,#c81a5c 54%,#8e0f3f 100%)}
.gateway-jera{grid-area:jera;--edge:#50e3df;background:radial-gradient(circle at 22% 38%,rgba(238,40,115,.26) 0 8%,transparent 55%),linear-gradient(140deg,#50e3df 0%,#2bbdb8 55%,#0f807a 100%);color:#00201f}
.gateway-far{grid-area:far;--edge:#820766;background:radial-gradient(circle at 20% 40%,rgba(0,0,0,.42) 0 8%,transparent 58%),linear-gradient(140deg,#820766 0%,#5a0447 55%,#1a0114 100%)}
.frame-label{position:absolute;z-index:3;top:clamp(15px,1.7vw,24px);right:clamp(18px,2vw,32px);color:rgba(255,255,255,.5);font:600 clamp(.62rem,.9vw,.78rem)/1 Arial,sans-serif;letter-spacing:.22em;direction:ltr}
.main-ring{position:absolute;z-index:0;top:-52px;left:-58px;width:300px;height:300px;border-radius:50%;border:40px solid rgba(255,196,206,.07);box-shadow:0 0 0 30px rgba(255,196,206,.045);pointer-events:none}
.brand-icon{position:absolute;z-index:0;left:clamp(14px,3vw,42px);inset-block-end:clamp(18px,3vw,40px);width:clamp(74px,9vw,112px);height:auto;color:rgba(255,255,255,.13);fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.brand-icon-main{inset-inline-start:clamp(20px,6vw,82px);inset-block-end:clamp(14px,2.3vw,32px);width:clamp(122px,17vw,220px);color:rgba(255,117,132,.17);stroke-width:4}
.brand-icon-oud{inset-inline-start:18px;inset-block-end:20px;width:132px;transform:rotate(-8deg)}
.brand-icon-jera,.brand-icon-far{left:16px;inset-block-end:15px;width:104px}
.gateway-jera .brand-icon{color:rgba(0,32,31,.18)}
.reel-motif{position:absolute;inset-block-start:14%;left:-46px;width:210px;height:96px;padding:13px 14px;display:grid;grid-template-columns:repeat(4,1fr);gap:7px;border-block:8px dotted rgba(255,255,255,.18);background:rgba(255,255,255,.06);transform:rotate(-32deg)}
.reel-motif i{display:block;border:1px solid rgba(255,255,255,.14);background:linear-gradient(135deg,rgba(255,255,255,.09),transparent)}
.jera-reel{position:absolute;left:-28px;inset-block-start:24px;width:118px;aspect-ratio:1;border:24px dotted rgba(0,32,31,.10);border-radius:50%;filter:blur(1px)}
.far-clapper{position:absolute;inset-inline-start:-8px;inset-block-end:12px;width:120px;height:74px;opacity:.11;border:8px double #fff;transform:rotate(12deg)}
.far-clapper:after{content:"";position:absolute;inset:-22px -8px auto;height:16px;border:6px double #fff;transform:rotate(-8deg);transform-origin:left bottom}
.card-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;max-width:100%}
.brand-title{font-size:clamp(1.65rem,3vw,2.75rem);font-weight:900;line-height:1.25;letter-spacing:normal;white-space:nowrap}.gateway-main .brand-title{font-size:clamp(2.4rem,4.4vw,3.8rem)}.gateway-main .brand-title span{color:#ff9c9f}
.card-copy>b{font:500 clamp(.72rem,1.1vw,.9rem)/1.4 Arial,sans-serif;letter-spacing:.14em;opacity:.68;margin-block:6px 13px;white-space:nowrap}.card-copy strong{font-size:clamp(.95rem,1.45vw,1.25rem);font-weight:700;line-height:1.45;white-space:nowrap}.card-copy small{max-width:42ch;margin-block-start:5px;overflow-wrap:anywhere;font-size:clamp(.72rem,1.1vw,.88rem);line-height:1.65;opacity:.76}
.enter-mark{position:absolute;inset-inline-start:0;inset-block-end:0;display:flex;align-items:center;gap:7px;opacity:.48;font-size:.7rem;font-weight:700;transition:opacity .25s ease,transform .25s ease}.enter-mark i{font:400 1rem/1 Arial,sans-serif}.gateway-main .enter-mark{inset-inline-start:auto;inset-inline-end:calc(100% + 18px)}
.gateway-footer{width:min(850px,74vw);margin:clamp(14px,2.5vh,26px) auto 0;display:flex;flex-direction:column-reverse;align-items:center;text-align:center;gap:7px;direction:rtl;color:rgba(255,255,255,.6);font-size:.74rem}.gateway-footer p{margin:0}.gateway-footer nav{display:flex;gap:10px;direction:ltr}.gateway-footer a{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;color:#fff;transition:.2s}.gateway-footer a:hover{background:#fff;color:#111;transform:translateY(-2px)}.gateway-footer svg{width:19px;height:19px}

@keyframes projector-breathe{0%,100%{opacity:.58}50%{opacity:1}}

@media(max-width:768px){
 .mosaic-page{overflow-y:auto}.mosaic-home{min-height:100svh;height:auto;padding:0;overflow:visible}.cinema-window{min-height:100svh;height:auto;overflow:visible;border:0;padding:0 14px max(18px,env(safe-area-inset-bottom));background-attachment:scroll}
 .gateway-grid{inline-size:100%;max-inline-size:100%;margin:0;padding-block-start:max(20px,env(safe-area-inset-top));grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"main" "oud" "jera" "far";gap:12px}
 .gateway-card{width:100%;max-width:100%;min-width:0;min-height:168px;scroll-margin-top:82px;padding:22px 17px;border-radius:10px 2px;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
 .gateway-main{min-height:220px}.gateway-oud{min-height:196px}.gateway-jera,.gateway-far{min-height:168px}.frame-label{top:13px;right:15px;font-size:.66rem}
 .gateway-main .brand-title{font-size:2.65rem}.brand-title{font-size:1.8rem}.card-copy{max-width:100%}.card-copy>b{font-size:.72rem;margin-block:3px 7px}.card-copy strong{font-size:.94rem}.card-copy small{font-size:.8rem;line-height:1.55}
 .brand-icon{left:12px;inset-block-end:12px;width:88px;opacity:.7}.brand-icon-main{width:138px}.brand-icon-oud{width:108px}.reel-motif{left:-58px;max-width:70%}.projector-motif{width:130px;height:280px;inset-inline-start:-76px;opacity:.1}.projector-motif i{width:70px}.projector-motif i:nth-child(2){inset-block-start:95px}.film-strip{width:75%;opacity:.08}.clapper-motif{width:60%;opacity:.08}.gateway-footer{width:100%;margin-block-start:14px}.gateway-footer p{font-size:.68rem}
 .window-index{display:none}.enter-mark{display:none}
}
@media(max-width:540px){
 .cinema-window{padding-inline:10px}.gateway-grid{gap:10px}.gateway-card{padding:19px 13px;min-height:164px}.gateway-main{min-height:214px}.gateway-oud{min-height:190px}.gateway-jera,.gateway-far{min-height:164px}
 .gateway-main .brand-title{font-size:2.35rem}.brand-title{font-size:1.6rem}.card-copy strong{font-size:.88rem}.card-copy small{max-width:31ch;font-size:.74rem;line-height:1.5}.frame-label{font-size:.62rem;letter-spacing:.16em}.gateway-footer{margin-block-start:12px}
}
@media(max-width:390px){
 .cinema-window{padding-inline:8px}.gateway-grid{gap:9px}.gateway-card{padding:17px 11px;min-height:158px}.gateway-main{min-height:206px}.gateway-oud{min-height:184px}.gateway-jera,.gateway-far{min-height:158px}
 .gateway-main .brand-title{font-size:2.15rem}.brand-title{font-size:1.5rem}.card-copy>b{font-size:.68rem}.card-copy strong{font-size:.84rem}.card-copy small{font-size:.72rem}.frame-label{top:11px;right:12px}.gateway-footer{margin-block-start:9px;gap:2px}.gateway-footer p{font-size:.62rem}
}
@media(prefers-reduced-motion:reduce){.projector-beam{animation:none}.gateway-card{transition:none}.gateway-card:hover{transform:none}}
.card-sub2{margin-block-start:2px;opacity:.6}
