/*
 * Approved public palette (A), plus local-only B/C evaluation variants.
 * Development environments can switch variants with
 * ?prototype=palette&variant=A|B|C.
 */

.palette-prototype,
.palette-approved {
  --brand-blue: #0052c4;
  --brand-cyan: #00d5df;
  --brand-navy: #041a3a;
  --brand-sky: #dffbff;
  --brand-cloud: #f4f8ff;
  --brand-white: #ffffff;
}

.palette-prototype {
  padding-block-end: 104px;
}

.palette-prototype .brand-logo,
.palette-approved .brand-logo {
  display: block;
  width: 184px;
  height: auto;
}
.palette-prototype .brand-logo-white,
.palette-approved .brand-logo-white { display: none; }

.palette-prototype .prototype-switcher {
  position: fixed;
  z-index: 1000;
  inset-inline-start: 50%;
  inset-block-end: 18px;
  width: min(700px, calc(100vw - 24px));
  min-height: 76px;
  display: grid;
  grid-template-columns: 52px 1fr 52px 34px;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  color: white;
  background: rgba(3, 12, 28, .96);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 20px;
  box-shadow: 0 18px 60px rgba(0, 16, 46, .34);
  backdrop-filter: blur(18px);
  transform: translateX(-50%);
}

.prototype-switcher button,
.prototype-close {
  width: 44px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  padding: 0;
  color: white;
  background: rgba(255, 255, 255, .09);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 13px;
  cursor: pointer;
  font-size: 20px;
}

.prototype-switcher button:hover,
.prototype-close:hover { background: var(--brand-blue); }
.prototype-state { min-width: 0; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 2px 14px; }
.prototype-state small { color: var(--brand-cyan); font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.prototype-state strong { font-size: 14px; }
.prototype-colors { grid-column: 1 / -1; display: flex; gap: 8px; overflow: hidden; }
.prototype-colors i { display: inline-flex; align-items: center; gap: 5px; color: rgba(255,255,255,.62); font-size: 9px; font-style: normal; white-space: nowrap; }
.prototype-colors b { width: 12px; height: 12px; display: block; border: 1px solid rgba(255,255,255,.32); border-radius: 50%; }
.palette-prototype .consent-banner { display: none; }
[dir="rtl"] .prototype-switcher { transform: translateX(50%); }

/* A — Clear Signal: bright, reassuring, conversion-led. */
.palette-A {
  --action-on-dark: #00d5df;
  --action-on-dark-hover: #38e1e8;
  --action-on-cyan: #0052c4;
  --action-on-cyan-hover: #003f9e;
  --ink: #071a35;
  --cream: #eaf6ff;
  --paper: #ffffff;
  --red: #0052c4;
  --orange: #00d5df;
  --lime: #a9f8ff;
  --muted: #52647c;
  --line: rgba(0, 82, 196, .16);
  --radius: 22px;
  background: var(--brand-white);
}

.palette-A .site-header { color: white; background: rgba(4,26,58,.96); border-color: rgba(0,213,223,.22); }
.palette-A .site-header .brand-logo-color { display: none; }
.palette-A .site-header .brand-logo-white { display: block; }
.palette-A .primary-nav a { color: rgba(255,255,255,.72); }
.palette-A .primary-nav a:hover,
.palette-A .primary-nav a:focus-visible { color: var(--brand-cyan); }
.palette-A .language-menu summary { border-color: rgba(255,255,255,.28); }
.palette-A .button-small { color: var(--brand-navy); background: var(--action-on-dark); border-color: var(--action-on-dark); }
.palette-A .hero.section-dark { background: linear-gradient(124deg, #003f9e 0%, #0052c4 58%, #007bd4 100%); }
.palette-A .hero-grid { min-height: 650px; }
.palette-A .hero h1 { text-wrap: balance; }
.palette-A .hero-lede { color: rgba(255,255,255,.8); }
.palette-A .button-bright { color: var(--brand-navy); background: var(--action-on-dark); border-color: var(--action-on-dark); }
.palette-A .button-small:hover,
.palette-A .button-bright:hover,
.palette-A .section-start .button-dark:hover { background: var(--action-on-dark-hover); border-color: var(--action-on-dark-hover); }
.palette-A .eyebrow { color: #8ef8ff; }
.palette-A .eyebrow.ink { color: var(--brand-blue); }
.palette-A .orbit-two { border-color: rgba(0,213,223,.78); }
.palette-A .art-card { background: var(--brand-cyan); box-shadow: 28px 35px 0 #003887; }
.palette-A .art-chip { background: white; }
.palette-A .chip-two { color: white; background: #3388ff; }
.palette-A .section-red,
.palette-A .section-start { background: var(--brand-blue); }
.palette-A .process-grid article { background: var(--brand-blue); }
.palette-A .section-dark { background: var(--brand-navy); }
.palette-A .price-card.featured { background: var(--brand-cyan); border-color: var(--brand-cyan); }
.palette-A .price-card.featured .button-bright { color: white; background: var(--action-on-cyan); border-color: var(--action-on-cyan); }
.palette-A .price-card.featured .button-bright:hover { background: var(--action-on-cyan-hover); border-color: var(--action-on-cyan-hover); }
.palette-A .work-card { box-shadow: 0 14px 35px rgba(0,82,196,.07); }
.palette-A .project-form { box-shadow: 18px 18px 0 rgba(0,28,72,.22); }
.palette-A .section-start .button-dark { color: var(--brand-navy); background: var(--action-on-dark); border-color: var(--action-on-dark); }
.palette-A .choice-grid input:checked + span { background: #eafcff; }
.palette-A .site-footer { background: var(--brand-navy); border-block-start: 3px solid var(--brand-cyan); }
.palette-A .site-footer .brand { padding: 0; background: transparent; border-radius: 0; }
.palette-A .site-footer .brand-logo-color { display: none; }
.palette-A .site-footer .brand-logo-white { display: block; }
.palette-A .site-footer .footer-grid p { color: rgba(255,255,255,.62); }
.palette-A .site-footer .footer-grid nav a { color: rgba(255,255,255,.76); }
.palette-A .site-footer .footer-grid nav a:hover,
.palette-A .site-footer .footer-grid nav a:focus-visible { color: var(--brand-cyan); }

/* B — Midnight Studio: cinematic, premium, AI-forward. */
.palette-B {
  --ink: #031023;
  --cream: #06182d;
  --paper: #081c34;
  --red: #0052c4;
  --orange: #00d5df;
  --lime: #56f4ff;
  --muted: #9bb0c9;
  --line: rgba(111, 214, 255, .16);
  --radius: 28px;
  color: #eef8ff;
  background: #020b18;
}

.palette-B .site-header { background: rgba(2,11,24,.78); border-color: rgba(0,213,223,.16); }
.palette-B .site-header .brand { padding: 8px 12px; background: white; border-radius: 10px; }
.palette-B .button-small { color: #00192f; background: var(--brand-cyan); box-shadow: 0 0 24px rgba(0,213,223,.28); }
.palette-B .hero.section-dark { position: relative; min-height: 760px; padding-block-start: 30px; background: radial-gradient(circle at 50% 42%, rgba(0,82,196,.48), transparent 38%), linear-gradient(180deg, #020b18, #04152b); }
.palette-B .hero::before { content: ""; position: absolute; inset: 12% 10% auto; height: 310px; background: rgba(0,213,223,.16); filter: blur(90px); border-radius: 50%; }
.palette-B .hero-grid { position: relative; min-height: 660px; grid-template-columns: 1fr; text-align: center; }
.palette-B .hero-copy { position: relative; z-index: 5; max-width: 980px; margin-inline: auto; display: grid; justify-items: center; }
.palette-B .hero h1 { max-width: 980px; margin-inline: auto; font-size: clamp(52px, 8vw, 108px); text-shadow: 0 10px 50px rgba(0,0,0,.35); }
.palette-B .hero-lede { max-width: 760px; color: #b8cbe0; }
.palette-B .hero-actions { justify-content: center; }
.palette-B .hero-art { position: absolute; z-index: 1; inset: 0; min-height: 100%; opacity: .18; filter: blur(1px); pointer-events: none; }
.palette-B .art-card { width: 270px; color: #00152d; background: linear-gradient(145deg, var(--brand-cyan), #a4fbff); box-shadow: 28px 35px 0 rgba(0,82,196,.7); }
.palette-B .orbit-one { width: 610px; border-color: rgba(0,213,223,.34); }
.palette-B .orbit-two { width: 470px; border-color: rgba(0,82,196,.72); }
.palette-B .fact-strip { position: relative; z-index: 6; }
.palette-B .section,
.palette-B .section-cream,
.palette-B .section-white,
.palette-B .section-dark { color: #eef8ff; background: #020b18; }
.palette-B .section:nth-of-type(even) { background: #041326; }
.palette-B .eyebrow,
.palette-B .eyebrow.ink { color: var(--brand-cyan); }
.palette-B .split-heading > p,
.palette-B .work-card p,
.palette-B .type-grid p,
.palette-B .faq-list details p { color: #9bb0c9; }
.palette-B .work-card,
.palette-B .price-card { background: linear-gradient(145deg, rgba(10,37,69,.92), rgba(4,21,42,.78)); border-color: rgba(0,213,223,.16); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 22px 60px rgba(0,0,0,.2); }
.palette-B .work-card > div > span,
.palette-B .type-grid article > span { color: var(--brand-cyan); }
.palette-B .type-grid { gap: 16px; border: 0; }
.palette-B .type-grid article { border: 1px solid rgba(0,213,223,.14); border-radius: 24px; background: rgba(5,28,52,.72); }
.palette-B .section-red { background: linear-gradient(135deg, #00337e, #0052c4 58%, #007884); }
.palette-B .process-grid { gap: 14px; background: transparent; border: 0; }
.palette-B .process-grid article { background: rgba(2,18,42,.48); border: 1px solid rgba(255,255,255,.14); border-radius: 24px; backdrop-filter: blur(10px); }
.palette-B .pricing-grid { max-width: 1040px; margin-inline: auto; }
.palette-B .price-card.featured { color: #00152d; background: linear-gradient(145deg, #00d5df, #8cf8ff); border-color: transparent; box-shadow: 0 25px 80px rgba(0,213,223,.18); }
.palette-B .story-promise { background: rgba(0,213,223,.08); border-color: var(--brand-cyan); }
.palette-B .faq-list details { border-color: rgba(0,213,223,.14); }
.palette-B .section-start { background: radial-gradient(circle at 15% 20%, rgba(0,213,223,.18), transparent 34%), #03142c; }
.palette-B .start-grid { grid-template-columns: 1fr; max-width: 920px; }
.palette-B .start-grid > div { max-width: 720px; text-align: center; margin-inline: auto; }
.palette-B .project-form { color: #061a35; background: #f8fcff; box-shadow: 0 28px 90px rgba(0,0,0,.34); }
.palette-B .site-footer { background: #010711; border-block-start: 1px solid rgba(0,213,223,.14); }
.palette-B .site-footer .brand { padding: 9px 12px; background: white; border-radius: 10px; }

/* C — Kinetic Grid: bold, editorial, memorable. */
.palette-C {
  --ink: #002a65;
  --cream: #e7f5ff;
  --paper: #f9fcff;
  --red: #0052c4;
  --orange: #00d5df;
  --lime: #00d5df;
  --muted: #405b7d;
  --line: rgba(0,42,101,.24);
  --radius: 0px;
  background-color: #f9fcff;
  background-image: linear-gradient(rgba(0,82,196,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(0,82,196,.045) 1px, transparent 1px);
  background-size: 28px 28px;
}

.palette-C .site-header { color: var(--brand-blue); background: rgba(249,252,255,.96); border-block-end: 4px solid var(--brand-blue); }
.palette-C .primary-nav a { color: #334f74; font-weight: 700; }
.palette-C .button,
.palette-C .language-menu summary,
.palette-C .language-options,
.palette-C .project-form input,
.palette-C .project-form select,
.palette-C .project-form textarea,
.palette-C .choice-grid span { border-radius: 0 !important; }
.palette-C .button-small { color: white; background: var(--brand-blue); }
.palette-C .hero.section-dark { color: var(--brand-navy); background: linear-gradient(90deg, #f9fcff 0 56%, var(--brand-cyan) 56% 100%); border-block-end: 4px solid var(--brand-blue); }
.palette-C .hero-grid { min-height: 680px; grid-template-columns: .95fr 1.05fr; gap: 36px; }
.palette-C .hero h1 { max-width: 670px; color: var(--brand-blue); font-size: clamp(54px, 7.4vw, 104px); text-transform: uppercase; }
.palette-C .hero-lede { color: #37516f; }
.palette-C .eyebrow { color: var(--brand-blue); }
.palette-C .button-bright { color: white; background: var(--brand-blue); }
.palette-C .text-link { color: var(--brand-blue); }
.palette-C .capacity-note { color: #37516f; }
.palette-C .hero-art { min-height: 570px; }
.palette-C .art-orbit { border-color: rgba(0,42,101,.28); border-radius: 0; transform: rotate(12deg); }
.palette-C .art-card { color: white; background: var(--brand-blue); border: 4px solid var(--brand-navy); border-radius: 0; box-shadow: 32px 32px 0 white; transform: rotate(-3deg); }
.palette-C .art-chip { color: white; background: var(--brand-blue); border: 3px solid white; border-radius: 0; }
.palette-C .chip-two { color: var(--brand-blue); background: white; }
.palette-C .fact-strip { color: white; background: var(--brand-blue); border: 0; }
.palette-C .fact-strip span { color: white; border-color: rgba(255,255,255,.3); }
.palette-C .section { border-block-end: 4px solid var(--brand-blue); }
.palette-C .section-cream { background: rgba(231,245,255,.94); }
.palette-C .section-white { background: rgba(249,252,255,.96); }
.palette-C .eyebrow.ink { color: var(--brand-blue); }
.palette-C .work-grid { grid-template-columns: repeat(12, 1fr); gap: 18px; }
.palette-C .work-card { grid-column: span 4; border: 2px solid var(--brand-blue); }
.palette-C .work-card:nth-child(1),
.palette-C .work-card:nth-child(4) { grid-column: span 7; }
.palette-C .work-card:nth-child(2),
.palette-C .work-card:nth-child(5) { grid-column: span 5; }
.palette-C .play-button { color: white; background: var(--brand-blue); border-radius: 0; }
.palette-C .type-grid { grid-template-columns: repeat(2, 1fr); border-width: 2px; border-color: var(--brand-blue); }
.palette-C .type-grid article { min-height: 280px; border-width: 2px; border-color: var(--brand-blue); }
.palette-C .type-grid article > span { color: var(--brand-blue); font-size: 20px; }
.palette-C .section-red { color: white; background: var(--brand-blue); }
.palette-C .process-grid { grid-template-columns: repeat(2, 1fr); gap: 4px; background: var(--brand-cyan); border: 4px solid var(--brand-cyan); }
.palette-C .process-grid article { min-height: 260px; background: var(--brand-blue); }
.palette-C .process-grid h3 { margin-block-start: 55px; }
.palette-C .section-dark { background: #002a65; }
.palette-C .pricing-grid { grid-template-columns: .85fr 1.3fr .85fr; gap: 4px; background: var(--brand-cyan); }
.palette-C .price-card { border: 0; background: #003b8e; }
.palette-C .price-card.featured { color: #002a65; background: var(--brand-cyan); transform: none; }
.palette-C .story-promise { background: white; border-width: 8px; border-color: var(--brand-cyan); }
.palette-C .section-start { background: linear-gradient(110deg, var(--brand-blue) 0 44%, var(--brand-cyan) 44% 100%); }
.palette-C .project-form { border: 4px solid var(--brand-navy); box-shadow: 22px 22px 0 var(--brand-navy); }
.palette-C .choice-grid input:checked + span { background: var(--brand-sky); }
.palette-C .site-footer { background: var(--brand-navy); border-block-start: 8px solid var(--brand-cyan); }
.palette-C .site-footer .brand { padding: 9px 12px; background: white; }

@media (max-width: 900px) {
  .palette-B .hero { min-height: 680px; }
  .palette-B .hero-art { display: grid; }
  .palette-C .hero.section-dark { background: linear-gradient(180deg, #f9fcff 0 58%, var(--brand-cyan) 58% 100%); }
  .palette-C .hero-grid { grid-template-columns: 1fr; }
  .palette-C .work-card,
  .palette-C .work-card:nth-child(n) { grid-column: span 6; }
  .palette-C .pricing-grid { grid-template-columns: 1fr; gap: 4px; }
}

@media (max-width: 620px) {
  .palette-prototype { padding-block-end: 126px; }
  .palette-prototype .brand-logo,
  .palette-approved .brand-logo { width: 142px; }
  .palette-prototype .prototype-switcher { grid-template-columns: 44px 1fr 44px; min-height: 92px; padding: 8px; }
  .prototype-close { position: absolute; inset-inline-end: 7px; inset-block-start: -38px; width: 32px; background: rgba(3,12,28,.96); }
  .prototype-state { grid-template-columns: 1fr; gap: 0; }
  .prototype-state strong { font-size: 12px; }
  .prototype-colors i { font-size: 0; }
  .prototype-colors b { width: 15px; height: 15px; }
  .palette-B .hero-art { opacity: .2; }
  .palette-B .orbit-one { width: 340px; }
  .palette-B .orbit-two { width: 270px; }
  .palette-C .work-grid { grid-template-columns: 1fr; }
  .palette-C .work-card,
  .palette-C .work-card:nth-child(n) { grid-column: auto; }
  .palette-C .type-grid,
  .palette-C .process-grid { grid-template-columns: 1fr; }
  .palette-C .section-start { background: var(--brand-blue); }
}