/* cRAED / STUDIO EDITION V4
   Deliberately arranged, art-directed and low-motion design system.
   This layer loads after NIGHTFALL/VELOCITY and before CARD DEPTH.
*/
:root{
 --max:1320px;
 --studio-panel:#100c12;
 --studio-elevated:#1c0d17;
 --studio-text:#ffeff3;
 --studio-muted:#bca6af;
 --studio-line:rgba(255,104,138,.22);
 --studio-red:#ff3860;
}
body{background:#08070b;color:var(--studio-text);}
.container{width:min(var(--max),calc(100% - 68px));}
.section{
 padding:clamp(82px,8vw,120px) 0;
 background:radial-gradient(ellipse 60% 65% at 95% 0%,rgba(97,11,40,.11),transparent 70%),#09070b;
}
.section-shade{
 background:radial-gradient(ellipse 65% 63% at 6% 21%,rgba(95,13,42,.15),transparent 75%),#0d0910;
}
.section-heading{
 position:relative;
 display:flex;
 align-items:center;
 gap:26px;
 border-bottom:1px solid rgba(255,84,126,.23);
 padding:0 0 32px;
 margin:0 0 39px;
}
.section-heading:after{
 width:94px;height:2px;
 right:0;bottom:-1px;
 background:linear-gradient(90deg,transparent,#ff547f);
 box-shadow:0 0 9px #ee22494d;
}
.section-number{
 font-size:clamp(65px,7.4vw,92px)!important;
 letter-spacing:-5px;
 -webkit-text-stroke:1px #ff5a7e90;
 text-shadow:0 0 28px #e8273920!important;
 opacity:.65;
}
.section-heading>div{flex:1;min-width:0;}
.section-heading h2{
 font-size:clamp(34px,3.6vw,52px);
 line-height:1.29;
 letter-spacing:-.75px;
 margin:8px 0 4px;
}
.section-heading p{font-size:13px;color:#bda3ae;line-height:1.85;max-width:600px;}
.eyebrow{font-size:11px;letter-spacing:3px;color:#ff607e;}
.section-heading:before{
 content:'cRAED / THE NIGHT IS OURS';
 position:absolute;
 inset:auto auto 34px 0;
 color:#8a6073;
 font:700 10px Rajdhani,Arial,sans-serif;
 letter-spacing:2px;
 direction:ltr;
}
/* Guided path makes nine sections feel like one cohesive creator destination. */
.chapter-rail{
 position:relative;
 z-index:3;
 background:#0b090edc;
 border-top:1px solid #fa3c6429;
 border-bottom:1px solid #fa3c6438;
}
.chapter-rail-inner{
 display:grid;
 grid-template-columns:minmax(190px,1.12fr) repeat(3,minmax(0,1fr));
 gap:0;
 align-items:stretch;
}
.chapter-label,.chapter-link{
 min-height:113px;
 display:flex;
 flex-direction:column;
 justify-content:center;
 padding:21px 29px;
 position:relative;
 border-left:1px solid rgba(255,88,128,.18);
 text-decoration:none;
}
.chapter-label{gap:6px;}
.chapter-red-dot{width:7px;height:7px;border-radius:50%;background:#ff315b;box-shadow:0 0 11px #fc315b;}
.chapter-label strong{font:700 13px Rajdhani,Arial,sans-serif;letter-spacing:2px;}
.chapter-label small{font-size:10px;color:#d097aa;}
.chapter-link{gap:4px;transition:background-color .2s,border-color .2s;}
.chapter-link>span{color:#ec7590;font:700 10px Rajdhani,Arial,sans-serif;letter-spacing:2px;direction:ltr;text-align:right;}
.chapter-link strong{color:#fff0f4;font-weight:900;font-size:14px;}
.chapter-link>b{
 position:absolute;left:22px;top:50%;transform:translateY(-50%);
 display:grid;place-items:center;
 width:31px;height:31px;border-radius:50%;
 border:1px solid #db506d6f;color:#ffb5c4;font:700 17px Arial;
 transition:background .2s,color .2s;
}
.chapter-link:hover,.chapter-link:focus-visible{background:#46132670;}
.chapter-link:hover>b{background:#ed2951;color:white;}
/* Original SVG brand assets; locally served, so logos render reliably. */
.social-grid{
 display:grid!important;
 grid-template-columns:repeat(12,minmax(0,1fr))!important;
 gap:20px!important;
 direction:rtl;
}
.social-grid .social-card{
 grid-column:span 4;
 display:flex;
 flex-direction:column;
 justify-content:space-between;
 min-height:217px;
 padding:25px 27px 20px;
 border:1px solid #6d334252;
 border-radius:24px;
 background:#161017;
 box-shadow:0 18px 45px #0008, inset 0 1px #ffffff0c;
 position:relative;
 isolation:isolate;
 overflow:hidden;
 color:inherit;
 text-decoration:none;
}
.social-grid .social-card:nth-child(1){grid-column:span 7;min-height:257px;}
.social-grid .social-card:nth-child(2){grid-column:span 5;min-height:257px;}
.social-grid .social-card:nth-child(n+3){grid-column:span 4;}
.social-grid .social-card:before{
 content:'';
 position:absolute;inset:0;
 border-radius:inherit;
 pointer-events:none;
 background:linear-gradient(128deg,#ffffff0a,transparent 40%,#ffffff02);
 z-index:0;
}
.social-grid .social-card:after{
 content:'';
 position:absolute;inset:auto 0 0;
 width:auto;height:3px;border:0;border-radius:0;
 background:linear-gradient(90deg,transparent,var(--brand-color,#ff3f65),transparent);
 opacity:.47;
 z-index:1;
}
.social-card.platform-kick{
 --brand-color:#53fc18;
 border-color:#2d9c3768;
 background:radial-gradient(ellipse 80% 130% at 12% 75%,#1f71332e,transparent 70%),
 linear-gradient(132deg,#112218,#09100d 76%)!important;
}
.social-card.platform-x{
 --brand-color:#ffffff;
 background:radial-gradient(ellipse 65% 140% at 20% 90%,#9891a51e,transparent 75%),linear-gradient(130deg,#221a24,#100d13 80%)!important;
}
.social-card.platform-discord{
 --brand-color:#5865f2;
 background:radial-gradient(ellipse 85% 120% at 16% 75%,#5865f225,transparent 70%),linear-gradient(130deg,#1a1a30,#0c0b16 78%)!important;
}
.social-card.platform-whatsapp{
 --brand-color:#25d366;
 background:radial-gradient(ellipse 75% 130% at 15% 80%,#25d36621,transparent 70%),linear-gradient(135deg,#11221a,#0b110f 78%)!important;
}
.social-card.platform-tiktok{
 --brand-color:#ff366a;
 background:radial-gradient(ellipse 85% 125% at 12% 80%,#ed24642a,transparent 72%),linear-gradient(140deg,#241120,#130b14 80%)!important;
}
.social-grid .social-card .platform-watermark{
 position:absolute;
 width:clamp(135px,20vw,295px);
 height:clamp(135px,20vw,295px);
 object-fit:contain;
 opacity:.065;
 filter:none;
 left:-25px;bottom:-74px;
 pointer-events:none;
 z-index:0;
 transform:rotate(-13deg);
}
.social-grid .social-card.big .platform-watermark{width:280px;height:280px;bottom:-100px;left:-38px;}
.social-grid .social-top,.social-grid .social-bottom,.social-grid .social-foot{
 position:relative;z-index:2;
 display:flex;justify-content:space-between;align-items:center;gap:20px;
}
.social-grid .social-top{align-items:center;}
.social-grid .social-logo{
 width:61px;height:61px;
 background:#080a10b6!important;
 display:grid;place-items:center;
 flex-shrink:0;
 border-radius:19px;
 border:1px solid color-mix(in srgb,var(--brand-color,#ff3962) 55%,transparent);
 box-shadow:0 0 0 6px #ffffff03;
}
.social-grid .social-logo .platform-logo{width:33px;height:33px;object-fit:contain;display:block;}
.social-grid .social-label{
 color:#e9e1e6;
 font-size:11px;font-weight:700;letter-spacing:2px;text-align:left;direction:ltr;
}
.platform-headline{display:flex;flex-direction:column;align-items:flex-end;gap:5px;}
.platform-index{font:700 12px Rajdhani,Arial,sans-serif;color:var(--brand-color,#ff476a);opacity:.7;}
.social-grid .social-bottom{margin:20px 0 12px;align-items:flex-start;}
.social-copy{display:flex;flex-direction:column;align-items:flex-start;gap:2px;max-width:100%;min-width:0;}
.platform-tag{font-size:10px;letter-spacing:.1px;color:var(--brand-color,#ff4267);margin:0 0 2px;}
.social-grid .social-bottom strong{
 font-size:clamp(20px,1.9vw,28px);
 font-weight:900;
 line-height:1.4;
 overflow-wrap:anywhere;
 color:#fff3f5;
}
.social-grid .social-bottom small{font-size:11px;color:#d2b8c2;line-height:1.8;}
.social-grid .social-foot{
 padding:12px 0 0;
 border-top:1px solid #ffffff18;
 min-height:42px;
}
.platform-visit{font-size:10px;color:#d6acb9;}
.social-grid .social-arrow{
 width:29px;height:29px;min-width:29px;display:grid;place-items:center;
 border:1px solid #ffffff31;
 border-radius:50%;
 font:700 14px Arial;
 color:#fff;
 background:#ffffff0a;
 transition:transform .17s,background .17s;
}
.social-grid .social-card:hover .social-arrow{background:var(--brand-color);color:#080a09;transform:translate(-3px,-2px)!important;}
.social-grid .social-card:hover{border-color:color-mix(in srgb,var(--brand-color) 65%,#ffffff10);}
.social-grid .social-card:hover .platform-watermark{opacity:.11;}

/* Community and support panels use real logos rather than unicode marks. */
.community-grid,.support-grid{gap:21px;}
.feature-card,.donation-card{
 min-height:365px;
 border-radius:25px;
 overflow:hidden;
 padding:30px 34px;
}
.feature-card{
 background:linear-gradient(135deg,#1c1625,#0b0a14 78%);
 border:1px solid #78659a66;
}
.feature-discord{background:radial-gradient(circle at 0% 85%,#5865f21e,transparent 55%),linear-gradient(135deg,#19182a,#0d0b16 79%);}
.feature-x{background:radial-gradient(circle at 0% 85%,#ffffff15,transparent 60%),linear-gradient(132deg,#221a22,#0d0b10 79%);}
.feature-card .feature-art{
 position:absolute;
 top:auto;left:16px;bottom:-80px;
 opacity:.055;
 transform:none;
 width:330px;height:330px;
 pointer-events:none;
}
.feature-card .feature-art img{width:100%;height:100%;object-fit:contain;}
.feature-card .feature-glyph{width:65px;height:65px;border-radius:18px;background:#08080db3;border:1px solid #ffffff32;}
.feature-card .feature-glyph img{width:30px;height:30px;object-fit:contain;}
.feature-card h3{font-size:clamp(26px,3vw,37px);}
.feature-card .feature-meta{border-color:#ffffff1b;padding-top:17px;margin-top:18px;}
.feature-card .button{min-height:50px;}
.feature-card .feature-kicker{color:#ff7a9b;}
.feature-discord .feature-kicker{color:#a6afff;}
.donation-card{
 background:linear-gradient(136deg,#261018,#120b11);
 border-color:#ec517c45;
 min-height:334px;
}
.donation-card .donation-icon{
 display:grid;place-items:center;
 width:61px;height:61px;
 border:1px solid #f06c865b;
 border-radius:17px;
 background:#260f19;
}
.donation-icon img{object-fit:contain;display:block;}
.donation-card .donation-sub{margin-top:9px;color:#ff8daa;}
.donation-card h3{font-size:clamp(31px,3.5vw,43px);letter-spacing:1.4px;}
.donation-card.muted-card{background:linear-gradient(130deg,#191719,#0f1212);border-color:#52525469;}
.muted-card .donation-icon{border-color:#80f5d24a;background:#0c2320;}
/* Mod sections get a cohesive photographic, editorial rhythm. */
.moderators-grid{gap:21px;}
.mod-card{border-radius:24px;border-color:#c55d7845;box-shadow:0 17px 42px #000a;}
.mod-card .mod-cover{height:320px;background:#0b080d;}
.mod-card .mod-info{padding:25px 26px 26px;}
.mod-card .mod-links a{border-radius:10px;padding:9px 18px;min-height:36px;}
.mod-card .mod-info h3{font-size:clamp(25px,2.4vw,34px);}
.hall-card{
 border:1px solid #a238524d;
 border-radius:27px;
 background:linear-gradient(115deg,#210f1b,#110b12 65%,#15141b);
 padding:clamp(22px,4vw,42px);
}
.hall-count{gap:clamp(16px,4vw,38px);}
.kick-square{width:102px;height:102px;border-radius:24px;background:linear-gradient(140deg,#1b481d,#071407)!important;border:1px solid #66f94177;box-shadow:0 0 30px #21bd2460!important;}
.kick-square img{width:60px;height:60px;}
.hall-badges{margin-top:35px;padding-top:27px;border-top:1px solid #ff779128;}
.real-badge{border-color:#ee65803a;background:#170e17;}
.supporter-card{border-color:#c142603c;}
.supporter-card.top{background:linear-gradient(125deg,#421021,#1c0c16 80%);}
.chat-frame,.last-stream{border-radius:27px;border-color:#ff71843a;}
.last-stream{gap:30px;}
.chat-head{padding-bottom:21px;border-bottom:1px solid #ff718325;}
/* Footer has a clearer final sign-off. */
footer{border-top:1px solid rgba(255,103,136,.38);background:linear-gradient(120deg,#170a12,#07070b 76%)!important;}
.footer-layout{min-height:160px;}
/* Compact navigation with sensible mobile rhythm */
@media(max-width:1050px){
 .chapter-rail-inner{grid-template-columns:repeat(3,minmax(0,1fr));}
 .chapter-label{grid-column:1/-1;min-height:75px;border-bottom:1px solid #fe446036;flex-direction:row;align-items:center;justify-content:space-between;}
 .chapter-link{min-height:93px;}
 .social-grid .social-card:nth-child(1),.social-grid .social-card:nth-child(2){grid-column:span 6;}
 .social-grid .social-card:nth-child(n+3){grid-column:span 4;}
 .section-heading:before{display:none;}
}
@media(max-width:760px){
 .container{width:calc(100% - 34px);}
 .section{padding:70px 0;}
 .section-heading{gap:14px;padding-bottom:22px;margin-bottom:27px;}
 .section-number{font-size:53px!important;letter-spacing:-3px;}
 .section-heading h2{font-size:clamp(29px,7vw,38px);}
 .section-heading p{font-size:11px;}
 .eyebrow{font-size:9px;letter-spacing:1.6px;}
 .chapter-rail-inner{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));}
 .chapter-label{min-height:62px;padding:13px 8px;}
 .chapter-label strong{font-size:10px;letter-spacing:1px;}
 .chapter-link{min-height:88px;padding:15px 13px;gap:7px;}
 .chapter-link strong{font-size:12px;}
 .chapter-link span{font-size:8px;letter-spacing:0;}
 .chapter-link>b{position:static;transform:none;width:23px;height:23px;font-size:12px;margin-top:3px;}
 .social-grid{gap:13px!important;}
 .social-grid .social-card,.social-grid .social-card:nth-child(1),
 .social-grid .social-card:nth-child(2),.social-grid .social-card:nth-child(n+3){
  grid-column:span 12;
  min-height:182px;
  padding:19px 21px 14px;
 }
 .social-grid .social-card:nth-child(1){min-height:217px;}
 .social-grid .social-card .platform-watermark{width:190px;height:190px;bottom:-70px;opacity:.055;}
 .social-grid .social-card.big .platform-watermark{width:225px;height:225px;bottom:-84px;}
 .social-grid .social-logo{width:51px;height:51px;border-radius:16px;}
 .social-grid .social-logo .platform-logo{width:29px;height:29px;}
 .social-grid .social-bottom{margin:14px 0 10px;}
 .social-grid .social-bottom strong{font-size:24px;}
 .feature-card,.donation-card{padding:25px;min-height:315px;}
 .feature-card .feature-art{width:225px;height:225px;bottom:-55px;}
 .mod-card .mod-cover{height:285px;}
 .mod-card .mod-info{padding:20px;}
 .hall-card{padding:22px;border-radius:22px;}
 .kick-square{width:72px;height:72px;border-radius:17px;}
 .kick-square img{width:41px;height:41px;}
 .hall-count{gap:14px;}
}
@media(max-width:395px){
 .container{width:calc(100% - 24px);}
 .chapter-link{padding:12px 9px;}
 .chapter-link strong{font-size:11px;}
 .chapter-label small{font-size:9px;}
 .social-grid .social-card{padding:18px;}
 .section-heading h2{font-size:29px;}
}
@media(prefers-reduced-motion:reduce){
 .social-grid .social-card,.social-grid .social-card *{transition:none!important;}
}
