/* AuraGlobal Digital Studio — unified visual identity, Oct 2026.
   Uses the same SVG logo, dark navy, mint and blue hierarchy as AuraGlobal.
   Scoped to .studio-page to leave product/affiliate pages untouched. */
:root{color-scheme:dark}
body.studio-page{
  --bg:#05070c;--surface:#0e1522;--line:rgba(255,255,255,.12);
  --muted:#aeb9c9;--mint:#5ef0b2;--cream:#ffe0b7;
  margin:0;color:#f7f8fb;
  background:
    radial-gradient(circle at 13% 2%,rgba(94,240,178,.13),transparent 34rem),
    radial-gradient(circle at 90% 15%,rgba(126,166,255,.13),transparent 35rem),
    #05070c;
}
body.studio-page .studio-header{
  position:sticky;top:0;z-index:90;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:rgba(5,7,12,.94);
  -webkit-backdrop-filter:blur(19px);backdrop-filter:blur(19px);
}
body.studio-page .studio-header-inner{
  width:min(100%,1280px);margin:0 auto;padding:13px 23px;
  display:flex;align-items:center;gap:20px;min-height:72px;
}
body.studio-page .studio-logo{
  flex:none;display:inline-flex;align-items:center;gap:11px;
  text-decoration:none;white-space:nowrap;
}
body.studio-page .studio-logo .ag-symbol{
  display:block;width:31px;height:29px;flex:none;
  filter:drop-shadow(0 0 2px rgba(91,230,166,.18));
}
body.studio-page .studio-logo .ag-wordmark{
  display:inline-flex;align-items:center;white-space:nowrap;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight:300;font-size:14px;letter-spacing:.42em;line-height:1;
}
body.studio-page .studio-logo .aura{color:#a9ebca}
body.studio-page .studio-logo .global{color:#f1f5f3;margin-left:.42em}
body.studio-page .studio-identity{
  border-left:1px solid rgba(255,255,255,.18);padding-left:15px;
  color:#a6b8c4;font-size:10px;letter-spacing:.16em;font-weight:850;
  white-space:nowrap;
}
body.studio-page .studio-nav{
  margin-left:auto;display:flex;align-items:center;justify-content:flex-end;
  flex-wrap:wrap;gap:7px 18px;
}
body.studio-page .studio-nav a{
  text-decoration:none;font-size:12px;line-height:1.25;
  font-weight:700;color:#c7d4df;white-space:nowrap;
}
body.studio-page .studio-nav a:hover{color:#fff}
body.studio-page .studio-nav .studio-cta{
  background:#b6ffcf;color:#071b15!important;border-radius:12px;
  padding:11px 13px;font-weight:900;box-shadow:0 5px 23px rgba(94,240,178,.11);
}
body.studio-page a:focus-visible{outline:3px solid #5ef0b2;outline-offset:4px}
body.studio-page .wrap{max-width:1240px}
body.studio-page .hero{position:relative;padding-top:76px;padding-bottom:72px;gap:clamp(22px,4vw,64px)}
body.studio-page .hero:before{
  content:"";position:absolute;pointer-events:none;z-index:-1;
  left:-10%;right:-10%;top:3%;height:75%;
  background:radial-gradient(ellipse at 50% 40%,rgba(94,240,178,.035),transparent 60%);
}
body.studio-page h1,body.studio-page h2,body.studio-page h3{color:#fff}
body.studio-page h1{font-weight:950}
body.studio-page h1 em{color:#a9f7cd}
body.studio-page .eyebrow{
  color:#b1ffd5;border-color:rgba(94,240,178,.29);
  background:rgba(94,240,178,.065);
}
body.studio-page .intro{color:#d4dee8;font-size:clamp(16px,1.5vw,19px)}
body.studio-page .btn{border-radius:13px}
body.studio-page .btn-primary{
  background:#b6ffcf;color:#0c2019!important;
  box-shadow:0 10px 28px rgba(79,226,165,.14)
}
body.studio-page .btn-secondary{
  background:rgba(255,255,255,.045);
  border-color:rgba(255,255,255,.22);color:#f3f7fa
}
body.studio-page .micro{color:#abb9c8}
body.studio-page .visual{
  border:1px solid rgba(255,255,255,.20);
  border-radius:24px;
  background:linear-gradient(135deg,#182332 0%,#0a111b 60%,#123128);
  box-shadow:0 28px 80px rgba(0,0,0,.40);
}
body.studio-page .browser{background:#0b121d;border:1px solid rgba(255,255,255,.14)}
body.studio-page .browser-head{background:#121e2c}
body.studio-page .browser-body{
  background:
    radial-gradient(circle at 100% 0%,rgba(126,166,255,.13),transparent 54%),
    radial-gradient(circle at 10% 90%,rgba(94,240,178,.12),transparent 58%),#0b131e;
}
body.studio-page .mini-label{color:#adffd0}
body.studio-page .mini-title{color:#fff}
body.studio-page .mini-title b{color:#b6ffcf}
body.studio-page .mini-copy{max-width:315px;color:#d1deec}
body.studio-page .tiles{gap:9px}
body.studio-page .tiles span{
  position:relative;isolation:isolate;overflow:hidden;
  color:#fff;text-shadow:0 2px 9px rgba(0,0,0,.9);
  border:1px solid rgba(255,255,255,.18);
  background-position:center;background-size:cover;
  box-shadow:inset 0 -34px 42px rgba(2,6,11,.45)
}
body.studio-page .tiles span:nth-child(1){background-image:linear-gradient(180deg,transparent,rgba(2,7,13,.86)),url("https://images.unsplash.com/photo-1495474472287-4d71bcdd2085?auto=format&fit=crop&w=450&q=75")}
body.studio-page .tiles span:nth-child(2){background-image:linear-gradient(180deg,transparent,rgba(2,7,13,.86)),url("https://www.dotblue-ebike.de/wp-content/uploads/2025/11/Blaupunkt-MINNA_Pano.jpg")}
body.studio-page .tiles span:nth-child(3){background-image:linear-gradient(180deg,transparent,rgba(2,7,13,.86)),url("https://images.unsplash.com/photo-1441986300917-64674bd600d8?auto=format&fit=crop&w=450&q=75")}
body.studio-page .visual-foot{color:#bbcbd8}
body.studio-page .visual-foot b{color:#baffd6}
body.studio-page .strip{
  background:rgba(13,21,32,.78);
  border-color:rgba(255,255,255,.11)
}
body.studio-page .strip-inner{color:#cad5df}
body.studio-page .section-label{color:#a5ffce}
body.studio-page .section-lead{color:#cbd7e2}
body.studio-page .service,body.studio-page .sample{
  background:linear-gradient(140deg,rgba(21,34,51,.97),rgba(11,18,29,.98));
  border:1px solid rgba(255,255,255,.15);
  box-shadow:0 14px 38px rgba(0,0,0,.16);
}
body.studio-page .service:nth-child(2),body.studio-page .sample:nth-child(2){background:linear-gradient(140deg,rgba(27,35,59,.97),rgba(12,18,31,.98))}
body.studio-page .service:nth-child(3),body.studio-page .sample:nth-child(3){background:linear-gradient(140deg,rgba(20,43,44,.97),rgba(11,18,29,.98))}
body.studio-page .service p,body.studio-page .service li,body.studio-page .sample p{color:#d0dce8}
body.studio-page .service .num,body.studio-page .sample .tag{color:#a1ffd0}
body.studio-page .service .price{color:#ffe0b7}
body.studio-page .sample:hover,body.studio-page .service:hover{border-color:rgba(94,240,178,.52)}
body.studio-page .note{
  border-color:#5ef0b2;background:rgba(94,240,178,.055);color:#cfdae4;
}
body.studio-page .step{background:rgba(15,24,38,.85)}
body.studio-page .big-cta{
  border-color:rgba(94,240,178,.28);
  background:radial-gradient(circle at 100% 0,rgba(94,240,178,.15),transparent 47%),radial-gradient(circle at 0 100%,rgba(126,166,255,.12),transparent 50%),#0f1929;
}
body.studio-page .big-cta p{color:#d7e0e9}
body.studio-page footer{border-color:rgba(255,255,255,.13);color:#aab9cb}
body.studio-page footer a:hover{color:#baffda}
@media(max-width:1060px){
  body.studio-page .studio-header-inner{flex-wrap:wrap;row-gap:12px}
  body.studio-page .studio-nav{margin-left:0;flex-basis:100%;justify-content:flex-start;gap:9px 19px}
}
@media(max-width:680px){
  body.studio-page .studio-header-inner{padding:12px 17px 11px;min-height:0;gap:8px 12px}
  body.studio-page .studio-logo .ag-symbol{width:29px;height:27px}
  body.studio-page .studio-logo .ag-wordmark{font-size:12px;letter-spacing:.38em}
  body.studio-page .studio-logo .global{margin-left:.38em}
  body.studio-page .studio-identity{font-size:9px;padding-left:9px;letter-spacing:.10em}
  body.studio-page .studio-nav{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:17px;padding:4px 0 3px;scrollbar-width:none}
  body.studio-page .studio-nav::-webkit-scrollbar{display:none}
  body.studio-page .studio-nav a{font-size:11px;flex:none}
  body.studio-page .studio-nav .studio-cta{padding:8px 10px}
  body.studio-page .hero{padding:43px 0 48px}
  body.studio-page h1{font-size:clamp(41px,10.5vw,60px);line-height:1.02}
  body.studio-page .visual{width:100%;max-width:100%}
  body.studio-page .tiles span{min-height:95px}
  body.studio-page .section{padding:57px 0}
  body.studio-page .service,body.studio-page .sample{padding:23px}
}


/* v3 — exact homepage shell, real homepage navigation and imagery.
   This overrides old standalone Studio header styles and brings the rest of
   the pages into the AuraGlobal homepage layout vocabulary. */
body.studio-page{--ag-local-one:#5ef0b2;background:#070a10!important;color:#f7f9fc!important;padding-bottom:0!important}
body.studio-page :is(h1,h2,h3,p){overflow-wrap:break-word}
body.studio-page .wrap,body.studio-page .shell{max-width:1240px!important;width:auto;margin:0 auto!important;padding-left:22px!important;padding-right:22px!important}
body.studio-page .topbar.mock-nav{
  position:sticky!important;top:0!important;left:auto!important;right:auto!important;
  z-index:120!important;min-height:0!important;
  border:0!important;border-bottom:1px solid rgba(255,255,255,.13)!important;
  background:rgba(7,10,16,.97)!important;
  backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important;
}
body.studio-page .topbar.mock-nav .nav{
  height:68px!important;min-height:68px!important;
  display:flex!important;align-items:center!important;gap:20px!important;
  margin:0 auto!important;padding:0 22px!important;max-width:1280px!important;
}
body.studio-page .topbar.mock-nav .brand.ag-brand.approved-logo{
  flex:none!important;display:inline-flex!important;align-items:center!important;
  gap:11px!important;margin:0!important;letter-spacing:normal!important;
  text-decoration:none!important;
}
body.studio-page .topbar.mock-nav .approved-logo .ag-symbol{
  display:block!important;width:31px!important;height:29px!important;flex:none!important;
}
body.studio-page .topbar.mock-nav .approved-logo .ag-wordmark{
  display:inline-flex!important;align-items:center!important;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif!important;
  font-size:14px!important;font-weight:300!important;
  letter-spacing:.42em!important;line-height:1!important;white-space:nowrap!important;
}
body.studio-page .topbar.mock-nav .approved-logo .aura{font-size:inherit!important;color:#a9ebca!important}
body.studio-page .topbar.mock-nav .approved-logo .global{
  margin-left:.42em!important;font-size:inherit!important;color:#f1f5f3!important;
}
body.studio-page .topbar.mock-nav .navlinks{
  display:flex!important;flex-wrap:nowrap!important;align-items:center!important;
  gap:clamp(9px,1.55vw,25px)!important;margin:0 0 0 auto!important;
}
body.studio-page .topbar.mock-nav .navlinks a{
  color:#d7e2e9!important;opacity:1!important;font-size:clamp(11px,.95vw,13px)!important;
  font-weight:700!important;white-space:nowrap!important;letter-spacing:0!important;
}
body.studio-page .topbar.mock-nav .nav-icons{
  display:flex!important;align-items:center!important;gap:11px!important;flex:none!important;
}
body.studio-page .topbar.mock-nav .nav-icons>a:not(.nav-cta){
  color:#e6f2ec!important;font-size:23px!important;text-decoration:none!important;
}
body.studio-page .topbar.mock-nav .nav-cta{
  display:inline-flex!important;align-items:center!important;
  padding:11px 15px!important;min-height:40px!important;border:1px solid transparent!important;
  background:linear-gradient(110deg,#c5f5d5,#a9e9d3)!important;
  color:#153a29!important;font-size:12px!important;font-weight:870!important;
  border-radius:13px!important;text-decoration:none!important;white-space:nowrap!important;
  box-shadow:0 8px 24px rgba(5,32,19,.1)!important;
}
body.studio-page main{display:block!important;overflow:hidden}
body.studio-page .hero{
  display:grid!important;grid-template-columns:minmax(0,1.05fr) minmax(310px,.95fr)!important;
  gap:clamp(30px,4.2vw,67px)!important;
  align-items:center!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:clamp(46px,6vw,82px) 22px clamp(48px,5.7vw,80px)!important;
  background:transparent!important;
}
body.studio-page .hero:after{display:none!important}
body.studio-page .hero>div{min-width:0}
body.studio-page .hero h1{
  margin:18px 0 20px!important;max-width:14ch!important;
  font-size:clamp(45px,5.45vw,76px)!important;letter-spacing:-.06em!important;
  line-height:.99!important;text-wrap:balance!important;color:#fff!important;
}
body.studio-page .hero h1 em{color:#a9f7cd!important;-webkit-text-fill-color:#a9f7cd!important}
body.studio-page .hero .eyebrow{color:#a3f7c9!important;margin:0}
body.studio-page .studio-lang{
  display:inline-block;color:#c9e6e0!important;text-decoration:underline!important;
  text-underline-offset:4px;font-weight:800;font-size:12px;margin:9px 0 0 12px;
}
body.studio-page .hero p.intro{
  color:#cdd9e2!important;font-size:clamp(16px,1.5vw,18px)!important;
  line-height:1.68!important;max-width:600px!important;
}
body.studio-page .hero .hero-actions{gap:12px!important;margin-top:25px!important}
body.studio-page .hero .btn-primary,body.studio-page .big-cta .btn-primary{
  color:#112b1d!important;background:#b6ffcf!important;
  box-shadow:0 12px 29px rgba(74,216,158,.2)!important;
}
body.studio-page .hero .btn-secondary,body.studio-page .big-cta .btn-secondary{
  color:#edf8f1!important;background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.24)!important;
}
body.studio-page .hero .visual{
  padding:11px!important;border-radius:23px!important;
  background:linear-gradient(145deg,#19312f,#101826,#0d151e)!important;
}
body.studio-page .hero .browser{border-radius:17px!important}
body.studio-page .hero .browser-body{min-height:310px}
body.studio-page .hero .tiles span{
  min-height:104px!important;border-radius:11px!important;font-size:13px!important;
  text-shadow:0 2px 9px #000!important;
}
body.studio-page .strip{background:#0d141e!important;padding:21px 0!important}
body.studio-page .strip-inner{color:#d2dde5!important}
body.studio-page .section{background:#070a10!important;padding:clamp(55px,6.4vw,83px) 22px!important}
body.studio-page .section h2{color:#fff!important}
body.studio-page .section-label{color:#a0edbe!important;letter-spacing:.14em!important}
body.studio-page .section-lead{color:#cfdae4!important}
body.studio-page .services{gap:18px!important}
body.studio-page .service{
  padding:clamp(22px,2.3vw,31px)!important;border-radius:22px!important;
  border:1px solid rgba(255,255,255,.18)!important;
  background:linear-gradient(145deg,#152332,#0a1019)!important;
}
body.studio-page .service:nth-child(1){border-top:4px solid #b2f0ca!important}
body.studio-page .service:nth-child(2){border-top:4px solid #aecfff!important}
body.studio-page .service:nth-child(3){border-top:4px solid #f4bddd!important}
body.studio-page .service:nth-child(4){border-top:4px solid #f8cca0!important}
body.studio-page .service h3{font-size:clamp(21px,2.3vw,26px)!important}
body.studio-page .service .num{color:#b3ffd9!important}
body.studio-page .service .price{color:#ffe1b8!important}
body.studio-page .service p,body.studio-page .service li{color:#d3dce4!important;font-size:14px!important;line-height:1.66!important}
body.studio-page .sample-grid{gap:16px!important}
body.studio-page .sample{
  position:relative!important;isolation:isolate!important;overflow:hidden!important;
  min-height:355px!important;justify-content:flex-end!important;
  border-radius:23px!important;
  padding:22px!important;
  background-color:#111f2d!important;
  background-size:cover!important;background-position:center!important;
  border:1px solid rgba(255,255,255,.25)!important;
  box-shadow:0 16px 47px rgba(0,0,0,.25)!important;
}
body.studio-page .sample:nth-child(1){
  background-image:linear-gradient(180deg,rgba(1,5,11,.10) 0%,rgba(4,10,16,.36) 39%,rgba(2,8,13,.97) 85%),url("https://images.unsplash.com/photo-1441986300917-64674bd600d8?auto=format&fit=crop&w=900&q=82")!important
}
body.studio-page .sample:nth-child(2){
  background-image:linear-gradient(180deg,rgba(1,5,11,.06) 0%,rgba(4,10,16,.37) 40%,rgba(2,8,13,.97) 87%),url("https://www.dotblue-ebike.de/wp-content/uploads/2025/11/Blaupunkt-MINNA_Pano.jpg")!important
}
body.studio-page .sample:nth-child(3){
  background-image:linear-gradient(180deg,rgba(1,5,11,.06) 0%,rgba(4,10,16,.39) 39%,rgba(2,8,13,.97) 86%),url("https://images.unsplash.com/photo-1596462502278-27bfdc403348?auto=format&fit=crop&w=900&q=82")!important
}
body.studio-page .sample .tag{
  font-size:10px!important;font-weight:950!important;letter-spacing:.14em!important;
  color:#baffd8!important;text-shadow:0 2px 7px #000!important;
}
body.studio-page .sample h3{
  margin:12px 0 8px!important;font-size:clamp(23px,2.5vw,29px)!important;
  letter-spacing:-.035em!important;color:#fff!important;
}
body.studio-page .sample p{color:#e0e9ee!important;font-size:14px!important;line-height:1.56!important;margin:0 0 12px!important}
body.studio-page .sample .open{color:#bbffda!important;font-size:13px!important}
body.studio-page .steps{gap:16px!important}
body.studio-page .step{
  background:#131d2a!important;border:1px solid rgba(255,255,255,.13)!important;
  border-top:3px solid rgba(160,244,198,.86)!important;
  border-radius:19px!important;padding:24px!important
}
body.studio-page .step p{color:#d2dde5!important}
body.studio-page #contact,body.studio-page #kontakt{
  padding:20px 22px 66px!important;margin:0 auto!important;background:#070a10!important;
}
body.studio-page .big-cta{
  background:radial-gradient(circle at 0 100%,rgba(137,182,245,.19),transparent 40%),
    radial-gradient(circle at 100% 0,rgba(94,240,178,.22),transparent 38%),#10202a!important;
  border-radius:25px!important;
}
body.studio-page :is(#contact,#kontakt) .de{color:#cdd8df!important}
body.studio-page footer.footer{
  background:#070a10!important;border-top:1px solid rgba(255,255,255,.12)!important;
  margin-top:0!important;padding:28px 0 36px!important;color:#b9c4d0!important;
}
body.studio-page footer.footer>.shell{
  display:flex!important;flex-wrap:wrap!important;align-items:center!important;
  justify-content:space-between!important;gap:15px 25px!important;
}
body.studio-page footer.footer .footer-links{display:flex!important;flex-wrap:wrap!important;gap:12px 19px!important}
body.studio-page footer.footer .footer-links a{
  font-size:12px!important;color:#d7e2e9!important;text-decoration:none!important
}
body.studio-page footer.footer .footer-links a:hover{color:#baffdb!important}
@media(max-width:1110px){
 body.studio-page .topbar.mock-nav .navlinks{display:none!important}
 body.studio-page .topbar.mock-nav .nav-icons{margin-left:auto!important}
}
@media(max-width:740px){
 body.studio-page .wrap,body.studio-page .shell{padding-left:17px!important;padding-right:17px!important}
 body.studio-page .topbar.mock-nav{min-height:0!important}
 body.studio-page .topbar.mock-nav .nav{height:62px!important;min-height:62px!important;padding:0 17px!important}
 body.studio-page .topbar.mock-nav .approved-logo .ag-symbol{width:29px!important;height:27px!important}
 body.studio-page .topbar.mock-nav .approved-logo .ag-wordmark{font-size:12px!important;letter-spacing:.38em!important}
 body.studio-page .topbar.mock-nav .nav-icons>a:not(.nav-cta){display:none!important}
 body.studio-page .topbar.mock-nav .nav-cta{display:inline-flex!important;min-height:36px!important;padding:9px 12px!important;font-size:11px!important}
 body.studio-page .hero{grid-template-columns:1fr!important;gap:23px!important;padding:37px 17px 54px!important}
 body.studio-page .hero h1{font-size:clamp(42px,10.5vw,63px)!important;max-width:15ch!important;line-height:1!important}
 body.studio-page .hero .intro{font-size:16px!important}
 body.studio-page .studio-lang{display:block;margin:11px 0 0}
 body.studio-page .hero .visual{max-width:100%;min-width:0}
 body.studio-page .hero .browser-body{min-height:260px;padding:21px!important}
 body.studio-page .section{padding:56px 17px!important}
 body.studio-page .services{grid-template-columns:1fr!important}
 body.studio-page .sample-grid{grid-template-columns:1fr!important}
 body.studio-page .sample{min-height:335px!important}
 body.studio-page .steps{grid-template-columns:1fr!important}
 body.studio-page #contact,body.studio-page #kontakt{padding-left:17px!important;padding-right:17px!important}
 body.studio-page footer.footer>.shell{align-items:flex-start!important}
}
@media(prefers-reduced-motion:reduce){
 body.studio-page .service,body.studio-page .sample{transition:none!important}
}

/* Exact AuraGlobal homepage navigation and visual-first sections */
body.studio-page .topbar.mock-nav{
  position:relative!important;top:auto!important;left:auto!important;right:auto!important;
  z-index:90!important;background:rgba(8,8,8,.94)!important;
  border-bottom:1px solid rgba(255,255,255,.13)!important;
  backdrop-filter:blur(17px)!important;
}
body.studio-page .topbar.mock-nav .shell.nav{
  max-width:1460px!important;width:100%!important;
  margin:0 auto!important;padding:0 22px!important;
  min-height:68px!important;height:auto!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  gap:clamp(10px,2vw,30px)!important;
}
body.studio-page .topbar .brand.approved-logo{flex-shrink:0!important}
body.studio-page .topbar .navlinks{
  display:flex!important;gap:clamp(10px,1.45vw,24px)!important;
  margin-left:auto!important;min-width:0!important;
}
body.studio-page .topbar .navlinks a{color:#fff!important;font-size:clamp(11px,.85vw,14px)!important;white-space:nowrap}
body.studio-page .topbar .nav-icons{display:flex!important;align-items:center!important;gap:15px!important}
body.studio-page .topbar .nav-cta{display:inline-flex!important;align-items:center!important;white-space:nowrap!important}
body.studio-page .studio-lang{
  display:inline-flex;margin-left:12px;align-items:center;
  font-size:12px;font-weight:800;color:#baffda!important;
  text-decoration:underline;text-underline-offset:4px;
}
body.studio-page .studio-showcase{
  width:100%;min-width:0;
  display:grid;grid-template-columns:1.24fr .86fr;
  grid-template-rows:minmax(0,1fr) minmax(0,1fr);
  gap:11px;min-height:490px;height:490px;
}
body.studio-page .studio-photo{
  position:relative;display:block;isolation:isolate;overflow:hidden;
  border-radius:22px;border:1px solid rgba(255,255,255,.18);
  background:#10202a;color:#fff;text-decoration:none;
  box-shadow:0 20px 45px rgba(0,0,0,.25);
}
body.studio-page .studio-photo-main{grid-row:span 2}
body.studio-page .studio-photo>img{
  position:absolute;width:100%;height:100%;inset:0;
  display:block;object-fit:cover;filter:saturate(1.02);
  transition:transform .35s ease;
}
body.studio-page .studio-photo:hover>img{transform:scale(1.045)}
body.studio-page .studio-photo:after{
  content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,rgba(3,8,12,.04) 12%,rgba(3,8,12,.08) 39%,rgba(3,8,12,.88) 100%);
}
body.studio-page .studio-photo-copy{
  position:absolute;bottom:0;left:0;right:0;z-index:1;padding:22px 20px;
  display:flex;flex-direction:column;gap:7px;
  color:#fff!important;text-shadow:0 2px 13px rgba(0,0,0,.4)
}
body.studio-page .studio-photo-copy small{font-size:10px;letter-spacing:.15em;color:#b1ffd7;font-weight:900}
body.studio-page .studio-photo-copy strong{font-size:clamp(17px,2.1vw,30px);line-height:1.05;letter-spacing:-.04em}
body.studio-page .studio-photo-copy>span{font-size:12px;font-weight:800;color:#c9ffde}
body.studio-page .studio-photo-small .studio-photo-copy{padding:17px}
body.studio-page .studio-photo-small .studio-photo-copy strong{font-size:21px}
body.studio-page .sample{overflow:hidden}
body.studio-page .studio-sample-photo{
  display:block;width:calc(100% + 50px);max-width:none;height:150px;object-fit:cover;
  margin:-25px -25px 20px;border-radius:18px 18px 7px 7px;
  filter:saturate(1.03);
}
body.studio-page .sample h3{margin-top:16px}
body.studio-page .footer{margin-top:70px;color:#bac3cd;background:#0a111b}
body.studio-page .footer .shell{
  max-width:1460px!important;width:100%!important;margin:0 auto!important;
}
body.studio-page .footer a{color:#dce8f2!important}
@media(max-width:1130px){
  body.studio-page .topbar .navlinks{display:none!important}
  body.studio-page .topbar .nav-icons{margin-left:auto!important}
  body.studio-page .topbar.mock-nav .shell.nav{min-height:64px!important;padding:0 20px!important}
}
@media(max-width:780px){
  body.studio-page .hero{
    padding:42px 0 45px!important;
    display:grid!important;grid-template-columns:1fr!important;gap:27px!important;
  }
  body.studio-page .hero h1{font-size:clamp(40px,11vw,64px)!important;line-height:1.02!important}
  body.studio-page .studio-showcase{height:375px;min-height:375px}
  body.studio-page .studio-photo{border-radius:17px}
  body.studio-page .studio-photo-copy{padding:16px}
  body.studio-page .studio-photo-copy strong{font-size:20px}
  body.studio-page .studio-photo-small .studio-photo-copy{padding:13px}
  body.studio-page .studio-photo-small .studio-photo-copy strong{font-size:16px}
  body.studio-page .studio-photo-copy small{font-size:9px}
  body.studio-page .footer{margin-top:50px}
}
@media(max-width:550px){
  body.studio-page .topbar.mock-nav .shell.nav{height:60px!important;min-height:60px!important;padding:0 17px!important}
  body.studio-page .topbar .nav-icons>a:not(.nav-cta){display:none!important}
  body.studio-page .topbar .nav-cta{display:inline-flex!important;padding:9px 11px!important;font-size:10px!important}
  body.studio-page .topbar .ag-wordmark{font-size:12px!important;letter-spacing:.35em!important}
  body.studio-page .studio-showcase{
    grid-template-columns:1fr 1fr;grid-template-rows:200px 142px;
    height:354px;min-height:354px;gap:8px;
  }
  body.studio-page .studio-photo-main{grid-row:auto;grid-column:span 2}
  body.studio-page .studio-photo-copy{padding:12px}
  body.studio-page .studio-photo-main .studio-photo-copy strong{font-size:22px}
  body.studio-page .studio-photo-small .studio-photo-copy strong{font-size:15px}
  body.studio-page .studio-sample-photo{height:155px;width:calc(100% + 46px);margin:-23px -23px 17px}
}