/* The home page has its own visual language; store, checkout and admin keep theirs. */
.home-page {
  --home-bg: #090b13;
  --home-panel: #141824;
  --home-text: #f8f8fd;
  --home-muted: #a7aaba;
  --home-violet: #9274f5;
  background: var(--home-bg);
  color: var(--home-text);
}

.home-page .container { width: min(100% - 64px, 1392px); }
.home-page .top-bar { display: none; }
.home-page .site-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 120;
  background: transparent;
  border: 0;
  backdrop-filter: none;
}
.home-page .header-inner { min-height: 112px; gap: 20px; }
.home-page .brand { gap: 14px; }
.home-page .brand img { width: 52px; height: 52px; }
.home-page .site-header .brand img { filter: brightness(0) invert(1); transform: none; }
.home-page .brand strong,
.home-page .brand b { color: #fff; letter-spacing: -.045em; }
.home-page .brand strong { font-size: 19px; font-weight: 700; }
.home-page .brand b { margin-top: 5px; font-size: 15px; font-weight: 450; letter-spacing: .18em; }
.home-page .desktop-nav { display: none; }
.home-page .header-phone {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  color: #e0e1ed;
  font-size: 14px;
  font-weight: 450;
  white-space: nowrap;
}
.home-page .header-phone span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid #ffffff61;
  border-radius: 50%;
  font-size: 18px;
  line-height: 1;
}
.home-page .header-phone:hover { color: #fff; }
.home-page .header-cta {
  min-height: 52px;
  padding: 12px 24px;
  border: 1px solid #ae92ff7a;
  border-radius: 999px;
  background: linear-gradient(120deg, #4935a2, #7554ea 60%, #4d43bb);
  box-shadow: 0 12px 32px #382c9b55, inset 0 1px #ffffff38;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
}
.home-page .header-cta:hover { background: linear-gradient(120deg, #5b46bb, #8b6aff 60%, #6257d3); border-color: #c2acff; }
.home-page .header-cta span { font-size: 16px; }
.home-page .mobile-nav { display: block; position: relative; flex: 0 0 auto; }
.home-page .mobile-nav summary {
  position: relative;
  z-index: 102;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 5px;
  width: 52px;
  height: 52px;
  border: 1px solid #ffffff30;
  border-radius: 50%;
  background: #ffffff13;
  cursor: pointer;
  list-style: none;
  transition: background .2s, border-color .2s;
}
.home-page .mobile-nav summary::-webkit-details-marker { display: none; }
.home-page .mobile-nav summary:hover,
.home-page .mobile-nav[open] summary { background: #ffffff25; border-color: #ffffff7d; }
.home-page .mobile-nav summary span { display: block; width: 20px; height: 1.5px; background: #fff; }
.home-page .agency-menu[open] summary span:first-child { transform: translateY(6.5px) rotate(45deg); }
.home-page .agency-menu[open] summary span:nth-child(2) { opacity: 0; }
.home-page .agency-menu[open] summary span:last-child { transform: translateY(-6.5px) rotate(-45deg); }
.home-page .agency-menu:not([open]) .agency-menu-panel { display: none; }
.home-page:has(.agency-menu[open]) { overflow: hidden; }
.home-page .agency-menu-panel {
  position: fixed;
  inset: 0;
  z-index: 90;
  height: 100vh;
  height: 100dvh;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 132px 32px 44px;
  border: 0;
  background: radial-gradient(circle at 75% 7%, #33245c 0, transparent 42%), #0c0e19;
  box-shadow: 0 28px 70px #0009;
}
.home-page .agency-menu-inner { width: min(100%, 1340px); margin-inline: auto; }
.home-page .agency-menu-kicker { margin: 0 0 26px; color: #a598d7; font-size: 11px; font-weight: 650; letter-spacing: .18em; }
.home-page .agency-menu nav {
  position: static;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px 32px;
  width: 100%;
  max-height: none;
  overflow: visible;
  padding: 0 0 38px;
  border: 0;
  border-bottom: 1px solid #ffffff2b;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}
.home-page .agency-menu nav a { padding: 10px 0; color: #f6f3ff; font-size: clamp(32px, 3.4vw, 54px); font-weight: 470; letter-spacing: -.045em; line-height: 1.1; }
.home-page .agency-menu nav a:hover,
.home-page .agency-menu nav a:focus-visible { color: #b9a2ff; background: transparent; }
.home-page .agency-menu-categories { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; padding-block: 40px; }
.home-page .agency-menu-categories section { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.home-page .agency-menu-categories h3 { margin: 0 0 6px; color: #a599d9; font-size: 11px; font-weight: 680; letter-spacing: .16em; text-transform: uppercase; }
.home-page .agency-menu-categories a { color: #d4d1e1; font-size: 15px; line-height: 1.5; }
.home-page .agency-menu-categories a:hover { color: #fff; }
.home-page .agency-menu-contact { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 26px; border-top: 1px solid #ffffff2b; }
.home-page .agency-menu-contact a:first-child { display: inline-flex; align-items: center; gap: 18px; padding: 14px 22px; border: 1px solid #b9a2ff7d; border-radius: 999px; background: #6f53dc; color: #fff; font-size: 14px; font-weight: 650; }
.home-page .agency-menu-contact a:first-child:hover { background: #8063ed; }
.home-page .agency-menu-contact a:last-child { color: #d1cbe6; font-size: 14px; }

.home-page .hero {
  min-height: min(860px, 100svh);
  display: flex;
  align-items: center;
  background-color: #090b13;
  background-position: 64% center;
  background-size: cover;
}
.home-page .hero::before {
  z-index: 0;
  background: linear-gradient(90deg, #090b13f7 0%, #090b13e0 31%, #090b13a0 52%, #090b1320 83%),
    linear-gradient(0deg, #090b13df 0%, transparent 27%);
}
.home-page .hero::after {
  content: '';
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 70% 58%, #6144db24, transparent 40%);
}
.home-page .hero-content { position: relative; z-index: 1; padding-block: 180px 108px; }
.home-page .hero .eyebrow {
  gap: 0;
  color: #d3d1df;
  font-size: clamp(16px, 1.7vw, 25px);
  font-weight: 300;
  letter-spacing: -.045em;
  text-transform: none;
}
.home-page .hero .eyebrow span { display: none; }
.home-page .hero h1 {
  max-width: 760px;
  margin: 33px 0 25px;
  font-size: clamp(64px, 6.85vw, 104px);
  font-weight: 330;
  line-height: .99;
  letter-spacing: -.072em;
  text-wrap: balance;
}
.home-page .hero h1 em { font: inherit; color: #fff; }
.home-page .hero-lead { max-width: 570px; color: #c7c8d5; font-size: 17px; line-height: 1.72; }
.home-page .hero-actions { gap: 12px; margin-top: 32px; }
.home-page .hero-actions .button { min-height: 52px; padding-inline: 21px; border-radius: 999px; font-size: 13px; font-weight: 600; }
.home-page .button-primary { background: #f2f1fc; color: #171228; }
.home-page .button-primary:hover { background: #fff; }
.home-page .button-outline { border-color: #ffffff70; background: #ffffff0a; color: #fff; }
.home-page .button-outline:hover { border-color: #fff; background: #ffffff22; }
.home-page .hero-scroll {
  position: absolute;
  right: 0;
  bottom: 42px;
  display: inline-flex;
  align-items: center;
  gap: 11px;
  color: #d3d4e0;
  font-size: 11px;
  font-weight: 550;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.home-page .hero-scroll span { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #ffffff6b; border-radius: 50%; font-size: 18px; }
.home-page .ticker { background: #10121b; border-block: 1px solid #ffffff18; }
.home-page .ticker-inner { min-height: 75px; color: #aaaab8; font-weight: 550; letter-spacing: .14em; }
.home-page .ticker b { color: #8566dc; }

.home-page .section { scroll-margin-top: 24px; }
.home-page .services-section { padding-block: 126px 110px; background: #090b13; }
.home-page .section-heading.split { display: block; max-width: 800px; margin: 0 auto 58px; text-align: center; }
.home-page .section-heading.split .eyebrow { justify-content: center; }
.home-page .section-heading h2,
.home-page .home-package-teaser h2,
.home-page .theme-teaser h2,
.home-page .about-teaser h2 { color: #fff; font-weight: 400; letter-spacing: -.068em; }
.home-page .section-heading h2 { font-size: clamp(48px, 5vw, 78px); }
.home-page .section-heading h2 em,
.home-page .home-package-teaser h2 em,
.home-page .theme-teaser h2 em,
.home-page .about-teaser h2 em { font: inherit; color: #bcaaff; }
.home-page .section-heading.split > p { max-width: 650px; margin: 0 auto; color: #a6a9b9; font-size: 16px; }
.home-page .eyebrow { color: #ae9af5; font-weight: 660; }
.home-page .eyebrow.light { color: #c0b1ff; }
.home-page .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.home-page .service-card {
  min-height: 370px;
  padding: 34px 38px;
  border: 1px solid #ffffff1f;
  border-radius: 31px;
  background: radial-gradient(circle at 95% 0%, #3e3f6630, transparent 44%), #151721;
  box-shadow: none;
  transition: transform .25s, border-color .25s, background-color .25s;
}
.home-page .service-card:hover { transform: translateY(-5px); border-color: #9f84f076; box-shadow: 0 25px 55px #0005; }
.home-page .card-number { color: #a99acb; font-weight: 550; }
.home-page .service-icon { width: 82px; height: 82px; margin: 25px 0 23px; border: 1px solid #ffffff1b; border-radius: 50%; background: #ffffff0c; transform: scale(.9); transform-origin: left center; }
.home-page .service-card h3 { color: #fff; font-size: clamp(26px, 2.4vw, 34px); font-weight: 510; }
.home-page .service-card p { max-width: 450px; color: #a8aab8; font-size: 14px; line-height: 1.75; }
.home-page .card-link { color: #d6ccff; font-size: 13px; font-weight: 610; }

.home-page .home-package-teaser { padding: 0 0 112px; border: 0; background: #090b13; }
.home-page .home-package-inner {
  position: relative;
  gap: 80px;
  min-height: 500px;
  overflow: hidden;
  padding: clamp(42px, 6vw, 82px);
  border: 1px solid #ffffff26;
  border-radius: 42px;
  background: radial-gradient(circle at 12% 100%, #6645e08a, transparent 42%),
    radial-gradient(circle at 88% 10%, #4973e25c, transparent 47%),
    linear-gradient(120deg, #1a1742, #22275a 58%, #141a3b);
  box-shadow: 0 35px 100px #0005;
}
.home-page .home-package-teaser h2 { font-size: clamp(45px, 4.5vw, 70px); }
.home-page .home-package-inner > div:first-child > p:not(.eyebrow) { color: #d5d4ec; font-size: 16px; }
.home-page .home-package-teaser .store-button { border-radius: 999px; background: #f5f1ff; color: #241a56; }
.home-page .home-package-steps > div { padding: 21px 23px; border: 1px solid #ffffff30; border-radius: 20px; background: #080d2b54; backdrop-filter: blur(12px); }
.home-page .home-package-steps span { color: #d2c1ff; }
.home-page .home-package-steps strong { color: #fff; font-size: 18px; font-weight: 600; }
.home-page .home-package-steps p { color: #c5c7e2; font-size: 13px; }

.home-page .theme-teaser { padding: 0 0 112px; background: #090b13; }
.home-page .theme-teaser-inner {
  min-height: 540px;
  padding: clamp(42px, 6vw, 82px);
  border: 1px solid #ffffff2d;
  border-radius: 42px;
  background: radial-gradient(circle at 75% 53%, #397ac15b, transparent 42%),
    linear-gradient(120deg, #0d2346, #131c3b 55%, #102443);
  overflow: hidden;
}
.home-page .theme-teaser .eyebrow { color: #a8ceff; }
.home-page .theme-teaser-copy h2 { font-size: clamp(45px, 4.5vw, 70px); }
.home-page .theme-teaser-copy h2 em { color: #b7d9ff; }
.home-page .theme-teaser-copy > p:not(.eyebrow) { color: #c2d0e4; font-size: 16px; }
.home-page .theme-teaser-visual img { border-color: #ffffffd9; border-radius: 19px; box-shadow: 0 27px 56px #0007; }

.home-page .showcase-section { padding: 0 0 120px; background: #090b13; }
.home-page .showcase { min-height: 560px; border: 0; border-radius: 42px; background: #eeeff5; }
.home-page .showcase-visual { min-height: 560px; }
.home-page .showcase h2 { color: #191b2a; font-size: clamp(42px, 3.8vw, 62px); font-weight: 430; }
.home-page .showcase h2 em { font: inherit; color: #5740ad; }
.home-page .showcase-copy > p:not(.eyebrow) { color: #5d6173; font-size: 15px; }
.home-page .showcase .eyebrow { color: #6651c4; }
.home-page .text-link { color: #5841b3; border-color: #9081ce; }

.home-page .process-section { padding-block: 32px 120px; border: 0; background: #090b13; }
.home-page .process-section .section-heading { max-width: 800px; margin-bottom: 53px; }
.home-page .process-section .section-heading > p:last-child { color: #a8aab7; }
.home-page .process-grid { border-color: #ffffff22; }
.home-page .process-grid article { min-height: 285px; padding: 34px; border-color: #ffffff22; background: #ffffff04; }
.home-page .process-grid article > span { color: #a78efb; }
.home-page .process-grid h3 { color: #fff; font-size: 22px; font-weight: 550; }
.home-page .process-grid p { color: #a7a9b8; font-size: 13px; }

.home-page .about-teaser { padding: 0 0 112px; background: #090b13; }
.home-page .about-layout {
  min-height: 500px;
  padding: clamp(42px, 6vw, 82px);
  border: 1px solid #ffffff24;
  border-radius: 42px;
  background: radial-gradient(circle at 20% 50%, #6954ab75, transparent 36%), linear-gradient(120deg, #171329, #22143c 65%, #151527);
}
.home-page .about-mark { border-color: #ffffff3f; border-radius: 35px; background: #ffffff13; }
.home-page .about-teaser > div > div:last-child > p:not(.eyebrow) { color: #c5bfd5; font-size: 16px; }
.home-page .about-teaser .text-link { color: #e0d7ff; border-color: #c3afff; }

.home-page .faq-section { padding-block: 110px; background: #f1f1f6; color: #1a1b2a; }
.home-page .faq-section .section-heading h2 { color: #1a1b2a; }
.home-page .faq-section .section-heading h2 em { color: #6951bd; }
.home-page .faq-section .section-heading > p:last-child { color: #676a7b; }
.home-page .faq-list,
.home-page .faq-list details { border-color: #d4d5df; }
.home-page .faq-list summary { color: #202236; }
.home-page .faq-list summary span { color: #7057c7; }
.home-page .faq-list details p { color: #626577; }

.home-page .contact-band { padding-block: 95px; background: radial-gradient(circle at 85% 20%, #7964e4, transparent 37%), linear-gradient(120deg, #332577, #5640bf 55%, #342a83); }
.home-page .contact-band h2 { font-weight: 430; }
.home-page .contact-band p:not(.eyebrow) { color: #e3ddff; font-size: 16px; }
.home-page .contact-band .button { border-radius: 999px; }
.home-page .site-footer { background: #090b13; border-top: 1px solid #ffffff1d; }
.home-page .brand-footer strong,
.home-page .brand-footer b { color: #fff; }
.home-page .site-footer .brand img { filter: brightness(0) invert(1); transform: none; }
.home-page .contact-widget-toggle { border-color: #ae90f2; background: linear-gradient(130deg, #49349f, #7559db); box-shadow: 0 13px 40px #120d3c91; }

@media (max-width: 1100px) {
  .home-page .header-phone { display: none; }
  .home-page .header-cta { margin-left: auto; }
  .home-page .hero { min-height: 760px; }
  .home-page .hero h1 { max-width: 680px; font-size: clamp(62px, 8vw, 88px); }
  .home-page .home-package-inner,
  .home-page .theme-teaser-inner { gap: 35px; }
}

@media (max-width: 760px) {
  .home-page .container { width: min(100% - 36px, 1392px); }
  .home-page .header-inner { min-height: 86px; }
  .home-page .brand img { width: 44px; height: 44px; }
  .home-page .brand strong { font-size: 16px; }
  .home-page .brand b { font-size: 13px; }
  .home-page .header-cta { min-height: 46px; padding-inline: 16px; font-size: 11px; }
  .home-page .mobile-nav summary { width: 46px; height: 46px; }
  .home-page .agency-menu-panel { padding: 110px 26px 36px; }
  .home-page .agency-menu nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-page .agency-menu nav a { font-size: clamp(29px, 5vw, 43px); }
  .home-page .agency-menu-categories { gap: 24px; }
  .home-page .hero { min-height: 760px; background-position: 67% center; }
  .home-page .hero::before { background: linear-gradient(90deg, #090b13f7, #090b13d7 62%, #090b137a), linear-gradient(0deg, #090b13eb, transparent 38%); }
  .home-page .hero-content { padding-block: 150px 90px; }
  .home-page .hero h1 { max-width: 590px; font-size: clamp(54px, 9.4vw, 76px); }
  .home-page .hero-lead { max-width: 470px; font-size: 15px; }
  .home-page .hero-scroll { display: none; }
  .home-page .services-section { padding-block: 85px; }
  .home-page .service-grid { grid-template-columns: 1fr; }
  .home-page .service-card { min-height: 320px; }
  .home-page .home-package-inner,
  .home-page .theme-teaser-inner { grid-template-columns: 1fr; }
  .home-page .theme-teaser-visual { max-width: 620px; }
  .home-page .showcase { grid-template-columns: 1fr; }
  .home-page .showcase-visual { min-height: 350px; height: 350px; }
  .home-page .process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-page .about-layout { grid-template-columns: 1fr; gap: 30px; }
  .home-page .about-mark { width: 160px; height: 160px; }
  .home-page .about-mark img { width: 130px; height: 130px; }
}

@media (max-width: 560px) {
  .home-page .container { width: min(100% - 32px, 1392px); }
  .home-page .header-inner { gap: 10px; }
  .home-page .brand { gap: 7px; }
  .home-page .brand img { width: 39px; height: 39px; }
  .home-page .brand strong { font-size: 14px; }
  .home-page .brand b { font-size: 11px; }
  .home-page .header-cta { min-height: 40px; padding: 9px 13px; font-size: 10px; }
  .home-page .mobile-nav summary { width: 42px; height: 42px; }
  .home-page .agency-menu-panel { padding: 96px 21px 28px; }
  .home-page .agency-menu-kicker { font-size: 9px; margin-bottom: 14px; }
  .home-page .agency-menu nav { grid-template-columns: 1fr; gap: 0; padding-bottom: 20px; }
  .home-page .agency-menu nav a { padding: 7px 0; font-size: clamp(28px, 8vw, 39px); }
  .home-page .agency-menu-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 18px; padding-block: 27px; }
  .home-page .agency-menu-categories section { gap: 8px; }
  .home-page .agency-menu-categories a { font-size: 12px; }
  .home-page .agency-menu-contact { align-items: flex-start; flex-direction: column; gap: 16px; padding-top: 22px; }
  .home-page .agency-menu-contact a:first-child { font-size: 12px; }
  .home-page .hero { min-height: 745px; background-position: 68% center; }
  .home-page .hero::before { background: linear-gradient(90deg, #090b13f8, #090b13e7 70%, #090b13a9), linear-gradient(0deg, #090b13f5, transparent 44%); }
  .home-page .hero-content { padding-block: 130px 64px; }
  .home-page .hero .eyebrow { font-size: 16px; }
  .home-page .hero h1 { max-width: 410px; margin: 28px 0 21px; font-size: clamp(48px, 11vw, 65px); }
  .home-page .hero-lead { font-size: 14px; }
  .home-page .hero-actions { flex-direction: column; align-items: stretch; max-width: 300px; margin-top: 25px; }
  .home-page .hero-actions .button { min-height: 48px; justify-content: space-between; }
  .home-page .ticker-inner { display: flex; flex-wrap: wrap; justify-content: center; min-height: 65px; padding-block: 16px; gap: 9px 17px; font-size: 9px; }
  .home-page .ticker b { display: none; }
  .home-page .services-section { padding-block: 74px; }
  .home-page .section-heading h2 { font-size: clamp(43px, 10vw, 58px); }
  .home-page .section-heading.split { margin-bottom: 35px; }
  .home-page .section-heading.split > p { font-size: 14px; }
  .home-page .service-card { min-height: 300px; padding: 27px; border-radius: 24px; }
  .home-page .service-icon { margin: 20px 0 17px; }
  .home-page .service-card h3 { font-size: 26px; }
  .home-page .home-package-teaser,
  .home-page .theme-teaser,
  .home-page .about-teaser { padding-bottom: 72px; }
  .home-page .home-package-inner,
  .home-page .theme-teaser-inner,
  .home-page .about-layout { padding: 30px 25px; border-radius: 28px; }
  .home-page .home-package-teaser h2,
  .home-page .theme-teaser h2,
  .home-page .about-teaser h2 { font-size: clamp(40px, 9.5vw, 53px); }
  .home-page .home-package-inner > div:first-child > p:not(.eyebrow),
  .home-page .theme-teaser-copy > p:not(.eyebrow),
  .home-page .about-teaser > div > div:last-child > p:not(.eyebrow) { font-size: 14px; }
  .home-page .theme-teaser-visual { min-height: 235px; }
  .home-page .theme-teaser-visual img { height: 190px; }
  .home-page .theme-teaser-visual img:nth-child(2) { height: 230px; }
  .home-page .showcase-section { padding-bottom: 75px; }
  .home-page .showcase { border-radius: 28px; }
  .home-page .showcase-visual { min-height: 240px; height: 240px; }
  .home-page .showcase-copy { padding: 34px 27px 42px; }
  .home-page .showcase h2 { font-size: 42px; }
  .home-page .process-section { padding-block: 20px 75px; }
  .home-page .process-grid { grid-template-columns: 1fr; }
  .home-page .process-grid article { min-height: 190px; padding: 26px; }
  .home-page .faq-section { padding-block: 75px; }
  .home-page .contact-band { padding-block: 70px; }
  .home-page .contact-band h2 { font-size: 42px; }
}

@media (prefers-reduced-motion: reduce) {
  .home-page .service-card,
  .home-page .mobile-nav summary { transition: none; }
}