/* StudioBoost brand theme — token overrides on the Organic design system, plus responsive rules. */
:root {
  --color-bg: #f7f5fd;
  --color-surface: #ece8f9;
  --color-text: #1d1145;
  --color-divider: color-mix(in srgb, #1d1145 16%, transparent);

  --color-neutral-100: #f8f7fd; --color-neutral-200: #eeecf8; --color-neutral-300: #ddd9ee;
  --color-neutral-400: #bdb7d6; --color-neutral-500: #9a93b8; --color-neutral-600: #7a7398;
  --color-neutral-700: #5c5678; --color-neutral-800: #3d3956; --color-neutral-900: #1a1233;

  --color-accent: #f5a81c;
  --color-accent-100: #fff6e0; --color-accent-200: #ffe9b8; --color-accent-300: #ffd67d;
  --color-accent-400: #fbc04a; --color-accent-500: #f5a81c; --color-accent-600: #d98c0a;
  --color-accent-700: #a96b05; --color-accent-800: #7a4d04; --color-accent-900: #4d3103;

  --color-accent-2: #6b3fd4;
  --color-accent-2-100: #f1ecfe; --color-accent-2-200: #ded2fb; --color-accent-2-300: #c3aef7;
  --color-accent-2-400: #9d7cef; --color-accent-2-500: #7c52e3; --color-accent-2-600: #6337c7;
  --color-accent-2-700: #4c279e; --color-accent-2-800: #351a72; --color-accent-2-900: #22114a;
}
body { font-size: 17px; }
a { color: var(--color-accent-2-700); }
a:hover { color: var(--color-accent-2-600); }
.btn-primary { color: #22114a; font-weight: 400; }
.btn-primary:hover { background: var(--color-accent-600); color: #22114a; }
.btn-primary:active { background: var(--color-accent-700); color: #fff6e0; }
@keyframes sbFloat { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-12px) } }

header nav a { white-space: nowrap; transition: color .15s ease; padding-bottom: 2px; border-bottom: 2px solid transparent; }
header nav a:hover { color: var(--color-accent) !important; border-bottom-color: var(--color-accent); }
header [data-sb-burger]:hover { background: rgba(255,255,255,0.10) !important; }
@media (max-width: 1080px) {
  body { font-size: 16px; }
  header > div { padding: 12px 18px !important; gap: 14px !important; }
  header nav { display: none !important; }
  section { padding-left: 18px !important; padding-right: 18px !important; }
  section > div { padding-left: 0 !important; padding-right: 0 !important; }
  footer > div { padding-left: 18px !important; padding-right: 18px !important; }
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  h1 { font-size: clamp(30px, 8.5vw, 42px) !important; }
  h2 { font-size: clamp(25px, 7vw, 34px) !important; }
  h3 { font-size: 21px !important; }
  [style*="max-width:38ch"], [style*="max-width: 38ch"], [style*="max-width:40ch"], [style*="max-width: 40ch"], [style*="max-width:44ch"], [style*="max-width: 44ch"],
  [style*="max-width:46ch"], [style*="max-width: 46ch"], [style*="max-width:48ch"], [style*="max-width: 48ch"], [style*="max-width:50ch"], [style*="max-width: 50ch"],
  [style*="max-width:52ch"], [style*="max-width: 52ch"], [style*="max-width:56ch"], [style*="max-width: 56ch"], [style*="max-width:60ch"], [style*="max-width: 60ch"] { max-width: 100% !important; }
  [style*="font-size:60px"], [style*="font-size: 60px"], [style*="font-size:54px"], [style*="font-size: 54px"] { font-size: clamp(30px, 8.5vw, 42px) !important; }
  [style*="font-size:46px"], [style*="font-size: 46px"], [style*="font-size:44px"], [style*="font-size: 44px"], [style*="font-size:42px"], [style*="font-size: 42px"] { font-size: clamp(25px, 7vw, 34px) !important; }
  [style*="font-size:29px"], [style*="font-size: 29px"] { font-size: 23px !important; }
  [style*="border-radius:52px"], [style*="border-radius: 52px"], [style*="border-radius:44px"], [style*="border-radius: 44px"] {
    border-radius: 30px !important; padding: 36px 24px !important;
  }
  [style*="border-radius:44px"], [style*="border-radius: 44px"] { overflow-x: auto !important; }
  .card { padding: 26px 22px !important; }
  .table th, .table td { padding: 11px 10px !important; font-size: 14px !important; }
  input.input { width: 100% !important; }

  [style*="left:-30px"], [style*="left: -30px"] { left: 8px !important; bottom: -18px !important; }
  [style*="aspect-ratio:4/5"], [style*="aspect-ratio: 4/5"] { aspect-ratio: 4/4 !important; }
  [style*="width:420px"], [style*="width: 420px"], [style*="width:380px"], [style*="width: 380px"], [style*="width:360px"], [style*="width: 360px"], [style*="width:340px"], [style*="width: 340px"] {
    width: 220px !important; height: 220px !important;
  }

  /* touch comfort — buttons, pills and fields need real padding on a phone */
  .btn { min-height: 50px !important; padding: 14px 22px !important; line-height: 1.3 !important; flex: none !important; white-space: nowrap !important; }
  .tag { padding: 9px 18px !important; line-height: 1.35 !important; }
  input.input { min-height: 54px !important; padding: 15px 20px !important; font-size: 16px !important; }
  textarea.input { padding: 15px 20px !important; font-size: 16px !important; line-height: 1.5 !important; }
  label.field { gap: 10px !important; }

  /* breathing room inside rounded panels */
  [style*="border-radius:52px"], [style*="border-radius: 52px"], [style*="border-radius:44px"], [style*="border-radius: 44px"] { padding: 34px 22px !important; }
  [style*="border-radius:40px"], [style*="border-radius: 40px"], [style*="border-radius:36px"], [style*="border-radius: 36px"] { padding: 28px 22px !important; border-radius: 28px !important; }
  [style*="border-radius:32px"], [style*="border-radius: 32px"] { padding: 22px 20px !important; }
  [style*="border-radius:999px"], [style*="border-radius: 999px"][style*="padding:16px 26px"], [style*="padding: 16px 26px"],
  [style*="border-radius:999px"], [style*="border-radius: 999px"][style*="padding:15px 24px"], [style*="padding: 15px 24px"],
  [style*="border-radius:999px"], [style*="border-radius: 999px"][style*="padding:14px 24px"], [style*="padding: 14px 24px"] { padding: 15px 20px !important; }

  /* vertical rhythm: sections were tuned for desktop */
  section { padding-top: 52px !important; padding-bottom: 52px !important; }
  [style*="gap:56px"], [style*="gap: 56px"], [style*="gap:64px"], [style*="gap: 64px"], [style*="gap:48px"], [style*="gap: 48px"] { gap: 32px !important; }
  [style*="gap:22px"], [style*="gap: 22px"], [style*="gap:24px"], [style*="gap: 24px"] { gap: 16px !important; }

  /* stacked side nav shouldn't stick over content */
  nav[style*="position:sticky"], [style*="position: sticky"] { position: static !important; top: auto !important; }

  /* service tab rail: full-width taps, no cramped wrap */
  nav[style*="top: 76px"] > div, nav[style*="top:76px"] > div {
    padding: 12px 18px !important; gap: 8px !important;
    flex-wrap: nowrap !important; overflow-x: auto !important;
    scrollbar-width: none;
  }
  nav[style*="top: 76px"] > div::-webkit-scrollbar { display: none; }
}

[data-sb-burger] { display: none; }
@media (max-width: 1080px) { [data-sb-burger] { display: inline-flex !important; } }
@media (max-width: 1080px) { header > div > a.btn-primary { display: none !important; } }