
/* Version 3 visual system: strongly scoped to the studio front-end. */
body.mdstudio{background:#09111e;color:#f4f7ff;font-family:Inter,Arial,sans-serif}
body.mdstudio .md-header{background:#0b1324;border-bottom:1px solid rgba(255,255,255,.09);position:sticky;top:0;z-index:100;backdrop-filter:blur(18px)}
body.mdstudio.admin-bar .md-header{top:32px}
body.mdstudio .md-header .logo,body.mdstudio .md-header .links a{color:#edf3ff}
body.mdstudio .md-header .links a:hover{color:#baf5aa}
body.mdstudio #main .md3-hero{background:radial-gradient(ellipse 55% 85% at 79% 45%,#283e66 0,transparent 75%),linear-gradient(155deg,#080e1b,#101b32 70%,#121c2b);padding:86px 0 32px;overflow:hidden;color:#fff}
body.mdstudio .md3-hero-layout{display:grid;grid-template-columns:44% 56%;align-items:center;gap:15px;min-height:630px}
body.mdstudio .md3-strap{font-size:11px;letter-spacing:.17em;color:#c1dfc2;text-transform:uppercase;font-weight:750;display:flex;align-items:center;gap:11px}
body.mdstudio .md3-pulse{height:9px;width:9px;background:#c0ffa3;box-shadow:0 0 0 7px #bfffab1d;border-radius:50%}
body.mdstudio .md3-hero h1{color:#fff;font-size:clamp(51px,5.4vw,89px);line-height:1.02;letter-spacing:-.07em;margin:26px 0 27px;max-width:710px}
body.mdstudio .md3-gradient{color:#bdfcae;background:linear-gradient(100deg,#bcfaab,#94defd);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body.mdstudio .md3-hero p{font-size:17px;line-height:1.78;color:#b5c4d4;max-width:505px}
body.mdstudio .md3-actions{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin:32px 0 53px}
body.mdstudio .md3-button{display:inline-flex;align-items:center;gap:25px;background:#bdf7a7;border:1px solid #bdf7a7;border-radius:12px;padding:16px 19px;color:#12211a;font-size:14px;font-weight:800;box-shadow:0 10px 30px #bdffad25;transition:transform .2s,box-shadow .2s}
body.mdstudio .md3-button:hover{color:#12211a;transform:translateY(-4px);box-shadow:0 15px 40px #bdffad36}
body.mdstudio .md3-secondary{color:#ecf6f8;font-size:14px;font-weight:700}
body.mdstudio .md3-hero-bottom{display:flex;gap:22px;flex-wrap:wrap;color:#8e9cb0;font-size:10px;letter-spacing:.06em;text-transform:uppercase;font-weight:700}
body.mdstudio .md3-hero-stage{height:570px;position:relative;perspective:1100px}
body.mdstudio .md3-stage-halo{position:absolute;inset:35px 15px 65px 30px;background:radial-gradient(ellipse,#b1a5ff30,transparent 65%);filter:blur(26px)}
body.mdstudio .md3-hero-stage figure{margin:0;position:absolute;overflow:hidden;border:1px solid #8eabc04d;border-radius:20px;box-shadow:0 30px 85px #0008;transition:transform .65s cubic-bezier(.2,.75,.25,1),box-shadow .65s}
body.mdstudio .md3-hero-stage figure img{width:100%;height:100%;object-fit:cover;display:block}
body.mdstudio .md3-stage-main{inset:45px 18% 100px 0;z-index:2;transform:rotate(-5deg)}
body.mdstudio .md3-stage-side-top{inset:12px 0 auto auto;width:43%;height:210px;z-index:3;transform:rotate(7deg)}
body.mdstudio .md3-stage-side-bottom{inset:auto 0 35px auto;width:45%;height:210px;z-index:3;transform:rotate(4deg)}
body.mdstudio .md3-stage-main:hover{transform:rotate(-2deg) translateY(-12px) scale(1.02)}
body.mdstudio .md3-stage-side-top:hover,body.mdstudio .md3-stage-side-bottom:hover{transform:rotate(0deg) translateY(-12px) scale(1.03)}
body.mdstudio .md3-float-label{position:absolute;left:9%;bottom:20px;z-index:4;padding:12px 15px;background:#e8eff9;color:#0f2133;border-radius:11px;box-shadow:0 20px 35px #0005;font-weight:800;font-size:12px;transform:rotate(-5deg)}
body.mdstudio .md3-float-label b{color:#347e75;font-size:19px;margin-left:8px}
body.mdstudio .md3-hero-tail{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;border-top:1px solid #ffffff24;padding:26px 0 0;color:#93a7b8;font-size:11px;font-weight:800;letter-spacing:.13em}
body.mdstudio #main .md3-showcase{background:#e8ebef;color:#121b2c;padding:100px 0 86px;overflow:hidden}
body.mdstudio .md3-showcase-head{display:flex;justify-content:space-between;gap:25px;align-items:end;margin-bottom:32px}
body.mdstudio .md3-showcase-head h2{color:#121b2c;font-size:clamp(34px,4vw,62px);line-height:1.08;max-width:760px}
body.mdstudio .md3-showcase-head h2 i{font-family:Georgia,serif;font-weight:400}
body.mdstudio .md3-label{color:#647388;font-size:11px;font-weight:900;letter-spacing:.15em;text-transform:uppercase}
body.mdstudio .md3-controls{display:flex;gap:8px}
body.mdstudio .md3-controls button{background:white;border:1px solid #c5ced9;color:#182437;width:47px;height:47px;padding:0;border-radius:50%;cursor:pointer;font-size:22px}
body.mdstudio .md3-controls button:hover{background:#15243c;color:white}
body.mdstudio .md3-slider{display:flex;gap:22px;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;padding-bottom:12px;scrollbar-width:thin;scrollbar-color:#9ba7b5 transparent}
body.mdstudio .md3-slide{min-width:min(68vw,710px);position:relative;border-radius:22px;overflow:hidden;scroll-snap-align:center;box-shadow:0 13px 40px #14203926;isolation:isolate}
body.mdstudio .md3-slide img{width:100%;aspect-ratio:1.54;object-fit:cover;display:block;transition:transform .7s}
body.mdstudio .md3-slide:hover img{transform:scale(1.055)}
body.mdstudio .md3-slide:after{content:'';position:absolute;inset:48% 0 0;background:linear-gradient(transparent,#0c1025db);pointer-events:none}
body.mdstudio .md3-slide>div{position:absolute;bottom:28px;left:32px;z-index:2;color:#fff}
body.mdstudio .md3-slide h3{font-size:31px;color:white;margin:7px 0 0}
body.mdstudio .md3-slide span{font-size:11px;letter-spacing:.13em;font-weight:900;color:#d0ffc3}
body.mdstudio .md3-showcase-foot{display:flex;justify-content:space-between;color:#5c6e7d;font-size:13px;margin-top:21px}
body.mdstudio .md3-showcase-foot a{color:#162939;font-weight:800}
body.mdstudio #main .md3-inverse-title,body.mdstudio #main .section[style*="background:#0f1b2a"] h2{color:#f7f9ff!important}
body.mdstudio #main .section[style*="background:#0f1b2a"] .card h3{color:#f1f8ff!important}
body.mdstudio .mdv-page .mdv-intro h1,body.mdstudio .mdv-page .mdv-outro h2{color:#f8fbff!important}
body.mdstudio .mdv-page .mdv-gallery .mdv-project{transition:transform .3s,box-shadow .3s}
body.mdstudio .mdv-page .mdv-gallery .mdv-project:hover{transform:translateY(-6px);box-shadow:0 20px 50px #0005}
body.mdstudio .md3-reveal{animation:md3-rise .8s both}
@keyframes md3-rise{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}
body.mdstudio .md3-inview{opacity:0;transform:translateY(26px);transition:opacity .65s,transform .65s}
body.mdstudio .md3-inview.md3-visible{opacity:1;transform:translateY(0)}
body.mdstudio .md-footer a,body.mdstudio .md-footer p{color:#aab9c8}
body.mdstudio .md-footer a:hover{color:#bdffad}
@media(max-width:960px){body.mdstudio .md3-hero-layout{grid-template-columns:1fr;min-height:0}body.mdstudio .md3-hero-stage{height:530px}body.mdstudio .md3-hero{padding-top:62px}body.mdstudio .md3-hero-bottom{display:none}body.mdstudio .md3-slide{min-width:80vw}}
@media(max-width:600px){body.mdstudio .md3-hero-stage{height:315px}body.mdstudio .md3-stage-main{inset:25px 20% 55px 0}body.mdstudio .md3-stage-side-top{height:125px}body.mdstudio .md3-stage-side-bottom{height:120px;bottom:20px}body.mdstudio .md3-float-label{display:none}body.mdstudio .md3-hero h1{font-size:50px}body.mdstudio .md3-slide{min-width:86vw}body.mdstudio .md3-slide>div{left:18px;bottom:15px}body.mdstudio .md3-showcase{padding:65px 0}body.mdstudio .md3-showcase-head{align-items:start}body.mdstudio .md3-showcase-head h2{font-size:33px}}
@media(prefers-reduced-motion:reduce){body.mdstudio .md3-reveal,body.mdstudio .md3-inview{animation:none;opacity:1;transform:none;transition:none}body.mdstudio .md3-slider{scroll-behavior:auto}}
