/* Estilos específicos para las páginas de Extras */

.extrasReveal{
  opacity: 0;
  filter: blur(6px);
  transition: opacity 650ms var(--revealEasing), transform 650ms var(--revealEasing), filter 650ms var(--revealEasing);
  will-change: opacity, transform, filter;
}
.extrasReveal--left{ transform: translateX(-56px) scale(.99); }
.extrasReveal--right{ transform: translateX(56px) scale(.99); }
.extrasReveal--up{ transform: translateY(52px) scale(.97); }
.extrasReveal.is-visible{
  opacity: 1;
  transform: translate(0) scale(1);
  filter: blur(0);
}
.hero__left.extrasReveal{ animation: none; }
.serviceCard:nth-child(1){ transition-delay: 0ms; }
.serviceCard:nth-child(2){ transition-delay: 120ms; }
.serviceCard:nth-child(3){ transition-delay: 240ms; }
.serviceCard:nth-child(4){ transition-delay: 360ms; }
.serviceCard:nth-child(5){ transition-delay: 480ms; }
.services-grid .serviceCard.is-visible:hover{
  transition-delay: 0ms;
}

@media (prefers-reduced-motion: reduce){
  .extrasReveal{
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
  }
}

.services-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 22px;
  margin-top: 24px;
}

.serviceCard{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 28px 20px 24px;
  border: 3px solid transparent;
  border-radius: 28px;
  background: #fff;
  box-shadow: 4px 4px 0 rgba(0,0,0,0.15);
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
  text-decoration: none;
}

.serviceCard:nth-child(odd){
  background: linear-gradient(180deg, #fff 0%, #f8f7ff 100%);
  border-color: #ffd400;
}

.serviceCard:nth-child(even){
  background: linear-gradient(180deg, #f6f7ff 0%, #fff 100%);
  border-color: #00e5a8;
}

.serviceCard__icon{
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 18px;
  margin-bottom: 18px;
  background: #000;
  color: #fff;
  font-size: 24px;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.12);
}

.serviceCard:nth-child(odd) .serviceCard__icon{
  background: #ffd400;
  color: #121212;
}

.serviceCard:nth-child(even) .serviceCard__icon{
  background: #00e5a8;
  color: #121212;
}

.serviceCard h3{
  margin: 0 0 12px;
  font-size: 1.12rem;
  letter-spacing: -0.02em;
}

.serviceCard p{
  margin: 0;
  color: #333;
  line-height: 1.7;
}

.serviceCard:hover{
  transform: translateY(-6px);
  box-shadow: 12px 12px 0 rgba(0,0,0,0.1);
}

.serviceCard:hover .serviceCard__icon{
  transform: translateY(-2px);
}

/* ===========================
   Galaxy Theme — páginas de Extras
   (al final para prevalecer sobre .serviceCard y sus :nth-child)
   =========================== */

html[data-style="galaxy"] .serviceCard{
  background: var(--card);
  border-color: var(--outline);
  box-shadow: var(--shadow);
}

html[data-style="galaxy"] .serviceCard:nth-child(odd),
html[data-style="galaxy"] .serviceCard:nth-child(even){
  background: var(--card);
  border-color: var(--outline);
}

html[data-style="galaxy"] .serviceCard__icon{
  background: linear-gradient(135deg, #a855f7, #7c3aed);
  color: #ffffff;
  box-shadow: var(--shadow-sm);
}

html[data-style="galaxy"] .serviceCard:nth-child(odd) .serviceCard__icon,
html[data-style="galaxy"] .serviceCard:nth-child(even) .serviceCard__icon{
  background: linear-gradient(135deg, #a855f7, #7c3aed);
  color: #ffffff;
}

html[data-style="galaxy"] .serviceCard h3{
  color: var(--ink);
}

html[data-style="galaxy"] .serviceCard p{
  color: var(--muted);
}

/* ===========================
   Stealth Obsidian Theme — páginas de Extras
   (al final para prevalecer sobre .serviceCard y sus :nth-child)
   =========================== */

html[data-style="stealth"] .serviceCard{
  background: var(--card);
  border-color: var(--outline);
  box-shadow: var(--shadow-sm);
}

html[data-style="stealth"] .serviceCard:nth-child(odd),
html[data-style="stealth"] .serviceCard:nth-child(even){
  background: var(--card);
  border-color: var(--outline);
}

html[data-style="stealth"] .serviceCard__icon{
  background: var(--primary);
  color: #000000;
  box-shadow: var(--shadow-sm);
}

html[data-style="stealth"] .serviceCard:nth-child(odd) .serviceCard__icon,
html[data-style="stealth"] .serviceCard:nth-child(even) .serviceCard__icon{
  background: var(--primary);
  color: #000000;
}

html[data-style="stealth"] .serviceCard h3{
  color: var(--ink);
}

 html[data-style="stealth"] .serviceCard p{
  color: var(--muted);
 }

/* ===========================
   Normal Theme — Modo oscuro (páginas de Extras)
   (usa las variables --card/--ink/--muted de html[data-theme="dark"])
   =========================== */

html[data-theme="dark"] .serviceCard{
  background: var(--card);
  box-shadow: var(--shadow);
}

html[data-theme="dark"] .serviceCard:nth-child(odd),
html[data-theme="dark"] .serviceCard:nth-child(even){
  background: var(--card);
}

html[data-theme="dark"] .serviceCard h3{
  color: var(--ink);
}

html[data-theme="dark"] .serviceCard p{
  color: var(--muted);
}

/* ===========================
   Galaxy Theme - Mobile optimization (≤720px) para Extras
   =========================== */
.discordService{
  --discord-accent: #7b83ff;
  --discord-mint: #6be0c1;
  overflow: hidden;
}

.discordHero{
  padding: clamp(56px, 8vw, 104px) 0 clamp(68px, 9vw, 112px);
  border-bottom: 1px solid var(--outline);
  background-image: linear-gradient(rgba(123, 131, 255, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(123, 131, 255, 0.035) 1px, transparent 1px);
  background-size: 36px 36px;
}

.discordHero__grid{ display: grid; grid-template-columns: minmax(0,.82fr) minmax(0,1.18fr); align-items: center; gap: clamp(36px,6vw,84px); }
.discordHero__copy{ max-width: 570px; }
.discordEyebrow,
.discordKicker{ display: inline-flex; align-items: center; gap: 9px; color: var(--discord-accent); font-family: 'DM Mono',monospace; font-size: 10px; font-weight: 500; text-transform: uppercase; }
.discordEyebrow span,
.discordBotStatus span{ width: 8px; height: 8px; border-radius: 50%; background: var(--discord-mint); box-shadow: 0 0 12px rgba(107,224,193,.45); }
.discordHero .title{ max-width: 11ch; margin-top: 19px; font-family: 'Space Grotesk',sans-serif; font-size: clamp(42px,5.8vw,72px); line-height: .98; }
.discordHero .lead{ max-width: 58ch; margin-top: 18px; color: var(--muted); line-height: 1.75; }
.discordHero__actions{ display: flex; align-items: center; flex-wrap: wrap; gap: 20px; margin-top: 26px; }
.discordTextLink{ color: var(--ink); font-size: 13px; font-weight: 800; text-underline-offset: 5px; text-decoration-color: var(--discord-accent); }
.discordTextLink span{ margin-left: 5px; color: var(--discord-accent); }
.discordHero__note{ margin: 22px 0 0; color: var(--muted); font-size: 11px; line-height: 1.6; }

.discordServer{ display: grid; width: 100%; min-height: 400px; grid-template-columns: 54px 164px minmax(0,1fr); overflow: hidden; border: 1px solid rgba(255,255,255,.08); border-radius: 12px; background: #313338; box-shadow: 0 28px 84px rgba(0,0,0,.32); color: #dbdee1; font-family: 'Manrope',sans-serif; }
.discordServer__rail{ display: flex; flex-direction: column; align-items: center; gap: 11px; padding: 15px 0; background: #1e1f22; }
.discordServer__guild{ display: grid; width: 36px; height: 36px; place-items: center; border-radius: 13px; background: #42444a; color: #f2f3f5; font-weight: 850; }
.discordServer__guild--active{ border-radius: 12px; background: #313338; color: var(--discord-mint); }
.discordServer__railLine{ width: 22px; height: 1px; background: #4e5058; }
.discordServer__channels{ position: relative; padding: 0 10px; background: #2b2d31; }
.discordServer__name{ display: flex; height: 49px; align-items: center; justify-content: space-between; border-bottom: 1px solid #252629; color: #f2f3f5; font-size: 10px; font-weight: 850; }
.discordChannelGroup{ margin: 18px 0 7px; color: #949ba4; font-size: 8px; font-weight: 850; }
.discordChannel{ display: flex; align-items: center; gap: 7px; padding: 7px 6px; border-radius: 5px; color: #949ba4; font-size: 10px; }
.discordChannel b{ color: #72767d; font-size: 14px; }
.discordChannel--active{ background: #404249; color: #f2f3f5; }
.discordChannel--active b{ color: #dbdee1; }
.discordBotStatus{ position: absolute; right: 10px; bottom: 14px; left: 10px; display: flex; align-items: center; gap: 6px; color: #a8b0b8; font-family: 'DM Mono',monospace; font-size: 8px; }
.discordBotStatus span{ width: 6px; height: 6px; }
.discordServer__conversation{ display: flex; min-width: 0; flex-direction: column; padding: 0 16px 14px; }
.discordConversation__head{ display: flex; min-height: 49px; flex-wrap: wrap; align-items: center; gap: 8px; border-bottom: 1px solid #3f4147; }
.discordConversation__head b{ color: #f2f3f5; font-size: 11px; }
.discordConversation__head span{ color: #949ba4; font-size: 9px; }
.discordMessage{ display: flex; gap: 10px; margin-top: 19px; }
.discordMessage--bot{ padding: 11px 10px; border-left: 2px solid var(--discord-accent); border-radius: 4px; background: rgba(255,255,255,.035); }
.discordAvatar{ display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--discord-accent); color: #fff; font-size: 12px; font-weight: 850; }
.discordAvatar--member{ background: #b97856; }
.discordMessage strong{ color: #f2f3f5; font-size: 10px; }
.discordMessage strong i{ margin-left: 5px; padding: 2px 4px; border-radius: 3px; background: var(--discord-accent); color: #fff; font-family: 'DM Mono',monospace; font-size: 7px; font-style: normal; }
.discordMessage p{ margin: 5px 0 0; color: #dbdee1; font-size: 10px; line-height: 1.55; }
.discordMessage time{ display: block; margin-top: 6px; color: #949ba4; font-size: 8px; }
.discordRoleButtons{ display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.discordRoleButtons span{ padding: 5px 7px; border: 1px solid rgba(123,131,255,.5); border-radius: 4px; color: #c9ccff; font-size: 8px; }
.discordServer__composer{ display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding: 10px 11px; border-radius: 7px; background: #383a40; color: #949ba4; font-size: 9px; }
.discordServer__composer b{ color: #dbdee1; font-size: 16px; }

.discordSection{ padding: clamp(64px,8vw,100px) 0; }
.discordSection--capabilities,
.discordSection--considerations{ background: var(--alt); }
.discordSection__heading{ max-width: 760px; margin: 0 auto 36px; text-align: center; }
.discordSection__heading .sectionTitle{ max-width: 18ch; margin: 12px auto; font-family: 'Space Grotesk',sans-serif; }
.discordSection__heading .muted{ max-width: 66ch; margin: 0 auto; color: var(--muted); line-height: 1.7; }
.discordCapabilityGrid{ display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 12px; }
.discordCapability{ min-width: 0; min-height: 220px; padding: clamp(19px,2.5vw,28px); overflow: hidden; border: 1px solid var(--outline); border-radius: 10px; background: var(--card); box-shadow: var(--shadow-sm); transition: opacity 650ms var(--revealEasing),transform 650ms var(--revealEasing),filter 650ms var(--revealEasing),border-color 220ms ease; }
.discordCapability:nth-child(-n + 4){ grid-column: span 3; }
.discordCapability:nth-child(5){ grid-column: span 7; }
.discordCapability:nth-child(6){ grid-column: span 5; }
.discordCapability:nth-child(7){ grid-column: span 5; }
.discordCapability:nth-child(8){ grid-column: span 7; }
.discordCapability:nth-child(1){ transition-delay: 0ms; }
.discordCapability:nth-child(2){ transition-delay: 80ms; }
.discordCapability:nth-child(3){ transition-delay: 160ms; }
.discordCapability:nth-child(4){ transition-delay: 240ms; }
.discordCapability:nth-child(5){ transition-delay: 320ms; }
.discordCapability:nth-child(6){ transition-delay: 400ms; }
.discordCapability:nth-child(7){ transition-delay: 480ms; }
.discordCapability:nth-child(8){ transition-delay: 560ms; }
.discordCapability:hover{ border-color: rgba(123,131,255,.55); }
.discordCapability--wide{ min-height: 190px; background-image: linear-gradient(115deg,rgba(123,131,255,.09),transparent 65%); }
.discordCapability--accent{ background-image: linear-gradient(135deg,rgba(107,224,193,.12),transparent 72%); }
.discordCapability__index{ display: flex; align-items: center; gap: 9px; color: var(--discord-accent); font-family: 'DM Mono',monospace; font-size: 11px; }
.discordCapability__index i{ color: var(--muted); font-size: 8px; font-style: normal; }
.discordCapability h3{ margin: 20px 0 8px; font-family: 'Space Grotesk',sans-serif; font-size: 18px; line-height: 1.2; }
.discordCapability p{ margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.discordCapability code{ display: inline-block; margin-top: 16px; padding: 7px 9px; border: 1px solid var(--outline); border-radius: 5px; color: var(--discord-mint); font-size: 10px; overflow-wrap: anywhere; }
.discordChannelPreview{ display: flex; align-items: center; gap: 8px; margin-top: 17px; padding: 9px; border-radius: 5px; background: rgba(123,131,255,.1); color: var(--muted); font-size: 10px; }
.discordChannelPreview span{ color: var(--discord-accent); font-size: 14px; }
.discordChannelPreview b{ margin-left: auto; color: var(--discord-accent); }
.discordRolePreview{ display: flex; flex-wrap: wrap; gap: 5px; margin-top: 16px; }
.discordRolePreview span{ padding: 5px 6px; border: 1px solid var(--outline); border-radius: 4px; color: var(--muted); font-size: 8px; }
.discordTicketFlow{ display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 17px; color: var(--discord-mint); font-family: 'DM Mono',monospace; font-size: 9px; }
.discordTicketFlow span{ padding: 7px 8px; border: 1px solid var(--outline); border-radius: 4px; }
.discordTicketFlow b{ color: var(--discord-accent); }

.discordPermissionsPanel{ display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(26px,6vw,72px); align-items: center; padding: clamp(25px,5vw,52px); border: 1px solid rgba(123,131,255,.38); border-radius: 12px; background: linear-gradient(125deg,rgba(123,131,255,.1),var(--card) 68%); }
.discordPermissionsPanel .sectionTitle{ max-width: 16ch; margin: 12px 0; font-family: 'Space Grotesk',sans-serif; }
.discordPermissionsPanel .muted{ max-width: 62ch; color: var(--muted); line-height: 1.75; }
.discordPermissionList{ display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.discordPermissionList li{ display: flex; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--outline); color: var(--ink); font-size: 11px; line-height: 1.5; }
.discordPermissionList li:last-child{ border-bottom: 0; }
.discordPermissionList span{ color: var(--discord-accent); font-family: 'DM Mono',monospace; font-size: 9px; }
.discordWorkflow{ display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.discordWorkflow__step{ min-height: 205px; padding: 23px; border-top: 2px solid var(--discord-accent); background: linear-gradient(180deg,rgba(123,131,255,.08),transparent 78%); }
.discordWorkflow__step > span{ color: var(--discord-accent); font-family: 'DM Mono',monospace; font-size: 9px; }
.discordWorkflow__step h3{ margin: 24px 0 8px; font-family: 'Space Grotesk',sans-serif; font-size: 19px; }
.discordWorkflow__step p{ margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.discordSection--integrations{ padding-top: 6px; }
.discordIntegrationBand{ display: grid; grid-template-columns: 1.1fr .9fr; gap: 34px; align-items: center; padding: clamp(24px,5vw,48px); border: 1px solid var(--outline); border-radius: 12px; background: var(--card); }
.discordIntegrationBand .sectionTitle{ max-width: 17ch; margin: 12px 0; font-family: 'Space Grotesk',sans-serif; }
.discordIntegrationBand .muted{ max-width: 62ch; margin: 0; color: var(--muted); line-height: 1.7; }
.discordIntegrationTags{ display: flex; flex-wrap: wrap; gap: 8px; align-content: center; }
.discordIntegrationTags span{ padding: 9px 10px; border: 1px solid var(--outline); border-radius: 5px; color: var(--discord-mint); font-family: 'DM Mono',monospace; font-size: 9px; }
.discordConsiderations{ display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.discordConsideration{ padding-top: 15px; border-top: 1px solid var(--outline); }
.discordConsideration > span{ color: var(--discord-accent); font-family: 'DM Mono',monospace; font-size: 9px; }
.discordConsideration h3{ margin: 12px 0 8px; font-family: 'Space Grotesk',sans-serif; font-size: 17px; line-height: 1.25; }
.discordConsideration p{ margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.discordFaq{ display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; max-width: 1000px; margin: 0 auto; }
.discordFaq .faq__item{ align-self: start; border-radius: 7px; }
.discordFaq .faq__item summary{ font-family: 'Space Grotesk',sans-serif; }
.discordFaq .faq__item p{ padding-top: 4px; color: var(--muted); line-height: 1.65; }
.discordFinalCta{ padding-top: 20px; }
.discordFinalCta__inner{ display: flex; max-width: 980px; flex-direction: column; align-items: center; padding: clamp(32px,6vw,60px); border: 1px solid rgba(107,224,193,.3); border-radius: 13px; background: linear-gradient(120deg,rgba(107,224,193,.08),var(--card)); text-align: center; }
.discordFinalCta h2{ max-width: 19ch; margin: 14px 0 10px; font-family: 'Space Grotesk',sans-serif; font-size: clamp(30px,4vw,46px); line-height: 1.04; }
.discordFinalCta p{ max-width: 62ch; margin: 0 0 22px; color: var(--muted); line-height: 1.7; }

@media (max-width: 1080px){
  .discordHero__grid{ grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 28px; }
  .discordServer{ grid-template-columns: 44px 140px minmax(0,1fr); min-height: 370px; }
  .discordServer__channels{ padding: 0 8px; }
  .discordServer__conversation{ padding-right: 11px; padding-left: 11px; }
  .discordCapability:nth-child(-n + 4),
  .discordCapability:nth-child(n + 5){ grid-column: span 6; }
}

@media (max-width: 720px){
  .discordHero{ padding: 52px 0 62px; }
  .discordHero__grid{ grid-template-columns: 1fr; }
  .discordHero .title{ max-width: 12ch; font-size: clamp(42px,12vw,62px); }
  .discordServer{ min-height: 360px; grid-template-columns: 40px 116px minmax(0,1fr); }
  .discordServer__rail{ gap: 8px; padding-top: 12px; }
  .discordServer__guild{ width: 30px; height: 30px; }
  .discordServer__channels{ padding: 0 6px; }
  .discordServer__name{ font-size: 8px; }
  .discordChannel{ gap: 4px; padding: 7px 3px; font-size: 8px; }
  .discordChannelGroup{ font-size: 7px; }
  .discordServer__conversation{ padding: 0 8px 10px; }
  .discordConversation__head{ align-content: center; gap: 2px; }
  .discordConversation__head b{ font-size: 9px; }
  .discordConversation__head span{ font-size: 7px; }
  .discordMessage{ gap: 6px; margin-top: 14px; }
  .discordAvatar{ width: 24px; height: 24px; font-size: 10px; }
  .discordMessage p,.discordMessage strong{ font-size: 8px; }
  .discordRoleButtons span{ font-size: 7px; }
  .discordCapabilityGrid{ grid-template-columns: 1fr; }
  .discordCapability:nth-child(n){ grid-column: auto; min-height: auto; }
  .discordWorkflow,
  .discordConsiderations,
  .discordFaq,
  .discordPermissionsPanel,
  .discordIntegrationBand{ grid-template-columns: 1fr; }
  .discordWorkflow__step{ min-height: auto; }
  .discordWorkflow__step h3{ margin-top: 16px; }
}

@media (prefers-reduced-motion: reduce){
  .discordCapability,
  .discordWorkflow__step,
  .discordPermissionsPanel,
  .discordIntegrationBand,
  .discordFinalCta__inner{ transition: none; }
}

@media (max-width: 720px){
  html[data-style="galaxy"] .serviceCard{
    animation: none;
    box-shadow: none;
  }

  html[data-style="galaxy"] .serviceCard__icon{
    box-shadow: none;
  }
}

.services-grid--integrations .serviceCard:nth-child(1){ transition-delay: 0ms; }
.services-grid--integrations .serviceCard:nth-child(2){ transition-delay: 140ms; }
.services-grid--integrations .serviceCard:nth-child(3){ transition-delay: 280ms; }
.services-grid--integrations .serviceCard:nth-child(4){ transition-delay: 420ms; }

html[data-page="complete-web"]{
  overflow-x: hidden;
}

html[data-style] .services-grid--integrations .serviceCard__icon{
  width: 44px;
  height: 44px;
  border: 2px solid var(--outline);
  border-radius: 14px;
  font-size: 21px;
  box-shadow: 3px 3px 0 #000;
}

html[data-style] .services-grid--integrations .serviceCard:nth-child(odd) .serviceCard__icon,
html[data-style] .services-grid--integrations .serviceCard:nth-child(even) .serviceCard__icon{
  background: #16232b;
  color: #9cddf7;
}

.completeWebMain > .hero .hero__grid{
  display: block;
  max-width: 960px;
}

.completeWebMain > .hero .hero__left{
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 860px;
  margin: 0 auto;
  text-align: center;
}

.completeWebMain > .hero .hero__left .title{
  max-width: 20ch;
}

.completeWebMain > .hero .hero__left .lead,
.completeWebMain > .hero .hero__left > .muted{
  max-width: 70ch;
}

.completeWebMain .hero__cta{
  justify-content: center;
}

.completeWebMain .hero__cta .btn{
  flex: 0 1 auto;
}

.completeWebMain > .section .container{
  max-width: 1040px;
}

.completeWebMain .sectionTitle{
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.completeWebMain > .section > .container > .muted{
  max-width: 72ch;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.completeWebMain .grid2{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.completeWebMain .completeWebInvestment{
  grid-template-columns: minmax(0, 900px);
  justify-content: center;
}

html[data-style] .completeWebMain .completeWebInvestment__contact{
  border-color: rgba(125, 211, 252, 0.24);
}

.completeWebMain .panel,
.completeWebMain .aside{
  text-align: center;
}

.completeWebMain .aside__list{
  display: inline-block;
  text-align: left;
}

.completeWebMain .aside__text{
  max-width: 68ch;
  margin-right: auto;
  margin-left: auto;
}

.completeWebMain .completeWebBasePanel{
  max-width: 900px;
  margin: 0 auto;
  padding: clamp(22px, 4vw, 38px);
  border: 1px solid rgba(125, 211, 252, 0.24);
  border-radius: 14px;
  background: linear-gradient(120deg, rgba(125, 211, 252, 0.14), rgba(217, 230, 255, 0.05));
  box-shadow: none;
  text-align: center;
}

.completeWebMain .completeWebBasePanel.extrasReveal{
  opacity: 0;
  transform: none;
  filter: none;
  transition: opacity 700ms var(--revealEasing);
}

.completeWebMain .completeWebBasePanel.extrasReveal.is-visible{
  opacity: 1;
}

.completeWebMain .completeWebBasePanel__details{
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(125, 211, 252, 0.2);
}

.completeWebMain .completeWebBasePanel__details .panel__title{
  margin-bottom: 12px;
}

.completeWebMain .completeWebBasePanel__details .muted{
  max-width: 68ch;
  margin: 0 auto 12px;
}

@media (prefers-reduced-motion: reduce){
  .completeWebMain .completeWebBasePanel.extrasReveal,
  .completeWebMain .completeWebBasePanel.extrasReveal.is-visible{
    opacity: 1;
    transition: none;
  }
}

.completeWebMain .faq__item{
  text-align: center;
}

/* Telegram bot service page */
.telegramService{
  --telegram-blue: #229ed9;
  --telegram-blue-soft: rgba(34, 158, 217, 0.12);
  overflow: hidden;
}

.telegramHero{
  padding: clamp(64px, 9vw, 118px) 0 clamp(70px, 9vw, 112px);
  border-bottom: 1px solid var(--outline);
  background-image: linear-gradient(rgba(34, 158, 217, 0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(34, 158, 217, 0.035) 1px, transparent 1px);
  background-size: 44px 44px;
}

.telegramHero__grid{
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.8fr);
  align-items: center;
  gap: clamp(44px, 8vw, 112px);
}

.telegramHero__copy{ max-width: 680px; }
.telegramEyebrow,
.telegramKicker{
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--telegram-blue);
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
}

.telegramEyebrow span,
.telegramFeature__signal span,
.telegramChat__caption span{
  width: 8px;
  height: 8px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--telegram-blue);
  box-shadow: 0 0 14px rgba(34, 158, 217, 0.5);
}

.telegramHero .title{
  max-width: 12ch;
  margin-top: 20px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(42px, 6.4vw, 78px);
  line-height: 0.98;
}

.telegramHero .lead{
  max-width: 58ch;
  margin-top: 20px;
  color: var(--muted);
  line-height: 1.7;
}

.telegramHero__actions{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 22px;
  margin-top: 28px;
}

.telegramTextLink{
  color: var(--ink);
  font-size: 14px;
  font-weight: 800;
  text-decoration-color: var(--telegram-blue);
  text-underline-offset: 5px;
}

.telegramTextLink span{ margin-left: 5px; color: var(--telegram-blue); }
.telegramHero__note{ margin: 24px 0 0; color: var(--muted); font-size: 12px; }

.telegramChat{
  width: min(100%, 470px);
  justify-self: end;
  overflow: hidden;
  border: 1px solid var(--outline);
  border-radius: 16px;
  background: var(--card);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.22);
}

.telegramChat__topbar{
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 14px 17px;
  background: var(--telegram-blue);
  color: #fff;
}

.telegramChat__avatar{
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.22);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
}

.telegramChat__topbar strong,
.telegramChat__topbar small{ display: block; }
.telegramChat__topbar strong{ font-size: 13px; }
.telegramChat__topbar small{ margin-top: 3px; color: rgba(255,255,255,.78); font-size: 11px; }
.telegramChat__menu{ margin-left: auto; font-size: 18px; }

.telegramChat__body{
  display: flex;
  min-height: 350px;
  flex-direction: column;
  align-items: flex-start;
  gap: 11px;
  padding: 20px 17px 15px;
  background: #edf4f7;
}

.telegramChat__date{
  align-self: center;
  margin-bottom: 3px;
  padding: 5px 9px;
  border-radius: 10px;
  background: rgba(40, 59, 71, 0.1);
  color: #546875;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
}

.telegramBubble{
  max-width: 88%;
  padding: 11px 12px 8px;
  border-radius: 12px;
  color: #1d2c34;
  font-size: 13px;
  line-height: 1.5;
  box-shadow: 0 2px 4px rgba(14, 32, 43, 0.06);
}

.telegramBubble time{
  display: block;
  margin-top: 3px;
  color: #71848d;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  text-align: right;
}

.telegramBubble--bot{ background: #fff; border-bottom-left-radius: 4px; }
.telegramBubble--user{ align-self: flex-end; background: #d7f3e4; border-bottom-right-radius: 4px; }

.telegramChoices{
  display: grid;
  width: min(88%, 270px);
  gap: 6px;
  margin-left: 4px;
}

.telegramChoices span{
  padding: 8px 10px;
  border: 1px solid rgba(34, 158, 217, 0.28);
  border-radius: 8px;
  background: #fff;
  color: #167eb2;
  font-size: 11px;
  font-weight: 800;
  text-align: center;
}

.telegramChat__input{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: auto;
  padding: 9px 11px;
  border-radius: 18px;
  background: #fff;
  color: #7b8b93;
  font-size: 11px;
}

.telegramChat__input b{
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  border-radius: 50%;
  background: var(--telegram-blue);
  color: #fff;
  font-size: 14px;
}

.telegramChat__caption{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border-top: 1px solid var(--outline);
  color: var(--muted);
  font-size: 10px;
}

.telegramChat__caption span{ width: 6px; height: 6px; }

.telegramSection{ padding: clamp(64px, 8vw, 102px) 0; }
.telegramSection--features{ background: var(--alt); }
.telegramSection__heading{ max-width: 760px; margin: 0 auto 36px; text-align: center; }
.telegramSection__heading .sectionTitle{ max-width: 17ch; margin: 12px auto 14px; font-family: 'Space Grotesk', sans-serif; }
.telegramSection__heading .muted{ max-width: 64ch; margin: 0 auto; line-height: 1.7; }

.telegramFeatureGrid{
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 14px;
}

.telegramFeature{
  position: relative;
  min-width: 0;
  min-height: 230px;
  padding: clamp(20px, 2.7vw, 30px);
  overflow: hidden;
  border: 1px solid var(--outline);
  border-radius: 12px;
  background: var(--card);
  box-shadow: var(--shadow-sm);
  transition: opacity 650ms var(--revealEasing), transform 650ms var(--revealEasing), filter 650ms var(--revealEasing), border-color 220ms ease;
}

.telegramFeature:nth-child(1){ grid-column: span 7; }
.telegramFeature:nth-child(2){ grid-column: span 5; }
.telegramFeature:nth-child(3),
.telegramFeature:nth-child(4),
.telegramFeature:nth-child(5){ grid-column: span 4; }
.telegramFeature:nth-child(6){ grid-column: span 5; }
.telegramFeature:nth-child(7){ grid-column: span 7; }
.telegramFeature:nth-child(1){ transition-delay: 0ms; }
.telegramFeature:nth-child(2){ transition-delay: 100ms; }
.telegramFeature:nth-child(3){ transition-delay: 180ms; }
.telegramFeature:nth-child(4){ transition-delay: 260ms; }
.telegramFeature:nth-child(5){ transition-delay: 340ms; }
.telegramFeature:nth-child(6){ transition-delay: 420ms; }
.telegramFeature:nth-child(7){ transition-delay: 500ms; }

.telegramFeature:hover{ border-color: rgba(34, 158, 217, 0.48); }
.telegramFeature--welcome{ background: linear-gradient(140deg, var(--card), var(--telegram-blue-soft)); }
.telegramFeature__index{ display: flex; align-items: center; gap: 12px; color: var(--telegram-blue); font-family: 'DM Mono', monospace; font-size: 12px; }
.telegramFeature__index i{ color: var(--muted); font-size: 9px; font-style: normal; }
.telegramFeature h3,
.telegramWorkflow__step h3,
.telegramNote h3{ margin: 24px 0 9px; font-family: 'Space Grotesk', sans-serif; font-size: 20px; line-height: 1.2; }
.telegramFeature p,
.telegramWorkflow__step p,
.telegramNote p{ margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }

.telegramFeature__chips{ display: flex; flex-wrap: wrap; gap: 7px; margin-top: 20px; }
.telegramFeature__chips span{ padding: 6px 8px; border: 1px solid rgba(34, 158, 217, 0.22); border-radius: 6px; color: var(--telegram-blue); font-family: 'DM Mono', monospace; font-size: 10px; }
.telegramFeature__signal{ display: flex; align-items: center; gap: 8px; margin-top: 20px; color: var(--muted); font-size: 11px; }
.telegramFeature__signal span{ width: 6px; height: 6px; }

.telegramSection--workflow .telegramSection__heading{ margin-bottom: 30px; }
.telegramWorkflow{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.telegramWorkflow__step{ min-height: 210px; padding: 24px; border-top: 1px solid rgba(34, 158, 217, 0.55); background: linear-gradient(180deg, var(--telegram-blue-soft), transparent 72%); }
.telegramWorkflow__step > span{ color: var(--telegram-blue); font-family: 'DM Mono', monospace; font-size: 12px; }
.telegramWorkflow__step h3{ margin-top: 30px; }

.telegramSection--integrations{ padding-top: 12px; }
.telegramIntegrationPanel{ display: grid; grid-template-columns: 1fr 0.85fr; gap: clamp(28px, 6vw, 76px); align-items: center; padding: clamp(24px, 5vw, 52px); border: 1px solid var(--outline); border-radius: 14px; background: var(--card); }
.telegramIntegrationPanel .sectionTitle{ margin: 12px 0; font-family: 'Space Grotesk', sans-serif; }
.telegramIntegrationPanel .muted{ max-width: 62ch; line-height: 1.75; }
.telegramIntegrationList{ display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.telegramIntegrationList li{ display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--outline); color: var(--ink); font-size: 13px; line-height: 1.5; }
.telegramIntegrationList li:last-child{ border-bottom: 0; }
.telegramIntegrationList span{ color: var(--telegram-blue); font-family: 'DM Mono', monospace; font-size: 10px; }

.telegramSection--requirements{ background: var(--alt); }
.telegramNotes{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 42px; max-width: 1000px; margin: 0 auto; }
.telegramNote{ padding-top: 16px; border-top: 1px solid var(--outline); }
.telegramNote > span{ color: var(--telegram-blue); font-family: 'DM Mono', monospace; font-size: 10px; }
.telegramNote h3{ margin: 12px 0 7px; font-size: 17px; }
.telegramNote p{ font-size: 13px; }

.telegramFaq{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-width: 1000px; margin: 0 auto; }
.telegramFaq .faq__item{ align-self: start; border-radius: 9px; }
.telegramFaq .faq__item summary{ font-family: 'Space Grotesk', sans-serif; }
.telegramFaq .faq__item p{ padding-top: 4px; color: var(--muted); line-height: 1.65; }

.telegramFinalCta{ padding-top: 22px; }
.telegramFinalCta__inner{ display: flex; max-width: 980px; flex-direction: column; align-items: center; padding: clamp(32px, 6vw, 64px); border: 1px solid rgba(34, 158, 217, 0.3); border-radius: 16px; background: linear-gradient(125deg, var(--telegram-blue-soft), var(--card)); text-align: center; }
.telegramFinalCta h2{ max-width: 18ch; margin: 14px 0 10px; font-family: 'Space Grotesk', sans-serif; font-size: clamp(30px, 4vw, 46px); line-height: 1.05; }
.telegramFinalCta p{ max-width: 62ch; margin: 0 0 22px; color: var(--muted); line-height: 1.7; }

html[data-style="stealth"] .telegramChat__body{ background: #0d1820; }
html[data-style="stealth"] .telegramChat__date{ background: rgba(255,255,255,.08); color: #a6b6c1; }
html[data-style="stealth"] .telegramBubble--bot{ background: #1b2a34; color: #e5edf2; }
html[data-style="stealth"] .telegramBubble--user{ background: #124c69; color: #e8f7ff; }
html[data-style="stealth"] .telegramBubble time{ color: #9db0bb; }
html[data-style="stealth"] .telegramChoices span,
html[data-style="stealth"] .telegramChat__input{ background: #1b2a34; color: #d7e3ea; }
html[data-style="galaxy"] .telegramFeature,
html[data-style="galaxy"] .telegramIntegrationPanel{ box-shadow: var(--shadow); }

@media (max-width: 900px){
  .telegramHero__grid{ grid-template-columns: minmax(0, 1fr) minmax(310px, .9fr); gap: 32px; }
  .telegramFeature:nth-child(1),
  .telegramFeature:nth-child(2),
  .telegramFeature:nth-child(6),
  .telegramFeature:nth-child(7){ grid-column: span 6; }
  .telegramFeature:nth-child(3),
  .telegramFeature:nth-child(4),
  .telegramFeature:nth-child(5){ grid-column: span 4; }
}

@media (max-width: 720px){
  .telegramHero{ padding: 54px 0 64px; }
  .telegramHero__grid{ grid-template-columns: 1fr; }
  .telegramHero__copy{ max-width: 620px; }
  .telegramHero .title{ max-width: 13ch; font-size: clamp(42px, 12vw, 62px); }
  .telegramChat{ justify-self: center; }
  .telegramFeatureGrid{ grid-template-columns: 1fr; }
  .telegramFeature:nth-child(n){ grid-column: auto; min-height: auto; }
  .telegramWorkflow,
  .telegramNotes,
  .telegramFaq,
  .telegramIntegrationPanel{ grid-template-columns: 1fr; }
  .telegramWorkflow__step{ min-height: auto; }
  .telegramWorkflow__step h3{ margin-top: 18px; }
  .telegramSection--integrations{ padding-top: 0; }
  .telegramHero__actions{ gap: 16px; }
}

@media (prefers-reduced-motion: reduce){
  .telegramFeature,
  .telegramWorkflow__step,
  .telegramIntegrationPanel,
  .telegramFinalCta__inner{ transition: none; }
}

@media (max-width: 720px){
  .completeWebMain .grid2{
    grid-template-columns: 1fr;
  }
}

.mobileAppService{
  --app-accent: #2fae91;
  --app-coral: #ef816b;
  --app-soft: rgba(47,174,145,.11);
  overflow: hidden;
}

.mobileAppHero{
  padding: clamp(58px,8vw,104px) 0 clamp(70px,9vw,110px);
  border-bottom: 1px solid var(--outline);
  background-image: linear-gradient(rgba(47,174,145,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(47,174,145,.04) 1px,transparent 1px);
  background-size: 40px 40px;
}

.mobileAppHero__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(330px,.78fr); align-items:center; gap:clamp(40px,8vw,108px); }
.mobileAppHero__copy{ max-width:650px; }
.mobileAppEyebrow,.mobileAppKicker{ display:inline-flex; align-items:center; gap:9px; color:var(--app-accent); font-family:'DM Mono',monospace; font-size:10px; font-weight:500; text-transform:uppercase; }
.mobileAppEyebrow i{ width:8px; height:8px; border-radius:2px; background:var(--app-coral); transform:rotate(45deg); }
.mobileAppHero .title{ max-width:12ch; margin-top:20px; font-family:'Space Grotesk',sans-serif; font-size:clamp(42px,6vw,74px); line-height:.98; }
.mobileAppHero .lead{ max-width:58ch; margin-top:20px; color:var(--muted); line-height:1.75; }
.mobileAppHero__actions{ display:flex; align-items:center; flex-wrap:wrap; gap:20px; margin-top:26px; }
.mobileAppTextLink{ color:var(--ink); font-size:13px; font-weight:800; text-decoration-color:var(--app-accent); text-underline-offset:5px; }
.mobileAppTextLink span{ margin-left:5px; color:var(--app-accent); }
.mobileAppHero__note{ max-width:48ch; margin:22px 0 0; color:var(--muted); font-size:11px; line-height:1.6; }

.mobileDevice{ width:min(100%,360px); justify-self:center; }
.mobileDevice__frame{ position:relative; width:100%; padding:10px; overflow:hidden; border:2px solid #37393e; border-radius:40px; background:#101114; box-shadow:0 32px 80px rgba(0,0,0,.34),inset 0 0 0 1px rgba(255,255,255,.1); }
.mobileDevice__island{ position:absolute; z-index:2; top:16px; left:50%; width:88px; height:22px; border-radius:14px; background:#101114; transform:translateX(-50%); }
.mobileDevice__status{ position:relative; z-index:1; display:flex; height:35px; align-items:center; justify-content:space-between; padding:0 14px; border-radius:30px 30px 0 0; background:#f6f7f4; color:#202622; font-size:9px; font-weight:850; }
.mobileAppScreen{ position:relative; display:flex; min-height:520px; flex-direction:column; overflow:hidden; border-radius:0 0 30px 30px; background:#f6f7f4; color:#202622; }
.mobileAppScreen__top{ display:flex; align-items:center; gap:9px; padding:10px 15px 16px; }
.mobileAppScreen__mark{ display:grid; width:32px; height:32px; place-items:center; border-radius:11px; background:#202622; color:#d9f16b; font-family:'Space Grotesk',sans-serif; font-weight:800; }
.mobileAppScreen__top b,.mobileAppScreen__top small{ display:block; }
.mobileAppScreen__top b{ font-size:10px; }
.mobileAppScreen__top small{ margin-top:2px; color:#7c827d; font-size:8px; }
.mobileAppScreen__menu{ margin-left:auto; color:#7c827d; font-size:15px; }
.mobileAppScreen__greeting{ padding:13px 17px 18px; }
.mobileAppScreen__greeting small{ color:#878e88; font-family:'DM Mono',monospace; font-size:8px; }
.mobileAppScreen__greeting h2{ margin:8px 0 3px; font-family:'Space Grotesk',sans-serif; font-size:25px; }
.mobileAppScreen__greeting p{ margin:0; color:#777e78; font-size:10px; }
.mobileAppScreen__featured{ display:flex; flex-direction:column; gap:6px; margin:0 14px; padding:15px; border-radius:14px; background:#e4f1e8; }
.mobileAppScreen__featured span{ color:#4d7d6d; font-family:'DM Mono',monospace; font-size:8px; }
.mobileAppScreen__featured strong{ font-family:'Space Grotesk',sans-serif; font-size:15px; }
.mobileAppScreen__featured small{ color:#68756d; font-size:9px; }
.mobileAppScreen__featured b{ display:flex; align-items:center; justify-content:space-between; margin-top:4px; color:#287e67; font-size:9px; }
.mobileAppScreen__featured i{ font-size:15px; font-style:normal; }
.mobileAppScreen__section{ display:flex; align-items:center; justify-content:space-between; margin:20px 17px 9px; }
.mobileAppScreen__section strong{ font-family:'Space Grotesk',sans-serif; font-size:12px; }
.mobileAppScreen__section span{ color:#368c75; font-size:8px; }
.mobileAppScreen__tiles{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:0 14px; }
.mobileAppScreen__tiles div{ display:flex; min-height:70px; flex-direction:column; justify-content:space-between; padding:10px; border:1px solid #e5e8e4; border-radius:10px; background:#fff; }
.mobileAppScreen__tiles b{ color:#348c75; font-size:16px; }
.mobileAppScreen__tiles span{ color:#555d57; font-size:8px; }
.mobileAppScreen__nav{ display:flex; justify-content:space-around; margin-top:auto; padding:13px 5px 15px; border-top:1px solid #e8eae7; background:#fff; }
.mobileAppScreen__nav span{ display:flex; flex-direction:column; align-items:center; gap:4px; color:#868c87; font-size:7px; }
.mobileAppScreen__nav b{ font-size:14px; }
.mobileAppScreen__nav .is-active{ color:#27866e; }
.mobileDevice__caption{ display:flex; align-items:center; justify-content:center; gap:8px; margin:14px 0 0; color:var(--muted); font-size:9px; text-align:center; }
.mobileDevice__caption span{ width:6px; height:6px; border-radius:50%; background:var(--app-coral); }

.mobileAppSection{ padding:clamp(64px,8vw,100px) 0; }
.mobileAppSection--capabilities,.mobileAppSection--considerations{ background:var(--alt); }
.mobileAppSection__heading{ max-width:770px; margin:0 auto 36px; text-align:center; }
.mobileAppSection__heading .sectionTitle{ max-width:18ch; margin:12px auto; font-family:'Space Grotesk',sans-serif; }
.mobileAppSection__heading .muted{ max-width:66ch; margin:0 auto; color:var(--muted); line-height:1.7; }
.mobileCapabilityGrid{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:12px; }
.mobileCapability{ min-width:0; min-height:220px; padding:clamp(19px,2.5vw,28px); overflow:hidden; border:1px solid var(--outline); border-radius:13px; background:var(--card); box-shadow:var(--shadow-sm); transition:opacity 650ms var(--revealEasing),transform 650ms var(--revealEasing),filter 650ms var(--revealEasing),border-color 220ms ease; }
.mobileCapability:nth-child(1){ grid-column:span 8; }
.mobileCapability:nth-child(2){ grid-column:span 4; }
.mobileCapability:nth-child(3){ grid-column:span 4; }
.mobileCapability:nth-child(4){ grid-column:span 8; }
.mobileCapability:nth-child(5){ grid-column:span 5; }
.mobileCapability:nth-child(6){ grid-column:span 7; }
.mobileCapability:nth-child(7){ grid-column:span 7; }
.mobileCapability:nth-child(8){ grid-column:span 5; }
.mobileCapability:nth-child(1){ transition-delay:0ms; }
.mobileCapability:nth-child(2){ transition-delay:90ms; }
.mobileCapability:nth-child(3){ transition-delay:180ms; }
.mobileCapability:nth-child(4){ transition-delay:270ms; }
.mobileCapability:nth-child(5){ transition-delay:360ms; }
.mobileCapability:nth-child(6){ transition-delay:450ms; }
.mobileCapability:nth-child(7){ transition-delay:540ms; }
.mobileCapability:nth-child(8){ transition-delay:630ms; }
.mobileCapability:hover{ border-color:rgba(47,174,145,.5); }
.mobileCapability--lead{ background:linear-gradient(135deg,var(--card),var(--app-soft)); }
.mobileCapability--wide{ min-height:190px; }
.mobileCapability--payment{ background-image:linear-gradient(140deg,rgba(239,129,107,.09),transparent 70%); }
.mobileCapability__index{ display:flex; align-items:center; gap:10px; color:var(--app-accent); font-family:'DM Mono',monospace; font-size:10px; }
.mobileCapability__index i{ color:var(--muted); font-size:8px; font-style:normal; }
.mobileCapability h3{ margin:20px 0 8px; font-family:'Space Grotesk',sans-serif; font-size:19px; line-height:1.2; }
.mobileCapability p{ margin:0; color:var(--muted); font-size:12px; line-height:1.75; }
.mobileCapability__route,.mobileCapability__data{ display:flex; flex-wrap:wrap; align-items:center; gap:9px; margin-top:19px; }
.mobileCapability__route span,.mobileCapability__data span{ padding:7px 8px; border:1px solid var(--outline); border-radius:5px; color:var(--ink); font-size:9px; }
.mobileCapability__route b,.mobileCapability__data b{ color:var(--app-coral); font-size:11px; }
.mobileCapability__chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:17px; }
.mobileCapability__chips span{ padding:5px 7px; border-radius:4px; background:var(--app-soft); color:var(--app-accent); font-family:'DM Mono',monospace; font-size:8px; }

.mobileApproachGrid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.mobileApproach{ display:flex; min-height:390px; flex-direction:column; align-items:flex-start; padding:24px; border:1px solid var(--outline); border-radius:11px; background:var(--card); }
.mobileApproach > span{ color:var(--app-accent); font-family:'DM Mono',monospace; font-size:9px; }
.mobileApproach h3{ margin:24px 0 9px; font-family:'Space Grotesk',sans-serif; font-size:21px; line-height:1.15; }
.mobileApproach p,.mobileApproach li{ color:var(--muted); font-size:11px; line-height:1.7; }
.mobileApproach p{ margin:0; }
.mobileApproach ul{ display:grid; gap:8px; margin:17px 0; padding-left:17px; }
.mobileApproach > b{ margin-top:auto; padding-top:13px; border-top:1px solid var(--outline); color:var(--ink); font-size:10px; line-height:1.5; }
.mobileApproach--featured{ border-color:rgba(47,174,145,.42); background:linear-gradient(150deg,var(--app-soft),var(--card) 58%); }
.mobileApproach__note{ max-width:80ch; margin:17px auto 0; color:var(--muted); font-size:10px; line-height:1.6; text-align:center; }

.mobileAppSection--process{ background:var(--alt); }
.mobileBuildLine{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.mobileBuildStep{ min-height:190px; padding:18px; border-top:2px solid var(--app-accent); background:linear-gradient(180deg,var(--app-soft),transparent 78%); }
.mobileBuildStep > span{ color:var(--app-accent); font-family:'DM Mono',monospace; font-size:11px; }
.mobileBuildStep h3{ margin:25px 0 8px; font-family:'Space Grotesk',sans-serif; font-size:17px; }
.mobileBuildStep p{ margin:0; color:var(--muted); font-size:11px; line-height:1.7; }

.mobileReleasePanel{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(26px,6vw,72px); align-items:center; padding:clamp(25px,5vw,50px); border:1px solid rgba(47,174,145,.35); border-radius:13px; background:linear-gradient(125deg,var(--app-soft),var(--card) 70%); }
.mobileReleasePanel .sectionTitle{ max-width:17ch; margin:12px 0; font-family:'Space Grotesk',sans-serif; }
.mobileReleasePanel .muted{ max-width:62ch; margin:0; color:var(--muted); line-height:1.75; }
.mobileReleaseList{ display:grid; margin:0; padding:0; list-style:none; }
.mobileReleaseList li{ display:flex; gap:12px; padding:13px 0; border-bottom:1px solid var(--outline); color:var(--ink); font-size:10px; line-height:1.55; }
.mobileReleaseList li:last-child{ border-bottom:0; }
.mobileReleaseList span{ color:var(--app-accent); font-family:'DM Mono',monospace; font-size:9px; }

.mobileConsiderations{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.mobileConsideration{ padding-top:15px; border-top:1px solid var(--outline); }
.mobileConsideration > span{ color:var(--app-coral); font-family:'DM Mono',monospace; font-size:9px; }
.mobileConsideration h3{ margin:12px 0 8px; font-family:'Space Grotesk',sans-serif; font-size:17px; line-height:1.25; }
.mobileConsideration p{ margin:0; color:var(--muted); font-size:11px; line-height:1.75; }
.mobileAppFaq{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; max-width:1000px; margin:0 auto; }
.mobileAppFaq .faq__item{ align-self:start; border-radius:8px; }
.mobileAppFaq .faq__item summary{ font-family:'Space Grotesk',sans-serif; }
.mobileAppFaq .faq__item p{ padding-top:4px; color:var(--muted); line-height:1.65; }
.mobileAppFinalCta{ padding-top:20px; }
.mobileAppFinalCta__inner{ display:flex; max-width:980px; flex-direction:column; align-items:center; padding:clamp(32px,6vw,60px); border:1px solid rgba(239,129,107,.38); border-radius:15px; background:linear-gradient(120deg,rgba(239,129,107,.08),var(--card)); text-align:center; }
.mobileAppFinalCta h2{ max-width:20ch; margin:14px 0 10px; font-family:'Space Grotesk',sans-serif; font-size:clamp(30px,4vw,46px); line-height:1.05; }
.mobileAppFinalCta p{ max-width:62ch; margin:0 0 22px; color:var(--muted); line-height:1.7; }

html[data-style="galaxy"] .mobileCapability,
html[data-style="galaxy"] .mobileApproach{ box-shadow:var(--shadow); }

@media (max-width: 1080px){
  .mobileAppHero__grid{ grid-template-columns:minmax(0,1fr) minmax(300px,.75fr); gap:32px; }
  .mobileCapability:nth-child(n){ grid-column:span 6; }
  .mobileApproach{ padding:19px; }
}

@media (max-width: 720px){
  .mobileAppHero{ padding:52px 0 64px; }
  .mobileAppHero__grid{ grid-template-columns:1fr; }
  .mobileAppHero .title{ max-width:13ch; font-size:clamp(42px,12vw,62px); }
  .mobileDevice{ width:min(100%,340px); }
  .mobileCapabilityGrid,.mobileApproachGrid,.mobileBuildLine,.mobileConsiderations,.mobileAppFaq,.mobileReleasePanel{ grid-template-columns:1fr; }
  .mobileCapability:nth-child(n){ grid-column:auto; min-height:auto; }
  .mobileApproach{ min-height:0; }
  .mobileBuildStep{ min-height:0; }
  .mobileBuildStep h3{ margin-top:15px; }
}

@media (prefers-reduced-motion: reduce){
  .mobileCapability,.mobileApproach,.mobileBuildStep,.mobileReleasePanel,.mobileFinalCta__inner{ transition:none; }
}
