/* Dromeda Visuals — production landing page */
:root {
  --black: #070707;
  --surface: #0d0d0d;
  --surface-2: #111111;
  --line: rgba(255,255,255,.10);
  --line-strong: rgba(255,255,255,.18);
  --text: #f4f4f0;
  --muted: #9a9a94;
  --accent: #d9ff42;
  --max: 1240px;
}

html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body {
  margin: 0;
  background: var(--black);
  color: var(--text);
  font-family: "DM Sans", sans-serif;
  overflow-x: hidden;
}
body, a, button { -webkit-font-smoothing: antialiased; }
a { color: inherit; }
::selection { background: var(--text); color: var(--black); }

.skip-link {
  position: fixed; left: 1rem; top: -100px; z-index: 2000;
  padding: .75rem 1rem; background: #fff; color: #000;
}
.skip-link:focus { top: 1rem; }

.navbar {
  background: rgba(7,7,7,.82);
  border: 1px solid transparent;
  backdrop-filter: blur(16px);
  transition: border-color .25s ease, background .25s ease;
}

.hov {
  position: fixed;
  top: 10px;
  left: 20px;
  right: 20px;
  border-radius: 30px;
  border-color: var(--line);
}

.navbar.scrolled { border-color: var(--line); background: rgba(7,7,7,.94); }
.navbar-brand, .footer-brand {
  font-family: "Space Grotesk", sans-serif;
  font-weight: 700;
  letter-spacing: -.04em;
}
.brand-muted { color: var(--muted); }
.brand-mark {
  display: grid; place-items: center; width: 30px; height: 30px;
  border: 1px solid var(--line-strong); font-size: .78rem; letter-spacing: 0;
}
.nav-link { color: #bdbdb7 !important; font-size: .9rem; }
.nav-link:hover, .nav-link:focus { color: #fff !important; }
.btn { border-radius: 0; font-weight: 600; transition: transform .2s ease, background .2s ease, color .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-light { color: #090909; }
.btn-outline-light:hover { color: #000; }

.section-space { padding: 8rem 0; }
.section-border { border-top: 1px solid var(--line); }

.hero-section {
  min-height: 100vh;
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 72% 48%, rgba(255,255,255,.055), transparent 23%),
    var(--black);
}
.hero-grid {
  position: absolute; inset: 0; opacity: .45; pointer-events: none;
  background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: linear-gradient(to bottom, transparent, black 18%, black 72%, transparent);
}
.hero-orbit {
  position: absolute; border: 1px solid rgba(255,255,255,.08); border-radius: 50%;
  pointer-events: none;
}
.hero-orbit-one { width: 650px; height: 650px; right: -260px; top: 18%; }
.hero-orbit-two { width: 440px; height: 440px; right: -155px; top: 28%; border-color: rgba(255,255,255,.055); }
.hero-orbit::after {
  content: ""; position: absolute; width: 6px; height: 6px; border-radius: 50%;
  background: #fff; top: 17%; left: 16%; box-shadow: 0 0 24px rgba(255,255,255,.6);
}
.hero-title, h2, h3 {
  font-family: "Space Grotesk", sans-serif;
}
.hero-title {
  margin: 1.3rem 0 1.5rem;
  max-width: 1000px;
  font-size: clamp(4rem, 10vw, 9rem);
  line-height: .84;
  letter-spacing: -.075em;
  font-weight: 700;
}
.hero-title em { color: #9b9b96; font-style: normal; }
.hero-copy { max-width: 650px; color: #b0b0aa; font-size: clamp(1rem, 1.6vw, 1.25rem); line-height: 1.7; }
.eyebrow {
  display: flex; align-items: center; gap: .75rem; margin: 0;
  color: #85857f; font-size: .72rem; font-weight: 700; letter-spacing: .16em;
}
.eyebrow span { display: inline-block; width: 28px; height: 1px; background: var(--line-strong); }
.hero-meta {
  display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 5rem;
  color: #777771; font-size: .72rem; text-transform: uppercase; letter-spacing: .12em;
}
.hero-meta span::before { content: "•"; margin-right: .65rem; color: #fff; }

.section-heading h2, .section-title, .display-heading {
  margin: 1.2rem 0 0; font-size: clamp(3rem, 6vw, 6.5rem); line-height: .92; letter-spacing: -.065em;
}
.section-heading h2 span, .section-title span, .display-heading span,
.contact-panel h2 span { color: rgba(255, 0, 0, 0.651); }
.body-copy, .large-copy { color: var(--muted); line-height: 1.8; }
.large-copy { color: #ddd; font-size: clamp(1.25rem, 2vw, 1.7rem); line-height: 1.5; }
.section-note { max-width: 290px; color: #73736e; margin: 0; line-height: 1.6; }

.service-list { margin-top: 4rem; border-top: 1px solid var(--line); }
.service-item {
  min-height: 290px; display: grid; grid-template-columns: 58px 1fr; gap: 1rem;
  padding: 3rem 2.5rem 3rem 0; border-bottom: 1px solid var(--line);
}
.service-item:nth-child(even) { padding-left: 2.5rem; border-left: 1px solid var(--line); }
.service-primary { min-height: 330px; }
.service-number, .process-index, .approach-item > span { color: #666660; font-size: .75rem; letter-spacing: .08em; }
.service-item h3 { font-size: clamp(1.6rem, 2.5vw, 2.5rem); letter-spacing: -.045em; }
.service-item p { max-width: 470px; color: var(--muted); line-height: 1.75; }
.text-link { display: inline-block; margin-top: .7rem; color: #fff; font-size: .9rem; text-decoration: none; border-bottom: 1px solid #555; padding-bottom: .25rem; }
.text-link:hover { border-color: #fff; }

.feature-section { background: #0a0a0a; }
.capability-grid { border-top: 1px solid var(--line); }
.capability {
  min-height: 150px; padding: 1.5rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line);
  display: flex; flex-direction: column; justify-content: space-between;
}
.capability strong { color: #5e5e59; font-size: .7rem; font-weight: 500; }
.capability span { font-family: "Space Grotesk"; font-size: 1rem; }

.process-list { border-top: 1px solid var(--line); }
.process-step {
  display: grid; grid-template-columns: 70px 1fr; gap: 1rem;
  padding: 2rem 0; border-bottom: 1px solid var(--line);
}
.process-step h3 { margin: 0 0 .55rem; font-size: 1.35rem; }
.process-step p { margin: 0; max-width: 600px; color: var(--muted); line-height: 1.65; }

.project-card { height: 100%; }
.project-visual {
  min-height: 430px; position: relative; overflow: hidden; display: flex; align-items: flex-end;
  padding: 1.5rem; background-color: #121212; border: 1px solid var(--line);
}
.project-visual::before {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(135deg, transparent 40%, rgba(255,255,255,.08) 40.2%, transparent 40.5%),
                    linear-gradient(45deg, transparent 55%, rgba(255,255,255,.05) 55.2%, transparent 55.5%);
}
.project-visual-one { background: radial-gradient(circle at 70% 35%, #292929, #101010 48%, #090909); }
.project-visual-two { background: linear-gradient(145deg, #181818, #090909); }
.project-label { position: absolute; top: 1.5rem; left: 1.5rem; color: #85857f; font-size: .7rem; letter-spacing: .14em; }
.project-word { position: relative; font-family: "Space Grotesk"; font-size: clamp(3rem, 7vw, 6rem); line-height: .8; letter-spacing: -.07em; }
.project-info { padding: 1.3rem 0; }
.project-info h3 { margin: 0 0 .35rem; font-size: 1.25rem; }
.project-info p { color: #74746e; margin: 0; font-size: .9rem; }
.project-image{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.approach-grid { border-top: 1px solid var(--line); }
.approach-item { min-height: 220px; padding: 2rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.approach-item h3 { margin: 2.5rem 0 .5rem; font-size: 1.3rem; }
.approach-item p { color: #777771; margin: 0; line-height: 1.6; }

.contact-section { padding-bottom: 8rem; }
.contact-panel {
  position: relative; overflow: hidden; padding: clamp(2rem, 6vw, 6rem);
  background: #111; border: 1px solid var(--line);
}
.contact-panel::after {
  content: ""; position: absolute; width: 430px; height: 430px; border: 1px solid rgba(255,255,255,.07);
  border-radius: 50%; right: -180px; bottom: -210px; pointer-events: none;
}
.contact-panel h2 { max-width: 850px; margin: 1.4rem 0; font-size: clamp(3.3rem, 7vw, 7rem); line-height: .9; letter-spacing: -.07em; }
.contact-panel > p:not(.eyebrow) { max-width: 620px; color: #999991; line-height: 1.75; }
.contact-details { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: 5rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.contact-details a { text-decoration: none; }
.contact-details small { display: block; margin-bottom: .45rem; color: #62625d; text-transform: uppercase; letter-spacing: .1em; font-size: .65rem; }
.contact-details strong { font-size: .9rem; font-weight: 500; color: #ddd; }

.footer { padding: 3rem 0 1.5rem; border-top: 1px solid var(--line); color: #777771; }
.footer-brand { display: inline-block; margin-bottom: .5rem; color: #eee; text-decoration: none; font-size: 1.2rem; }
.footer p { margin: 0; font-size: .85rem; }
.footer-nav, .footer-contact { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 1.25rem; }
.footer-nav a, .footer-contact a { color: #aaa; text-decoration: none; font-size: .82rem; }
.footer-nav a:hover, .footer-contact a:hover { color: #fff; }
.footer-contact { margin-top: .7rem; }
.footer-bottom { display: flex; justify-content: space-between; gap: 1rem; margin-top: 4rem; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .7rem; }

.floating-whatsapp {
  position: fixed; z-index: 1000; right: 1.5rem; bottom: 1.5rem;
  display: inline-flex; align-items: center; gap: .65rem; padding: .8rem 1rem;
  background: #e8ff61; color: #101010; text-decoration: none; border-radius: 999px;
  font-size: .78rem; font-weight: 700; box-shadow: 0 12px 35px rgba(0,0,0,.35);
  transition: transform .2s ease, box-shadow .2s ease;
}
.floating-whatsapp svg { width: 20px; height: 20px; fill: currentColor; }
.floating-whatsapp:hover { color: #101010; transform: translateY(-3px); box-shadow: 0 16px 40px rgba(0,0,0,.5); }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .65s ease, transform .65s ease; }
.reveal.visible { opacity: 1; transform: none; }

a:focus-visible, button:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }

@media (max-width: 991.98px) {
  .navbar-collapse { padding: 1rem 0 1.2rem; }
  .hero-orbit-one { right: -380px; }
  .hero-orbit-two { right: -280px; }
  .service-item:nth-child(even) { padding-left: 0; border-left: 0; }
  .contact-details { grid-template-columns: 1fr; gap: 1.25rem; }
  .footer-nav, .footer-contact { justify-content: flex-start; }
}

@media (max-width: 767.98px) {
  .section-space { padding: 5.5rem 0; }
  .hero-section { min-height: 760px; }
  .hero-title { font-size: clamp(3.6rem, 17vw, 6rem); }
  .hero-grid { background-size: 55px 55px; }
  .hero-orbit-one { width: 460px; height: 460px; right: -300px; top: 28%; }
  .hero-orbit-two { width: 320px; height: 320px; right: -210px; top: 35%; }
  .hero-meta { margin-top: 3rem; gap: .7rem 1.2rem; }
  .service-item { min-height: auto; padding: 2rem 0; grid-template-columns: 45px 1fr; }
  .service-primary { min-height: auto; }
  .capability { min-height: 130px; padding: 1.1rem; }
  .project-visual { min-height: 300px; }
  .approach-item { min-height: 180px; }
  .contact-panel { padding: 2rem 1.3rem; }
  .contact-panel h2 { font-size: clamp(3rem, 14vw, 5rem); }
  .contact-details { margin-top: 3rem; }
  .footer-bottom { flex-direction: column; margin-top: 3rem; }
  .floating-whatsapp { right: 1rem; bottom: 2rem; }
  .floating-whatsapp span { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* DROMEDA — FUTURISTIC RED ACCENTS */
:root{
  --dv-red:#ff1717;
  --dv-red-glow:rgba(255,23,23,.45);
}
::selection{background:var(--dv-red);color:#fff}

.navbar{border-bottom-color:rgba(255,255,255,.06);position:relative}
.navbar::after{
  content:"";position:absolute;left:0;bottom:-1px;width:18%;height:1px;
  background:linear-gradient(90deg,transparent,var(--dv-red),transparent);
  box-shadow:0 0 10px var(--dv-red);animation:dv-scan 5s ease-in-out infinite
}
@keyframes dv-scan{50%{left:80%;opacity:.9}}

.nav-link{position:relative;transition:.25s}
.nav-link::after{
  content:"";position:absolute;left:50%;bottom:2px;width:0;height:1px;
  background:var(--dv-red);box-shadow:0 0 8px var(--dv-red);
  transform:translateX(-50%);transition:width .25s
}
.nav-link:hover,.nav-link:focus,.nav-link.active{color:#fff!important;text-shadow:0 0 9px var(--dv-red-glow)}
.nav-link:hover::after,.nav-link:focus::after,.nav-link.active::after{width:65%}

.navbar-brand::before{
  content:"";display:inline-block;width:5px;height:5px;margin-right:8px;border-radius:50%;
  background:var(--dv-red);box-shadow:0 0 7px var(--dv-red),0 0 18px var(--dv-red-glow);
  animation:dv-pulse 2s ease-in-out infinite
}
@keyframes dv-pulse{50%{opacity:.5;transform:scale(.8)}}

.eyebrow{color:var(--dv-red)!important;text-shadow:0 0 8px var(--dv-red-glow)}
.eyebrow span{background:var(--dv-red);box-shadow:0 0 7px var(--dv-red)}

.hero-title em{
  color:var(--dv-red)!important;
  text-shadow:0 0 8px var(--dv-red-glow),0 0 25px rgba(255,23,23,.22)
}
.hero-title em::after{
  content:"";display:block;width:60px;height:2px;margin-top:14px;
  background:var(--dv-red);box-shadow:0 0 8px var(--dv-red)
}

.btn{position:relative;overflow:hidden;transition:.25s}
.btn::before{
  content:"";position:absolute;inset:0 auto 0 -110%;width:65%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);
  transform:skewX(-20deg);transition:left .55s
}
.btn:hover::before{left:140%}
.btn-light:hover,.btn-primary:hover,.btn-danger:hover{
  background:var(--dv-red)!important;border-color:var(--dv-red)!important;color:#fff!important;
  box-shadow:0 0 9px var(--dv-red-glow),0 0 25px rgba(255,23,23,.25)
}
.btn:hover i,.btn:hover .arrow{transform:translateX(4px);text-shadow:0 0 8px var(--dv-red)}
.btn i,.btn .arrow{transition:.25s}

.service-item,.project-card,.process-step{transition:.3s}
.service-item{position:relative}
.service-item::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:1px;
  background:var(--dv-red);box-shadow:0 0 8px var(--dv-red);transition:.3s
}
.service-item:hover::after{width:100%}
.service-item:hover .service-number,
.process-step:hover .process-index{color:var(--dv-red);text-shadow:0 0 8px var(--dv-red-glow)}
.service-primary{border-left:2px solid var(--dv-red);box-shadow:inset 8px 0 20px rgba(255,23,23,.025)}

.capability:hover strong{color:var(--dv-red);text-shadow:0 0 8px var(--dv-red-glow)}
.text-link:hover,.contact-link:hover,.footer-nav a:hover,.footer-contact a:hover{
  color:var(--dv-red)!important;text-shadow:0 0 8px var(--dv-red-glow)
}

.project-card{position:relative;overflow:hidden}
.project-card::before{
  content:"";position:absolute;top:0;left:-100%;width:100%;height:1px;z-index:2;
  background:linear-gradient(90deg,transparent,var(--dv-red),transparent);
  box-shadow:0 0 8px var(--dv-red);transition:left .65s
}
.project-card:hover::before{left:100%}
.project-card:hover{
  transform:translateY(-4px);border-color:rgba(255,23,23,.45);
  box-shadow:0 0 18px rgba(255,23,23,.1)
}
.project-label{color:var(--dv-red)!important;text-shadow:0 0 8px var(--dv-red-glow)}
.project-card:hover .project-image{transform:scale(1.03);filter:brightness(.85)}
.project-image{transition:.5s}

.contact-panel{box-shadow:inset 0 0 50px rgba(255,23,23,.025)}
.contact-panel h2 span{color:var(--dv-red);text-shadow:0 0 9px var(--dv-red-glow)}

.social-link,.social-icon,footer .bi,footer .fab,footer .fas{transition:.25s}
.social-link:hover,.social-icon:hover,footer .bi:hover,footer .fab:hover,footer .fas:hover{
  color:var(--dv-red)!important;transform:translateY(-3px);text-shadow:0 0 9px var(--dv-red-glow)
}

.floating-whatsapp:hover{
  box-shadow:0 0 10px var(--dv-red-glow),0 0 28px rgba(255,23,23,.22)
}

input:focus,textarea:focus,select:focus{
  border-color:var(--dv-red)!important;box-shadow:0 0 12px rgba(255,23,23,.16)!important
}
:focus-visible{outline:1px solid var(--dv-red)!important;outline-offset:4px}

footer{position:relative}
footer::before{
  content:"";position:absolute;top:0;left:10%;width:80%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,23,23,.55),transparent);
  box-shadow:0 0 8px rgba(255,23,23,.3)
}

@media(max-width:768px){
  /* .navbar::after{animation:none} */
  .project-card:hover,.service-item:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* IMAGE-LED VISUAL LAYER */
.hero-visual{position:relative;max-width:560px;margin-left:auto;border:1px solid rgba(255,255,255,.12);background:#090909;box-shadow:0 25px 80px rgba(0,0,0,.45),0 0 35px rgba(255,23,23,.06);transform:translateY(10px)}
.hero-visual::after{content:"";position:absolute;inset:10px;border:1px solid rgba(255,23,23,.12);pointer-events:none}
.hero-visual img{display:block;width:100%;height:auto;transition:transform .6s ease,filter .6s ease}.hero-visual:hover img{transform:scale(1.025);filter:brightness(1.08)}
.service-visual{display:block;width:100%;max-width:390px;height:auto;margin:1.5rem 0 0;border:1px solid rgba(255,255,255,.08);opacity:.82;transition:opacity .3s ease,transform .4s ease}.service-item:hover .service-visual{opacity:1;transform:translateY(-3px)}
.about-visual{margin-bottom:2.5rem;border:1px solid rgba(255,255,255,.09);overflow:hidden;background:#090909}.about-visual img{display:block;width:100%;height:auto;transition:transform .6s ease}.about-visual:hover img{transform:scale(1.02)}
@media(max-width:991.98px){.hero-visual{margin:1rem 0 0;max-width:680px}.service-visual{max-width:100%}}
@media(max-width:767.98px){.hero-visual{margin-top:1.5rem}.hero-visual::after{inset:7px}.service-visual{margin-top:1.2rem}.about-visual{margin-bottom:2rem}}
@media(prefers-reduced-motion:reduce){.hero-visual img,.service-visual,.about-visual img{transition:none}.hero-visual:hover img,.service-item:hover .service-visual,.about-visual:hover img{transform:none}}

/* STUDIO IMAGERY — v2 */
.hero-visual{border:0;background:transparent;box-shadow:none;max-width:620px;animation:dv-float 7s ease-in-out infinite}
.hero-visual::after{display:none}
@keyframes dv-float{50%{transform:translateY(-8px)}}
.service-list{border-top:0;gap:0}
.service-item{display:flex;flex-direction:column;min-height:0;padding:0 1.75rem 2.5rem 0;border:0;border-bottom:0}
.col-lg-4:not(:first-child) .service-item{padding-left:1.75rem;border-left:1px solid var(--line)}
.service-primary{border-left:0;box-shadow:none}
.service-visual{max-width:100%;margin:0 0 1.5rem;opacity:.92;border-radius:6px}
.service-item h3{margin:.4rem 0 .6rem}.service-number{margin-top:.25rem}
.browser-frame{border:1px solid var(--line-strong);border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 25px 70px rgba(0,0,0,.5)}
.browser-bar{display:flex;align-items:center;gap:6px;padding:.6rem .9rem;background:#161616;border-bottom:1px solid var(--line)}
.browser-bar i{width:9px;height:9px;border-radius:50%;background:#444}.browser-bar i:first-child{background:var(--dv-red)}
.browser-bar span{margin-left:.8rem;padding:.15rem .9rem;background:#0c0c0c;border-radius:99px;color:#777;font-size:.68rem;letter-spacing:.04em}
.project-image{height:auto}
.tag-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.tag-row span{padding:.25rem .7rem;border:1px solid var(--line-strong);border-radius:99px;color:#aaa;font-size:.7rem}
.next-project{height:100%;display:flex;flex-direction:column;padding:1.5rem;background:#0d0d0d;border:1px dashed var(--line-strong);position:relative}
.next-project .project-label{position:static}.next-visual{margin:1.2rem 0;opacity:.75;border-radius:6px;overflow:hidden}.next-visual img{width:100%;display:block}
.next-project h3{font-size:1.5rem;letter-spacing:-.04em}.next-project p{color:var(--muted);line-height:1.6}.next-project .text-link{align-self:flex-start;margin-top:auto}
.studio-board{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:92px;gap:10px;padding:10px;border:0;background:transparent}
.studio-board>*{border:1px solid var(--line);border-radius:6px;background:#0f0f0f;overflow:hidden}
.sb-logo{grid-column:1/4;grid-row:1/4;display:grid;place-items:center;background:radial-gradient(circle at 50% 50%,rgba(255,23,23,.22),#0b0b0b 70%)!important}.sb-logo img{width:78%}
.sb-type{grid-column:4/7;grid-row:1/3;padding:1rem;display:flex;flex-direction:column;justify-content:space-between}.sb-type strong{font:700 3.6rem/1 "Space Grotesk",sans-serif}.sb-type small,.sb-note small{color:#777;font-size:.6rem;letter-spacing:.14em}
.sb-swatches{grid-column:4/7;grid-row:3;display:flex;padding:0!important}.sb-swatches i{flex:1}
.sb-code{grid-column:1/4;grid-row:4;padding:.9rem;display:flex;flex-direction:column;justify-content:center;gap:.2rem}.sb-code code{color:#bbb;font-size:.7rem}.sb-code code:first-child,.sb-code code:last-child{color:var(--dv-red)}
.sb-note{grid-column:4/7;grid-row:4;padding:1rem;background:var(--dv-red)!important;display:flex;flex-direction:column;justify-content:space-between;color:#fff}.sb-note small{color:#fff;opacity:.8}.sb-note span{font:600 1rem/1.2 "Space Grotesk",sans-serif}
@media(max-width:991.98px){.col-lg-4:not(:first-child) .service-item{padding-left:0;border-left:0}.service-item{padding:0 0 2.5rem}.hero-visual{margin:1rem auto 0}}
@media(max-width:575.98px){.studio-board{grid-auto-rows:72px}.sb-type strong{font-size:2.6rem}}
@media(prefers-reduced-motion:reduce){.hero-visual{animation:none}}