/* Detailed index palette pass. Screenshots are used only as color references. */
:root{
  --tx-red:#5A2132;
  --tx-red-rgb:90,33,50;
  --tx-white:#EFE9E9;
  --tx-white-rgb:239,233,233;
  --tx-teal:#035352;
  --tx-teal-rgb:3,83,82;
  --tx-yellow:#F3E8BC;
  --tx-yellow-rgb:243,232,188;
  --tx-blue:#1E223D;
  --tx-blue-rgb:30,34,61;
  --tx-orange:#F54F1B;
  --tx-orange-rgb:245,79,27;
  --tx-palette-line:rgba(var(--tx-yellow-rgb),.13);
  --tx-palette-dark:#090a0d;
}

body{
  background:
    radial-gradient(circle at 8% 10%,rgba(var(--tx-red-rgb),.2),transparent 30%),
    radial-gradient(circle at 92% 20%,rgba(var(--tx-teal-rgb),.22),transparent 28%),
    radial-gradient(circle at 50% 96%,rgba(var(--tx-blue-rgb),.3),transparent 34%),
    var(--tx-palette-dark);
}

.site-header{
  border-bottom-color:rgba(var(--tx-yellow-rgb),.12);
  background:linear-gradient(180deg,rgba(var(--tx-blue-rgb),.88),rgba(8,9,12,.76));
}

.site-header::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-1px;
  width:min(1120px,88vw);
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,rgba(var(--tx-red-rgb),.5),rgba(var(--tx-yellow-rgb),.42),rgba(var(--tx-teal-rgb),.5),transparent);
  pointer-events:none;
}

.brand span span,
.desktop-nav a[aria-current="page"],
.tx-menu-brand span span{
  color:var(--tx-orange);
}

.desktop-nav a:hover,
.footer-grid a:hover,
.footer-bottom a:hover{
  color:var(--tx-yellow);
}

.desktop-nav a[aria-current="page"]::after{
  background:linear-gradient(90deg,var(--tx-orange),var(--tx-yellow));
}

.button-primary{
  background:linear-gradient(135deg,var(--tx-orange),#d94018 58%,var(--tx-red));
  color:#130908;
  box-shadow:0 18px 42px rgba(var(--tx-orange-rgb),.22),0 0 0 1px rgba(var(--tx-yellow-rgb),.16) inset;
}

.button-primary:hover{
  box-shadow:0 22px 54px rgba(var(--tx-orange-rgb),.28),0 0 0 1px rgba(var(--tx-yellow-rgb),.2) inset;
}

.button-ghost,
.desktop-cta{
  border-color:rgba(var(--tx-yellow-rgb),.22);
  background:rgba(var(--tx-white-rgb),.045);
  color:var(--tx-white);
}

.button-ghost:hover,
.desktop-cta:hover{
  border-color:rgba(var(--tx-yellow-rgb),.4);
  background:rgba(var(--tx-teal-rgb),.16);
}

.hero{
  background:
    radial-gradient(circle at 18% 18%,rgba(var(--tx-red-rgb),.32),transparent 30%),
    radial-gradient(circle at 78% 18%,rgba(var(--tx-teal-rgb),.3),transparent 31%),
    linear-gradient(180deg,var(--tx-blue) 0%,#0d0e12 82%);
}

.hero-grid-bg{
  opacity:.58;
  background-image:
    linear-gradient(rgba(var(--tx-yellow-rgb),.065) 1px,transparent 1px),
    linear-gradient(90deg,rgba(var(--tx-teal-rgb),.1) 1px,transparent 1px);
}

.hero-glow-one{background:rgba(var(--tx-red-rgb),.3)}
.hero-glow-two{background:rgba(var(--tx-teal-rgb),.26)}

.eyebrow,
.section-index,
.prompt-recipes__kicker,
.pricing-uses-cap,
.insight-links-cap,
.platform-modes-cap{
  color:var(--tx-yellow);
}

.eyebrow span,
.section-index::before,
.prompt-recipes__kicker::before{
  background:var(--tx-orange);
  box-shadow:0 0 16px rgba(var(--tx-orange-rgb),.55);
}

.hero-minimal-copy h1 em,
.hero-workflow-strip strong,
.hero-trust-line strong{
  color:var(--tx-yellow);
}

.hero-minimal{
  padding-top:calc(var(--header) + clamp(42px,6.4vw,86px));
  padding-bottom:clamp(44px,5vw,72px);
}

.hero-minimal-shell{
  min-height:calc(100svh - var(--header) - clamp(34px,4vw,58px));
  gap:clamp(14px,2vw,24px);
}

.hero-minimal-copy{
  max-width:min(1120px,94vw);
}

.hero-minimal-copy .eyebrow{
  margin-bottom:clamp(10px,1.15vw,14px);
}

.hero-minimal-copy h1{
  width:min(100%,980px);
  max-width:980px;
  font-size:clamp(48px,4.75vw,74px);
  line-height:.96;
  letter-spacing:-.055em;
}

.hero-workflow-strip{
  position:relative;
  justify-self:start;
  width:auto;
  max-width:min(100%,560px);
  margin:clamp(8px,1.15vw,13px) 0 0;
  padding:0 0 7px 16px;
  border:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  font-size:clamp(11px,.86vw,13px);
  line-height:1.15;
  overflow:visible;
  isolation:isolate;
}

.hero-workflow-strip::before{
  content:"";
  position:absolute;
  left:0;
  top:.12em;
  width:7px;
  height:7px;
  border-radius:999px;
  background:var(--tx-orange);
  box-shadow:0 0 16px rgba(var(--tx-orange-rgb),.72);
  animation:heroWorkflowPulse 2.6s ease-in-out infinite;
}

.hero-workflow-strip::after{
  content:"";
  position:absolute;
  left:16px;
  right:0;
  bottom:0;
  height:1px;
  background:linear-gradient(90deg,var(--tx-orange),rgba(var(--tx-yellow-rgb),.9),rgba(var(--tx-teal-rgb),.95),transparent);
  transform-origin:left center;
  animation:heroWorkflowTrace 4.4s ease-in-out infinite;
}

.hero-workflow-strip span{
  flex:0 0 auto;
  color:rgba(var(--tx-white-rgb),.58);
  font-size:9px;
  letter-spacing:.16em;
}

.hero-workflow-strip strong{
  min-width:16ch;
  max-width:30ch;
  background:linear-gradient(100deg,var(--tx-yellow),var(--tx-orange) 34%,#8be5dd 68%,var(--tx-yellow));
  background-size:240% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:left;
  animation:heroWorkflowText 5.8s ease-in-out infinite;
}

.hero-workflow-strip strong.is-swapping{
  opacity:0;
  filter:blur(2px);
  transform:translateY(4px) scale(.98);
}

@keyframes heroWorkflowPulse{
  0%,100%{transform:scale(.85);opacity:.75}
  45%{transform:scale(1.25);opacity:1}
}

@keyframes heroWorkflowTrace{
  0%,100%{transform:scaleX(.32);opacity:.52}
  48%{transform:scaleX(1);opacity:1}
}

@keyframes heroWorkflowText{
  0%,100%{background-position:0% 50%;filter:drop-shadow(0 0 0 rgba(var(--tx-yellow-rgb),0))}
  50%{background-position:100% 50%;filter:drop-shadow(0 0 13px rgba(var(--tx-yellow-rgb),.2))}
}

.hero-minimal-copy p[data-hero-subcopy]{
  max-width:min(680px,90vw);
  margin-top:clamp(10px,1.2vw,14px);
  padding:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  font-size:clamp(14px,1vw,16px);
  line-height:1.48;
}

.hero-minimal-copy p.is-typed{
  text-shadow:0 2px 16px rgba(0,0,0,.82);
}

.hero-card-deck{
  width:100vw;
  max-width:none;
  margin:clamp(14px,1.8vw,22px) calc(50% - 50vw) 0;
}

.hero-card-deck::after{
  right:0;
  width:clamp(54px,8vw,120px);
  background:none;
  opacity:0;
}

.hero-card-deck::before{
  background:none;
  opacity:0;
}

.hero-product-surface{
  width:100vw;
  max-width:none;
  gap:clamp(14px,1.45vw,22px);
  padding:8px clamp(18px,4vw,72px) 18px;
  scroll-padding-inline:clamp(18px,4vw,72px);
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.hero-cap-card{
  min-height:clamp(240px,25vh,340px);
  flex-basis:clamp(280px,20vw,360px);
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.22);
  background:
    radial-gradient(circle at 18% 10%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.24),transparent 44%),
    radial-gradient(circle at 82% 86%,rgba(var(--tx-yellow-rgb),.11),transparent 42%),
    linear-gradient(145deg,rgba(var(--tx-white-rgb),.035),rgba(var(--tx-teal-rgb),.16));
  box-shadow:0 20px 48px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.1),inset 0 1px 0 rgba(var(--tx-white-rgb),.08);
}

.hero-cap-card--feature{
  min-height:clamp(280px,29vh,370px);
  flex-basis:clamp(340px,29vw,510px);
}

.hero-cap-card--video{
  min-height:clamp(300px,31vh,390px);
  flex-basis:clamp(390px,34vw,570px);
}

.hero-cap-card::before{
  opacity:.95;
  background:
    radial-gradient(circle at 14% 12%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.22),transparent 36%),
    radial-gradient(circle at 86% 18%,rgba(var(--tx-yellow-rgb),.1),transparent 34%),
    radial-gradient(circle at 72% 86%,rgba(var(--tx-red-rgb),.1),transparent 40%);
}

.hero-cap-card::after{
  background:linear-gradient(180deg,rgba(var(--tx-blue-rgb),.01) 12%,rgba(var(--tx-teal-rgb),.12) 52%,rgba(var(--tx-blue-rgb),.34) 100%);
}

.hero-cap-card:hover,
.hero-cap-card:focus-visible{
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.22);
  background:
    radial-gradient(circle at 18% 10%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.24),transparent 44%),
    radial-gradient(circle at 82% 86%,rgba(var(--tx-yellow-rgb),.11),transparent 42%),
    linear-gradient(145deg,rgba(var(--tx-white-rgb),.035),rgba(var(--tx-teal-rgb),.16));
  box-shadow:0 20px 48px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.1),inset 0 1px 0 rgba(var(--tx-white-rgb),.08);
}

.hero-cap-card--print{
  --card-accent-rgb:var(--tx-yellow-rgb);
  --scene-a:rgba(var(--tx-yellow-rgb),.2);
  --scene-b:rgba(var(--tx-teal-rgb),.24);
  --scene-c:rgba(var(--tx-red-rgb),.16);
}

.hero-cap-card--refine{
  --card-accent-rgb:var(--tx-teal-rgb);
  --scene-a:rgba(var(--tx-teal-rgb),.28);
  --scene-b:rgba(var(--tx-red-rgb),.18);
  --scene-c:rgba(var(--tx-yellow-rgb),.15);
}

.hero-cap-card--export{
  --card-accent-rgb:var(--tx-orange-rgb);
  --scene-a:rgba(var(--tx-orange-rgb),.2);
  --scene-b:rgba(var(--tx-teal-rgb),.24);
  --scene-c:rgba(var(--tx-yellow-rgb),.16);
}

.hero-card-media.hero-scene{
  background:
    radial-gradient(circle at 20% 18%,var(--scene-a,rgba(var(--tx-teal-rgb),.22)),transparent 36%),
    radial-gradient(circle at 86% 28%,var(--scene-b,rgba(var(--tx-yellow-rgb),.16)),transparent 40%),
    radial-gradient(circle at 48% 92%,var(--scene-c,rgba(var(--tx-red-rgb),.12)),transparent 48%),
    linear-gradient(145deg,rgba(var(--tx-blue-rgb),.54),rgba(var(--tx-teal-rgb),.14));
}

.hero-card-media.hero-scene::before{
  background-image:
    linear-gradient(rgba(var(--tx-yellow-rgb),.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(var(--tx-teal-rgb),.09) 1px,transparent 1px);
  opacity:.92;
}

.hero-card-media.hero-scene::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(120deg,transparent 20%,rgba(var(--tx-white-rgb),.045) 42%,transparent 64%),
    radial-gradient(circle at 50% 36%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.16),transparent 38%);
  mix-blend-mode:screen;
}

.hero-scene .fxc-stage{
  z-index:2;
  filter:saturate(1.28) contrast(1.08) drop-shadow(0 0 18px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.2));
}

.hero-card-media model-viewer,
.hero-model-poster,
.hero-scene .fxc-stage{
  transform-origin:center;
  will-change:transform,filter,opacity;
  transition:transform .58s cubic-bezier(.16,1,.3,1),filter .58s ease,opacity .58s ease;
}

.hero-model-stage:hover model-viewer,
.hero-model-stage:focus-within model-viewer{
  opacity:.96;
  filter:saturate(1.28) contrast(1.2) brightness(1.18) drop-shadow(0 20px 42px rgba(var(--tx-teal-rgb),.24));
  transform:scale(.94);
}

.hero-model-stage:hover .hero-model-poster,
.hero-model-stage:focus-within .hero-model-poster{
  opacity:.98;
  filter:saturate(1.42) contrast(1.62) brightness(2.35) drop-shadow(0 20px 42px rgba(var(--tx-teal-rgb),.26));
  transform:scale(1.04);
}

.hero-cap-card--model{
  --hero-model-x:76%;
  --hero-model-w:54%;
  /* match the video feature card's footprint — 48vw made this card dwarf
     the rest of the deck and spill past the fold */
  flex-basis:clamp(480px,36vw,620px);
  min-height:420px;
}

.hero-cap-card--model .hero-model-stage{
  background:
    radial-gradient(circle at 68% 30%,rgba(var(--tx-yellow-rgb),.2),transparent 28%),
    radial-gradient(circle at 78% 56%,rgba(var(--tx-teal-rgb),.26),transparent 44%),
    linear-gradient(90deg,rgba(5,7,10,.74) 0%,rgba(5,7,10,.56) 34%,rgba(var(--tx-blue-rgb),.34) 64%,rgba(var(--tx-teal-rgb),.16) 100%);
}

.hero-cap-card--model .hero-model-stage::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(4,6,10,.78) 0%,rgba(4,6,10,.6) 40%,transparent 70%),
    radial-gradient(circle at 20% 72%,rgba(var(--tx-red-rgb),.1),transparent 36%);
}

.hero-cap-card--model .hero-model-stage::after{
  left:var(--hero-model-x);
  bottom:16%;
  width:42%;
  height:13%;
  border-color:rgba(var(--tx-yellow-rgb),.32);
  background:radial-gradient(ellipse at 50% 50%,rgba(var(--tx-yellow-rgb),.18),rgba(var(--tx-teal-rgb),.08) 58%,transparent 72%);
  box-shadow:0 0 30px rgba(var(--tx-teal-rgb),.16),inset 0 0 18px rgba(var(--tx-yellow-rgb),.08);
}

.hero-cap-card--model .hero-model-stage model-viewer{
  top:-4%;
  right:0;
  bottom:8%;
  left:auto;
  width:var(--hero-model-w);
  height:98%;
  opacity:.96;
  background:transparent;
  filter:saturate(1.2) contrast(1.12) brightness(1.1) drop-shadow(0 22px 38px rgba(var(--tx-teal-rgb),.2));
}

.hero-cap-card--model .hero-model-poster{
  inset:-1% 1% 12% auto;
  z-index:1;
  width:var(--hero-model-w);
  height:88%;
  object-fit:contain;
  object-position:center;
  opacity:.74;
  filter:saturate(1.16) contrast(1.08) brightness(.92) drop-shadow(0 18px 34px rgba(var(--tx-teal-rgb),.2));
  mix-blend-mode:normal;
  transform:scale(.98);
}

.hero-cap-card--model .hero-model-stage.has-model-source .hero-model-poster,
.hero-cap-card--model .hero-model-poster[hidden]{
  display:none !important;
}

/* once the live model is on stage, the poster leaves entirely — a ghosted
   poster of a DIFFERENT asset read as two models rendering at once */
.hero-cap-card--model .hero-model-stage.is-model-loaded .hero-model-poster{
  opacity:0;
  visibility:hidden;
}

.hero-cap-card--model .hero-model-stage[data-model-fit="wide"]{
  --hero-model-x:77%;
  --hero-model-w:52%;
}

.hero-cap-card--model .hero-model-stage[data-model-fit="product"]{
  --hero-model-x:78%;
  --hero-model-w:50%;
}

.hero-cap-card--model .hero-model-stage[data-model-fit="character"]{
  --hero-model-x:76%;
  --hero-model-w:52%;
}

.hero-cap-card--model .hero-model-hologram--one{
  left:64%;
  top:15%;
  width:20%;
  height:46%;
}

.hero-cap-card--model .hero-model-hologram--two{
  right:7%;
  top:28%;
  width:13%;
  height:24%;
}

.hero-cap-card--model .hero-model-hologram--three{
  left:51%;
  top:33%;
  width:12%;
  height:20%;
}

.hero-cap-card--model .hero-cap-kicker,
.hero-cap-card--model strong,
.hero-cap-card--model p{
  position:relative;
  z-index:4;
}

.hero-cap-card--model strong{
  max-width:12ch;
}

.hero-cap-card--model p{
  max-width:28ch;
}

.hero-cap-card--model .hero-media-chip{
  right:16px;
  top:16px;
  z-index:4;
  background:rgba(var(--tx-blue-rgb),.58);
  color:var(--tx-yellow);
}

.hero-scene:hover .fxc-stage,
.hero-scene:focus-within .fxc-stage{
  opacity:1;
  filter:saturate(1.42) contrast(1.12) drop-shadow(0 0 22px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.26));
  transform:scale(.94);
}

.hero-card-media.hero-scene::after{
  transition:opacity .58s ease;
}

.hero-card-media.hero-scene:hover::after,
.hero-card-media.hero-scene:focus-within::after{
  opacity:.68;
}

.fxc-hud{
  z-index:3;
}

.hud-chip{
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.34);
  background:rgba(var(--tx-blue-rgb),.42);
  color:var(--tx-yellow);
  box-shadow:0 10px 28px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.12),inset 0 1px 0 rgba(var(--tx-white-rgb),.08);
}

.hud-chip b{
  color:#8be5dd;
}

.hero-command-wrap{
  margin-bottom:clamp(12px,2.3vw,34px);
}

.hero-promptbar,
body.hero-command-docked .hero-promptbar{
  border:1px solid rgba(var(--tx-yellow-rgb),.16);
  background:linear-gradient(135deg,rgba(var(--tx-white-rgb),.072),rgba(var(--tx-teal-rgb),.09));
  box-shadow:0 24px 76px rgba(0,0,0,.34),0 0 0 1px rgba(var(--tx-red-rgb),.11) inset;
}

.prompt-icon,
.prompt-ask{
  color:var(--tx-yellow);
  background:rgba(var(--tx-teal-rgb),.22);
}

.prompt-generate,
.prompt-send{
  background:linear-gradient(135deg,var(--tx-orange),var(--tx-yellow));
  color:#160c08;
}

.assistant-prompts button:hover,
.assistant-prompts button:focus-visible{
  border-color:rgba(var(--tx-yellow-rgb),.32);
  background:rgba(var(--tx-red-rgb),.18);
}

.assistant-answer{
  border-color:rgba(var(--tx-yellow-rgb),.18);
  background:linear-gradient(145deg,rgba(var(--tx-blue-rgb),.96),rgba(8,9,12,.96));
  box-shadow:0 24px 64px rgba(var(--tx-red-rgb),.22);
}

.hero-cap-card,
.stage-window,
.prompt-recipes,
.ai-workflow-card,
.proof-grid .ls-card{
  border-color:var(--tx-palette-line);
  background:
    radial-gradient(circle at 18% 0%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.12),transparent 36%),
    linear-gradient(180deg,rgba(var(--tx-white-rgb),.055),rgba(var(--tx-white-rgb),.018));
}

.hero-cap-card:nth-child(1),
.prompt-recipe:nth-child(1),
.feature-card:nth-child(1),
.ai-workflow-card:nth-child(1),
.platform-card:nth-child(1){--card-accent-rgb:var(--tx-teal-rgb)}
.hero-cap-card:nth-child(2),
.prompt-recipe:nth-child(2),
.feature-card:nth-child(2),
.ai-workflow-card:nth-child(2),
.platform-card:nth-child(2){--card-accent-rgb:var(--tx-yellow-rgb)}
.hero-cap-card:nth-child(3),
.prompt-recipe:nth-child(3),
.feature-card:nth-child(3),
.ai-workflow-card:nth-child(3),
.platform-card:nth-child(3){--card-accent-rgb:var(--tx-orange-rgb)}
.hero-cap-card:nth-child(4),
.prompt-recipe:nth-child(4),
.feature-card:nth-child(4),
.ai-workflow-card:nth-child(4),
.platform-card:nth-child(4){--card-accent-rgb:var(--tx-red-rgb)}
.feature-card:nth-child(5),
.platform-card:nth-child(5){--card-accent-rgb:var(--tx-blue-rgb)}
.feature-card:nth-child(6),
.platform-card:nth-child(6){--card-accent-rgb:var(--tx-teal-rgb)}

.hero-cap-kicker,
.hero-cap-icon,
.hero-media-chip,
.hud-chip,
.ai-workflow-card__tag{
  color:var(--tx-yellow);
  background:rgba(var(--tx-teal-rgb),.18);
}

.hero-card-arrow,
.feature-link span,
.platform-link span,
.proof-viewall span,
.insight-viewall span,
.ql-cta,
.bug-link{
  color:var(--tx-orange);
}

.prompt-recipe{
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.22);
}

.prompt-recipe::before{
  background:radial-gradient(circle at 16% 0%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.18),transparent 42%);
}

.prompt-recipe:hover,
.prompt-recipe:focus-visible,
.prompt-recipe.is-active{
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.42);
  box-shadow:0 18px 36px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.12);
}

.prompt-recipe__icon,
.prompt-recipe--model .prompt-recipe__icon,
.prompt-recipe--video .prompt-recipe__icon,
.prompt-recipe--reference .prompt-recipe__icon{
  color:rgb(var(--card-accent-rgb,var(--tx-teal-rgb)));
  background:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.16);
}

.prompt-recipe small{
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.24);
  color:var(--tx-yellow);
  background:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.09);
}

.proof,
.capabilities,
.demo-section,
.platform,
.info-landing{
  background:
    radial-gradient(circle at 12% 0%,rgba(var(--tx-yellow-rgb),.48),transparent 30%),
    radial-gradient(circle at 88% 12%,rgba(var(--tx-teal-rgb),.12),transparent 34%),
    var(--tx-white);
}

main > .proof.section-pad{
  padding-bottom:clamp(22px,3.2vw,36px);
}

main > .capabilities.section-pad{
  padding-top:clamp(28px,4.2vw,46px);
}

.home-community-resources,
.comm-cta-centered{
  margin-bottom:0;
}

.proof .section-index,
.capabilities .section-index,
.demo-section .section-index,
.platform .section-index,
.info-landing .section-index,
.insight-feed .section-index{
  color:var(--tx-red);
}

.proof-live{
  border-color:rgba(var(--tx-teal-rgb),.2);
  background:rgba(var(--tx-teal-rgb),.08);
  color:var(--tx-teal);
}

.proof-live i{
  background:var(--tx-teal);
  box-shadow:0 0 14px rgba(var(--tx-teal-rgb),.45);
}

.resource-tabs{
  margin:0 0 32px;
  padding:10px 12px 14px;
  overflow:visible;
}

.resource-tab,
.quick-link-card,
.info-link-card{
  border-color:rgba(var(--tx-red-rgb),.12);
  background:rgba(255,255,255,.7);
  box-shadow:0 18px 42px rgba(var(--tx-blue-rgb),.07);
}

.resource-tab:nth-child(1),
.quick-link-card:nth-child(1),
.info-link-card:nth-child(1){--card-accent-rgb:var(--tx-red-rgb)}
.resource-tab:nth-child(2),
.quick-link-card:nth-child(2),
.info-link-card:nth-child(2){--card-accent-rgb:var(--tx-teal-rgb)}
.resource-tab:nth-child(3){--card-accent-rgb:var(--tx-yellow-rgb)}
.resource-tab:nth-child(4){--card-accent-rgb:var(--tx-orange-rgb)}

.resource-tab i,
.ql-icon,
.info-link-card i{
  color:rgb(var(--card-accent-rgb,var(--tx-red-rgb)));
  background:rgba(var(--card-accent-rgb,var(--tx-red-rgb)),.1);
}

.resource-tab:hover,
.resource-tab:focus-visible,
.quick-link-card:hover,
.info-link-card:hover{
  border-color:rgba(var(--card-accent-rgb,var(--tx-red-rgb)),.34);
  box-shadow:0 22px 52px rgba(var(--card-accent-rgb,var(--tx-red-rgb)),.13);
}

.resource-modal{
  z-index:100200;
  background:rgba(4,5,9,.64);
  backdrop-filter:blur(16px);
}

.resource-modal-card{
  border-color:rgba(var(--tx-yellow-rgb),.18);
  background:
    radial-gradient(circle at 12% 0%,rgba(var(--modal-accent-rgb,var(--tx-teal-rgb)),.18),transparent 36%),
    linear-gradient(145deg,#141213 0%,#121522 54%,var(--tx-blue) 100%);
  color:var(--tx-white);
  opacity:1;
}

#promptTipsModal{--modal-accent-rgb:var(--tx-red-rgb)}
#apiSnippetsModal{--modal-accent-rgb:var(--tx-teal-rgb)}
#showcaseModal{--modal-accent-rgb:var(--tx-yellow-rgb)}
#bugReportsModal{--modal-accent-rgb:var(--tx-orange-rgb)}

.resource-modal-header{
  border-bottom-color:rgba(var(--tx-yellow-rgb),.14);
}

.resource-modal-header i,
.tip-number,
.snippet-lang,
.showcase-author,
.bug-icon{
  color:rgb(var(--modal-accent-rgb,var(--tx-teal-rgb)));
  background:rgba(var(--modal-accent-rgb,var(--tx-teal-rgb)),.14);
}

.close-x{
  border-color:rgba(var(--tx-yellow-rgb),.14);
  background:rgba(var(--tx-white-rgb),.065);
  color:var(--tx-white);
}

.close-x:hover{
  color:var(--tx-yellow);
  background:rgba(var(--tx-red-rgb),.18);
}

.tip-card,
.snippet-card,
.showcase-item,
.bug-card,
.bug-template,
.panel-footer{
  border-color:rgba(var(--tx-yellow-rgb),.13);
  background:rgba(var(--tx-white-rgb),.045);
}

.tip-example,
.snippet-code{
  border-color:rgba(var(--tx-teal-rgb),.24);
  background:rgba(0,0,0,.2);
}

.compare-good{
  color:#bfe8d5;
  background:rgba(var(--tx-teal-rgb),.16);
}

.compare-bad{
  color:#ffc6b8;
  background:rgba(var(--tx-red-rgb),.18);
}

.mini-tag,
.copy-btn{
  border-color:rgba(var(--tx-yellow-rgb),.18);
  background:rgba(var(--tx-yellow-rgb),.08);
  color:var(--tx-yellow);
}

.showcase-preview{
  background:
    radial-gradient(circle at 50% 28%,rgba(var(--modal-accent-rgb,var(--tx-yellow-rgb)),.2),transparent 54%),
    rgba(var(--tx-blue-rgb),.54);
  color:var(--tx-yellow);
}

.footer-tip i,
.bug-link:hover{
  color:var(--tx-yellow);
}

/* Community resource modals ---------------------------------------------- */
.resource-modal{
  padding:clamp(14px,3vw,34px);
  background:
    radial-gradient(900px 620px at 12% 8%,rgba(var(--tx-red-rgb),.18),transparent 62%),
    radial-gradient(880px 640px at 88% 12%,rgba(var(--tx-teal-rgb),.18),transparent 64%),
    rgba(7,8,10,.66);
  -webkit-backdrop-filter:blur(18px) saturate(116%);
  backdrop-filter:blur(18px) saturate(116%);
}

.resource-modal-card{
  --modal-accent:var(--tx-teal-rgb);
  --modal-ink:rgb(var(--modal-accent));
  width:min(94vw,1180px);
  max-height:min(780px,86vh);
  border:1px solid rgba(var(--modal-accent),.18);
  border-radius:30px;
  background:
    radial-gradient(760px 320px at 8% 0%,rgba(var(--modal-accent),.14),transparent 58%),
    radial-gradient(740px 360px at 100% 2%,rgba(var(--tx-yellow-rgb),.18),transparent 62%),
    linear-gradient(135deg,rgba(255,255,255,.9),rgba(var(--tx-white-rgb),.94) 46%,rgba(var(--tx-yellow-rgb),.28));
  box-shadow:0 36px 110px rgba(10,8,10,.32);
  color:#151111;
}

.resource-modal-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    linear-gradient(rgba(var(--tx-blue-rgb),.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(var(--tx-blue-rgb),.035) 1px,transparent 1px);
  background-size:74px 74px;
  pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.7),transparent 78%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,.7),transparent 78%);
}

#promptTipsModal{--modal-accent:var(--tx-red-rgb);--modal-ink:var(--tx-red)}
#apiSnippetsModal{--modal-accent:var(--tx-teal-rgb);--modal-ink:var(--tx-teal)}
#showcaseModal{--modal-accent:var(--tx-yellow-rgb);--modal-ink:var(--tx-teal)}
#bugReportsModal{--modal-accent:var(--tx-orange-rgb);--modal-ink:var(--tx-orange)}

.resource-modal-card .close-x{
  top:22px;
  right:22px;
  width:46px;
  height:46px;
  border:1px solid rgba(var(--tx-blue-rgb),.12);
  border-radius:14px;
  background:rgba(255,255,255,.52);
  box-shadow:none;
  color:var(--tx-blue);
}

.resource-modal-card .close-x:hover,
.resource-modal-card .close-x:focus-visible{
  border-color:rgba(var(--modal-accent),.42);
  background:rgba(var(--modal-accent),.1);
  color:var(--modal-ink);
  outline:none;
}

.resource-modal-header{
  position:relative;
  gap:16px;
  padding:clamp(24px,3vw,36px) clamp(24px,3.6vw,44px) clamp(18px,2.4vw,28px);
  border-bottom:1px solid rgba(var(--tx-blue-rgb),.1);
}

.resource-modal-header::after{
  content:"";
  position:absolute;
  left:clamp(24px,3.6vw,44px);
  right:clamp(24px,3.6vw,44px);
  bottom:-1px;
  height:2px;
  background:linear-gradient(90deg,rgb(var(--modal-accent)),rgba(var(--tx-yellow-rgb),.7),transparent);
}

.resource-modal-header i{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  border:1px solid rgba(var(--modal-accent),.18);
  border-radius:18px;
  background:rgba(var(--modal-accent),.12);
  color:var(--modal-ink);
  font-size:24px;
}

.resource-modal-header h4{
  color:var(--tx-blue);
  font-family:"Space Grotesk",Inter,system-ui,sans-serif;
  font-size:clamp(32px,4vw,56px);
  font-weight:850;
  letter-spacing:-.055em;
}

.resource-modal-body{
  position:relative;
  padding:clamp(22px,3vw,36px) clamp(24px,3.6vw,44px) clamp(28px,3.8vw,48px);
  color:rgba(var(--tx-blue-rgb),.68);
}

.resource-modal .panel-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.resource-modal .tip-card,
.resource-modal .showcase-item,
.resource-modal .bug-card,
.resource-modal .bug-template,
.resource-modal .snippet-card,
.resource-modal .panel-footer{
  border:1px solid rgba(var(--modal-accent),.15);
  border-radius:18px;
  background:rgba(255,255,255,.48);
  box-shadow:none;
}

.resource-modal .tip-card{
  min-height:188px;
  padding:18px;
}

.resource-modal .tip-card:hover,
.resource-modal .showcase-item:hover,
.resource-modal .bug-card:hover{
  transform:translateY(-2px);
  border-color:rgba(var(--modal-accent),.32);
  background:rgba(255,255,255,.68);
}

.resource-modal .tip-header{
  align-items:flex-start;
}

.resource-modal .tip-number,
.resource-modal .snippet-lang,
.resource-modal .showcase-author{
  background:rgba(var(--modal-accent),.12);
  color:var(--modal-ink);
}

.resource-modal h4,
.resource-modal h5,
.resource-modal strong{
  color:#151111;
}

.resource-modal .tip-card p,
.resource-modal .bug-card p,
.resource-modal .bug-template li,
.resource-modal .showcase-intro,
.resource-modal .bug-intro,
.resource-modal .footer-tip{
  color:rgba(var(--tx-blue-rgb),.68);
}

.resource-modal .tip-example{
  border:1px solid rgba(var(--tx-red-rgb),.1);
  border-radius:12px;
  background:rgba(var(--tx-white-rgb),.56);
}

.resource-modal .example-label{
  color:rgba(var(--tx-red-rgb),.8);
}

.resource-modal code{
  color:var(--tx-teal);
}

.resource-modal .compare-bad{
  background:rgba(var(--tx-red-rgb),.1);
  color:var(--tx-red);
}

.resource-modal .compare-good,
.resource-modal .mini-tag{
  border:1px solid rgba(var(--tx-teal-rgb),.13);
  background:rgba(var(--tx-teal-rgb),.1);
  color:var(--tx-teal);
}

.resource-modal .snippet-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
}

.resource-modal .snippet-card{
  display:grid;
  grid-template-rows:auto 1fr;
  overflow:hidden;
  background:linear-gradient(180deg,#141524,var(--tx-blue));
}

.resource-modal .snippet-header{
  border-bottom-color:rgba(var(--tx-yellow-rgb),.16);
  background:rgba(var(--tx-white-rgb),.04);
}

.resource-modal .snippet-lang{
  border:1px solid rgba(var(--tx-teal-rgb),.22);
}

.copy-btn{
  border:1px solid rgba(var(--tx-yellow-rgb),.18);
  background:transparent;
  color:var(--tx-yellow);
}

.copy-btn:hover,
.copy-btn.copied{
  background:rgba(var(--tx-yellow-rgb),.12);
  color:var(--tx-white);
}

.snippet-code{
  border:0;
  background:transparent;
}

.snippet-code code{
  color:rgba(var(--tx-white-rgb),.84);
}

.resource-modal .showcase-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.resource-modal .showcase-item{
  flex-direction:column;
  min-height:210px;
}

.resource-modal .showcase-preview,
.resource-modal .bug-icon{
  border:1px solid rgba(var(--modal-accent),.16);
  background:
    radial-gradient(circle at 50% 24%,rgba(var(--tx-yellow-rgb),.32),transparent 58%),
    rgba(var(--modal-accent),.1);
  color:var(--modal-ink);
}

.resource-modal .showcase-preview{
  width:60px;
  height:60px;
}

.resource-modal .showcase-prompt{
  color:var(--tx-teal);
}

.resource-modal .bug-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.resource-modal .bug-card{
  min-height:220px;
  padding:20px;
}

.resource-modal .bug-link{
  color:var(--tx-orange);
}

.resource-modal .bug-link:hover{
  color:var(--tx-red);
}

.resource-modal .bug-template{
  padding:20px;
  background:
    linear-gradient(90deg,rgba(var(--tx-red-rgb),.09),transparent 58%),
    rgba(255,255,255,.44);
}

.resource-modal .panel-footer{
  margin-top:18px;
  padding:16px 18px;
  background:rgba(var(--tx-yellow-rgb),.2);
}

@media(max-width:980px){
  .resource-modal-card{
    width:min(94vw,760px);
  }

  .resource-modal .panel-grid,
  .resource-modal .snippet-grid,
  .resource-modal .showcase-grid,
  .resource-modal .bug-grid{
    grid-template-columns:1fr;
  }

  .resource-modal .tip-card,
  .resource-modal .showcase-item,
  .resource-modal .bug-card{
    min-height:auto;
  }
}

@media(max-width:620px){
  .resource-modal{
    align-items:flex-end;
    padding:10px;
  }

  .resource-modal-card{
    width:100%;
    max-height:90vh;
    border-radius:24px;
  }

  .resource-modal-card .close-x{
    top:14px;
    right:14px;
    width:42px;
    height:42px;
  }

  .resource-modal-header{
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    padding:22px 18px 16px;
  }

  .resource-modal-header::after{
    left:18px;
    right:18px;
  }

  .resource-modal-header i{
    width:48px;
    height:48px;
    border-radius:15px;
    font-size:20px;
  }

  .resource-modal-header h4{
    padding-right:44px;
    font-size:34px;
  }

  .resource-modal-body{
    padding:18px;
  }

  .resource-modal .tip-card,
  .resource-modal .showcase-item,
  .resource-modal .bug-card,
  .resource-modal .bug-template,
  .resource-modal .panel-footer{
    border-radius:16px;
  }
}

.feature-card{
  overflow:hidden;
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.18);
  background:
    radial-gradient(circle at 0% 0%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.12),transparent 38%),
    #fff;
}

.feature-card:nth-child(even){
  background:
    radial-gradient(circle at 0% 0%,rgba(var(--card-accent-rgb,var(--tx-yellow-rgb)),.14),transparent 38%),
    linear-gradient(160deg,#141524,var(--tx-blue));
}

.feature-card:hover{
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.34);
  box-shadow:0 22px 52px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.14);
}

.feature-card__icon{
  color:#14110c;
  background:linear-gradient(180deg,var(--tx-yellow),var(--tx-white));
  box-shadow:0 14px 32px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.14);
}

.feature-card__eyebrow{
  color:rgb(var(--card-accent-rgb,var(--tx-teal-rgb)));
}

.feature-points li{
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.2);
  background:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.07);
}

.demo-panel,
.demo-result,
.workflow-grid li{
  border-color:rgba(var(--tx-red-rgb),.13);
  background:rgba(255,255,255,.68);
}

.demo-prompt{
  border-color:rgba(var(--tx-teal-rgb),.2);
  background:linear-gradient(180deg,rgba(var(--tx-white-rgb),.86),rgba(var(--tx-yellow-rgb),.18));
}

.demo-chip.is-active,
.demo-chip:hover{
  border-color:rgba(var(--tx-orange-rgb),.36);
  background:rgba(var(--tx-orange-rgb),.1);
  color:var(--tx-red);
}

.demo-result::before{
  background:radial-gradient(circle at 50% 40%,rgba(var(--tx-teal-rgb),.18),transparent 52%);
}

.tools-band,
.ai-workflows,
.pricing-preview,
.faq,
.final-cta{
  background:
    radial-gradient(circle at 12% 0%,rgba(var(--tx-red-rgb),.18),transparent 30%),
    radial-gradient(circle at 88% 10%,rgba(var(--tx-teal-rgb),.16),transparent 34%),
    #0a0a0a;
}

.ai-workflows{
  color:#17120f;
  background:
    radial-gradient(circle at 10% 0%,rgba(var(--tx-yellow-rgb),.78),transparent 32%),
    radial-gradient(circle at 90% 10%,rgba(var(--tx-white-rgb),.9),transparent 38%),
    linear-gradient(180deg,var(--tx-yellow) 0%,var(--tx-white) 58%,rgba(var(--tx-yellow-rgb),.52) 100%);
}

.ai-workflows::before{
  background:linear-gradient(90deg,transparent,rgba(var(--tx-red-rgb),.18) 50%,transparent);
}

.ai-workflows .section-index{
  color:var(--tx-red);
}

.ai-workflows-copy h2{
  color:var(--tx-blue);
}

.ai-workflows-copy p{
  color:rgba(var(--tx-blue-rgb),.72);
}

.ai-workflows .button-primary{
  border-color:rgba(var(--tx-red-rgb),.28);
  color:#0e0806;
  box-shadow:0 18px 44px rgba(var(--tx-orange-rgb),.18),0 0 0 1px rgba(var(--tx-yellow-rgb),.7) inset;
}

.ai-workflow-card{
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.18);
  background:
    radial-gradient(circle at 18% 0%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.1),transparent 38%),
    linear-gradient(180deg,rgba(255,255,255,.7),rgba(var(--tx-white-rgb),.58));
  color:var(--tx-blue);
  box-shadow:0 20px 46px rgba(var(--tx-blue-rgb),.08),inset 0 1px 0 rgba(255,255,255,.78);
}

.ai-workflow-card::before{
  background:radial-gradient(circle at 20% 0%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.14),transparent 42%);
}

.ai-workflow-card h3{
  color:#17120f;
}

.ai-workflow-card p{
  color:rgba(var(--tx-blue-rgb),.68);
}

.ai-workflow-card small{
  color:var(--tx-red);
}

.ai-workflow-card__tag{
  border-color:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.3);
  color:var(--tx-teal);
  background:rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.12);
  box-shadow:0 10px 24px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.08),inset 0 1px 0 rgba(255,255,255,.56);
}

.ai-workflow-card:nth-child(3) .ai-workflow-card__tag{
  color:var(--tx-orange);
}

.ai-workflow-card:nth-child(4) .ai-workflow-card__tag{
  color:var(--tx-red);
}

.ai-workflow-card:hover{
  border-color:rgba(var(--card-accent-rgb,var(--tx-orange-rgb)),.34);
  background:
    radial-gradient(circle at 18% 0%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.16),transparent 38%),
    linear-gradient(180deg,rgba(255,255,255,.82),rgba(var(--tx-white-rgb),.7));
  box-shadow:0 24px 54px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.14),0 20px 42px rgba(var(--tx-blue-rgb),.09);
}

.tool-links a,
.pricing-uses li,
.platform-card,
.platform-modes,
.faq-list details{
  border-color:var(--tx-palette-line);
}

.tool-links a:hover{
  border-color:rgba(var(--card-accent-rgb,var(--tx-orange-rgb)),.34);
  background:rgba(var(--card-accent-rgb,var(--tx-orange-rgb)),.08);
}

.pricing-card{
  border-radius:28px;
  padding:clamp(26px,4vw,46px);
  border:1px solid rgba(var(--tx-red-rgb),.16);
  background:
    radial-gradient(circle at 8% 0%,rgba(var(--tx-yellow-rgb),.58),transparent 28%),
    radial-gradient(circle at 92% 0%,rgba(var(--tx-red-rgb),.1),transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.82),rgba(var(--tx-white-rgb),.66) 48%,rgba(var(--tx-yellow-rgb),.28));
  box-shadow:0 28px 82px rgba(var(--tx-blue-rgb),.1),inset 0 1px 0 rgba(255,255,255,.72);
}

.pricing-preview{
  color:#17120f;
  background:
    radial-gradient(circle at 10% 0%,rgba(var(--tx-yellow-rgb),.62),transparent 30%),
    radial-gradient(circle at 90% 8%,rgba(var(--tx-teal-rgb),.1),transparent 32%),
    linear-gradient(180deg,var(--tx-white) 0%,rgba(var(--tx-yellow-rgb),.58) 100%);
}

.pricing-preview::before{
  background:linear-gradient(90deg,transparent,rgba(var(--tx-red-rgb),.18) 50%,transparent);
}

.pricing-preview .section-index{
  color:var(--tx-red);
}

.pricing-preview .section-index::before{
  background:var(--tx-orange);
  box-shadow:0 0 16px rgba(var(--tx-orange-rgb),.34);
}

.pricing-card h2{
  color:var(--tx-blue);
}

.pricing-card p{
  color:rgba(var(--tx-blue-rgb),.72);
}

.pricing-preview .button-primary{
  border-color:rgba(var(--tx-red-rgb),.28);
  background:linear-gradient(135deg,var(--tx-orange),#d94018 58%,var(--tx-red));
  color:#0e0806;
  box-shadow:0 18px 44px rgba(var(--tx-orange-rgb),.18),0 0 0 1px rgba(var(--tx-yellow-rgb),.62) inset;
}

.pricing-uses{
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.pricing-uses-cap{
  display:inline-flex;
  width:max-content;
  margin:0 0 14px;
  padding:8px 12px;
  border:0;
  border-radius:999px;
  background:rgba(var(--tx-red-rgb),.08);
  color:var(--tx-red);
}

.pricing-uses ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin:0;
  padding:0;
  border-top:0;
}

.pricing-uses li{
  position:relative;
  min-height:150px;
  padding:22px 18px 20px;
  border:0;
  border-radius:18px;
  background:
    radial-gradient(circle at 100% 0%,rgba(var(--credit-accent,var(--tx-teal-rgb)),.16),transparent 44%),
    rgba(255,255,255,.58);
  box-shadow:0 16px 36px rgba(var(--tx-blue-rgb),.07),inset 0 1px 0 rgba(255,255,255,.66);
  transition:transform .2s ease,background .2s ease,box-shadow .2s ease;
}

.pricing-uses li span{
  color:#17120f;
}

.pricing-uses li small{
  color:rgba(var(--tx-blue-rgb),.64);
}

.pricing-uses li::before{
  content:"";
  position:absolute;
  right:18px;
  top:18px;
  width:10px;
  height:10px;
  border-radius:999px;
  background:rgb(var(--credit-accent,var(--tx-teal-rgb)));
  box-shadow:0 0 18px rgba(var(--credit-accent,var(--tx-teal-rgb)),.34);
}

.pricing-uses li:nth-child(1){--credit-accent:var(--tx-teal-rgb)}
.pricing-uses li:nth-child(2){--credit-accent:var(--tx-orange-rgb)}
.pricing-uses li:nth-child(3){--credit-accent:var(--tx-blue-rgb)}
.pricing-uses li:nth-child(4){--credit-accent:var(--tx-red-rgb)}

.pricing-uses li:hover{
  transform:translateY(-2px);
  background:
    radial-gradient(circle at 100% 0%,rgba(var(--credit-accent,var(--tx-teal-rgb)),.22),transparent 44%),
    rgba(255,255,255,.68);
  box-shadow:0 20px 44px rgba(var(--credit-accent,var(--tx-teal-rgb)),.11),0 14px 32px rgba(var(--tx-blue-rgb),.07);
}

.platform{
  color:#17120f;
  background:
    radial-gradient(circle at 10% 0%,rgba(var(--tx-yellow-rgb),.6),transparent 30%),
    radial-gradient(circle at 92% 8%,rgba(var(--tx-teal-rgb),.12),transparent 34%),
    linear-gradient(180deg,var(--tx-white) 0%,rgba(var(--tx-yellow-rgb),.5) 100%);
}

.platform::before{
  background:linear-gradient(90deg,transparent,rgba(var(--tx-red-rgb),.18) 50%,transparent);
}

.platform .section-index{
  color:var(--tx-red);
}

.platform-intro h2{
  color:var(--tx-blue);
}

.platform-intro>p,
.platform-points dd,
.platform-card p{
  color:rgba(var(--tx-blue-rgb),.66);
}

.platform-points dt,
.platform-card strong{
  color:#17120f;
}

.platform-link{
  border-bottom-color:rgba(var(--tx-teal-rgb),.34);
  color:var(--tx-teal);
}

.platform .button-primary{
  border-color:rgba(var(--tx-red-rgb),.28);
  background:linear-gradient(135deg,var(--tx-orange),#d94018 58%,var(--tx-red));
  color:#0e0806;
  box-shadow:0 18px 44px rgba(var(--tx-orange-rgb),.18),0 0 0 1px rgba(var(--tx-yellow-rgb),.62) inset;
}

.platform-scope{
  border:0;
  background:
    radial-gradient(circle at 100% 0%,rgba(var(--tx-teal-rgb),.11),transparent 32%),
    rgba(255,255,255,.72);
  box-shadow:0 24px 64px rgba(var(--tx-blue-rgb),.08),inset 0 1px 0 rgba(255,255,255,.7);
}

.platform-scope-head{
  border-bottom-color:rgba(var(--tx-red-rgb),.12);
  color:var(--tx-red);
}

.platform-scope-head span:last-child{
  color:rgba(var(--tx-blue-rgb),.55);
}

.platform-card{
  border:0;
  background:
    radial-gradient(circle at 0 0,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.12),transparent 42%),
    rgba(255,255,255,.66);
  box-shadow:0 16px 36px rgba(var(--tx-blue-rgb),.06),inset 0 1px 0 rgba(255,255,255,.64);
}

.platform-card-label{
  color:var(--tx-teal);
}

.platform-card:nth-child(3) .platform-card-label{
  color:var(--tx-orange);
}

.platform-card:nth-child(4) .platform-card-label,
.platform-card:nth-child(5) .platform-card-label{
  color:var(--tx-red);
}

.platform-modes{
  padding-top:18px;
  border-top:0;
  background:transparent;
  box-shadow:none;
}

.platform-modes-cap{
  color:var(--tx-red);
}

.platform-modes li{
  border:0;
  background:transparent;
  color:var(--tx-teal);
  box-shadow:none;
}

.platform-modes li:nth-child(3n+2){
  background:transparent;
  color:var(--tx-red);
}

.platform-modes li:nth-child(3n){
  background:transparent;
  color:var(--tx-blue);
}

.insight-feed{
  background:
    radial-gradient(circle at 0% 0%,rgba(var(--tx-yellow-rgb),.55),transparent 32%),
    radial-gradient(circle at 92% 12%,rgba(var(--tx-red-rgb),.1),transparent 32%),
    var(--tx-white);
}

.insight-card{
  border-color:rgba(var(--tx-red-rgb),.12);
  background:rgba(255,255,255,.78);
}

.insight-thumb{
  background:
    radial-gradient(circle at 30% 30%,rgba(var(--tx-teal-rgb),.18),transparent 46%),
    rgba(var(--tx-blue-rgb),.08);
}

.insight-pill{
  border-color:rgba(var(--tx-yellow-rgb),.3);
  background:rgba(var(--tx-blue-rgb),.82);
  color:var(--tx-yellow);
}

.insight-topics span:nth-child(1){color:var(--tx-teal)}
.insight-topics span:nth-child(2){color:var(--tx-red)}
.insight-topics span:nth-child(3){color:#9b3b17}
.insight-topics span:nth-child(4){color:var(--tx-blue)}

.faq-list details[open]{
  background:rgba(var(--tx-white-rgb),.035);
}

.faq-list summary:hover,
.faq-list details[open] summary{
  color:var(--tx-yellow);
}

.faq-list summary span{
  color:var(--tx-orange);
}

.info-link-card small,
.quick-link-card p{
  color:#615a55;
}

.final-cta{
  border-top:1px solid rgba(var(--tx-red-rgb),.12);
  background:
    radial-gradient(circle at 12% 0%,rgba(var(--tx-yellow-rgb),.62),transparent 30%),
    radial-gradient(circle at 88% 10%,rgba(var(--tx-teal-rgb),.12),transparent 34%),
    linear-gradient(180deg,var(--tx-white) 0%,rgba(var(--tx-yellow-rgb),.62) 100%);
  color:#17120f;
}

.final-cta .shell{
  position:relative;
  max-width:min(1120px,calc(100% - 40px));
  padding:clamp(44px,6vw,78px) clamp(22px,5vw,72px);
}

.final-cta .shell::before{
  content:"";
  position:absolute;
  inset:0;
  border:1px solid rgba(var(--tx-red-rgb),.16);
  border-radius:30px;
  background:
    radial-gradient(circle at 0% 0%,rgba(var(--tx-red-rgb),.1),transparent 34%),
    radial-gradient(circle at 100% 0%,rgba(var(--tx-teal-rgb),.12),transparent 36%),
    linear-gradient(135deg,rgba(255,255,255,.7),rgba(var(--tx-white-rgb),.58));
  box-shadow:0 28px 82px rgba(var(--tx-blue-rgb),.1),inset 0 1px 0 rgba(255,255,255,.72);
  pointer-events:none;
}

.final-cta .shell>*{
  position:relative;
}

.final-cta .eyebrow{
  color:var(--tx-red);
}

.final-cta .eyebrow>span{
  background:var(--tx-orange);
  box-shadow:0 0 18px rgba(var(--tx-orange-rgb),.38);
}

.final-cta h2{
  color:var(--tx-blue);
  text-shadow:none;
}

.final-cta p{
  color:rgba(var(--tx-blue-rgb),.7);
}

.final-cta .button-primary{
  border-color:rgba(var(--tx-red-rgb),.28);
  background:linear-gradient(135deg,var(--tx-orange),#d94018 58%,var(--tx-red));
  color:#0e0806;
  box-shadow:0 18px 44px rgba(var(--tx-orange-rgb),.18),0 0 0 1px rgba(var(--tx-yellow-rgb),.62) inset;
}

.final-cta .button-ghost{
  border-color:rgba(var(--tx-teal-rgb),.22);
  background:rgba(255,255,255,.66);
  color:var(--tx-teal);
  box-shadow:0 14px 32px rgba(var(--tx-blue-rgb),.06);
}

.final-cta .button-primary:hover,
.final-cta .button-ghost:hover{
  transform:translateY(-2px);
}

.final-cta .button-ghost:hover{
  border-color:rgba(var(--tx-teal-rgb),.34);
  background:rgba(255,255,255,.86);
}

.site-footer{
  background:
    radial-gradient(circle at 12% 0%,rgba(var(--tx-red-rgb),.2),transparent 30%),
    radial-gradient(circle at 88% 20%,rgba(var(--tx-teal-rgb),.16),transparent 34%),
    #07080b;
}

.footer-grid nav{
  border-color:rgba(var(--tx-yellow-rgb),.11);
}

.tx-burger{
  color:var(--tx-white);
}

.tx-burger:hover span,
.tx-burger[aria-expanded="true"] span{
  background:var(--tx-yellow);
}

.tx-menu-backdrop{
  background:rgba(var(--tx-blue-rgb),.72);
}

.tx-menu{
  border-left-color:rgba(var(--tx-yellow-rgb),.18);
  background:
    radial-gradient(circle at 14% 8%,rgba(var(--tx-red-rgb),.28),transparent 34%),
    radial-gradient(circle at 92% 20%,rgba(var(--tx-teal-rgb),.18),transparent 32%),
    linear-gradient(180deg,rgba(var(--tx-blue-rgb),.985),rgba(6,7,10,.99));
}

.tx-menu-links a{
  border-color:rgba(var(--tx-yellow-rgb),.11);
  background:transparent;
  box-shadow:none;
}

.tx-menu-links a:hover,
.tx-menu-links a:focus-visible{
  border-color:rgba(var(--tx-yellow-rgb),.3);
  background:transparent;
  box-shadow:none;
}

.tx-menu-cta{
  background:linear-gradient(135deg,var(--tx-orange),var(--tx-yellow));
  color:#140c08;
}

.tx-menu-foot a:hover{
  color:var(--tx-yellow);
}

.chat-toggle{
  background:linear-gradient(145deg,var(--tx-yellow),var(--tx-white));
  color:var(--tx-blue);
  border-color:rgba(var(--tx-red-rgb),.22);
  box-shadow:0 18px 44px rgba(var(--tx-blue-rgb),.46),0 0 36px rgba(var(--tx-orange-rgb),.16);
}

.chat-toggle::after,
.chat-toggle::before{
  background:var(--tx-blue);
  border-color:rgba(var(--tx-yellow-rgb),.14);
}

.chat-panel{
  border-color:rgba(var(--tx-yellow-rgb),.16);
  background:
    radial-gradient(circle at 12% 0%,rgba(var(--tx-red-rgb),.24),transparent 34%),
    radial-gradient(circle at 88% 12%,rgba(var(--tx-teal-rgb),.2),transparent 34%),
    linear-gradient(145deg,rgba(var(--tx-blue-rgb),.98),rgba(8,9,12,.98));
}

.chat-backdrop{
  background:rgba(5,5,8,.66);
}

.chat-kicker,
.chat-suggestion:hover,
.chat-quick button:hover{
  color:var(--tx-yellow)!important;
}

.chat-close,
.chat-quick button,
.chat-suggestion,
.chat-message,
.chat-spotlight,
.chat-inputbar textarea{
  border-color:rgba(var(--tx-yellow-rgb),.1);
}

.chat-message.me,
.chat-send{
  background:linear-gradient(135deg,var(--tx-yellow),var(--tx-white));
  color:#15100b;
}

.chat-inputbar textarea:focus{
  border-color:rgba(var(--tx-teal-rgb),.5);
  box-shadow:0 0 0 4px rgba(var(--tx-teal-rgb),.12);
}

@media(max-width:820px){
  .chat-inputbar{
    background:linear-gradient(180deg,rgba(var(--tx-blue-rgb),.95),#11100f);
  }
}

@media(max-width:760px){
  body{
    overflow-x:hidden;
  }

  .hero-minimal-shell,
  .hero-minimal-copy,
  .hero-command-wrap,
  .prompt-recipes{
    width:100%;
    max-width:100%;
    min-width:0;
  }

  .hero-minimal-copy h1{
    width:min(100%,340px);
    max-width:100%;
    font-size:clamp(34px,9vw,40px);
    line-height:.98;
    overflow-wrap:normal;
    text-wrap:balance;
  }

  .hero-minimal-copy .eyebrow{
    margin-bottom:9px;
  }

  .hero-workflow-strip,
  .hero-promptbar{
    width:100%;
    max-width:100%;
  }

  .hero-workflow-strip{
    display:flex;
    align-items:center;
    justify-self:start;
    width:auto;
    max-width:min(100%,340px);
    gap:8px;
    margin-top:9px;
    padding:0 0 7px 15px;
  }

  .hero-workflow-strip span{
    font-size:8px;
  }

  .hero-workflow-strip strong{
    min-width:0;
    max-width:100%;
    font-size:12px;
  }

  .hero-minimal-copy p[data-hero-subcopy]{
    max-width:330px;
    margin-top:8px;
    font-size:13.5px;
    line-height:1.42;
  }

  .hero-card-deck{
    width:100vw;
    max-width:none;
    margin:12px calc(50% - 50vw) 0;
  }

  .hero-product-surface{
    width:100vw;
    gap:12px;
    padding:4px 16px 12px;
    scroll-padding-inline:16px;
  }

  .hero-promptbar input{
    min-width:0;
  }

  .pricing-card,
  .final-cta .shell::before{
    border-radius:22px;
  }

  .resource-tab,
  .quick-link-card,
  .info-link-card{
    box-shadow:0 14px 32px rgba(var(--tx-blue-rgb),.08);
  }
}

@media(min-width:901px){
  .comm-quick-links{
    grid-template-columns:repeat(3,minmax(0,1fr));
    align-items:stretch;
  }

  .quick-link-card{
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    align-content:center;
    gap:clamp(12px,1.1vw,16px);
    min-height:132px;
    padding:clamp(16px,1.25vw,20px);
  }

  .quick-link-card .ql-cta{
    grid-column:3;
    align-self:center;
    justify-self:end;
    white-space:nowrap;
    font-size:11px;
  }
}

@media(max-width:620px){
  .pricing-uses ul{
    grid-template-columns:1fr;
  }

  .pricing-uses li{
    min-height:auto;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-workflow-strip::before,
  .hero-workflow-strip::after,
  .hero-workflow-strip strong{
    animation:none;
  }
}

/* ==========================================================================
   CORNER RECIPES (2026-08-20): the prompt-recipes panel dissolves — no frame,
   no card chrome. On wide screens the four recipes pin to the four corners of
   the hero like floating instruments: they drift in from their own corner on
   load, breathe on independent rhythms, and bloom on hover (accent halo,
   icon pop, description unfolds). The rotating .is-active card (landing.js)
   blooms on its own, so the corners take turns glowing. Below 1240px they
   fall back to the in-flow grid, frameless. Markup and JS untouched.
   ========================================================================== */
.prompt-recipes{
  border:0;
  background:none;
  box-shadow:none;
  backdrop-filter:none;
}
.prompt-recipe,
.prompt-recipe:hover,
.prompt-recipe:focus-visible,
.prompt-recipe.is-active{
  border-color:transparent;
  background:none;
  box-shadow:none;
}

@media (min-width:1240px){
  .prompt-recipes{position:static;width:auto;margin:0;padding:0}
  .prompt-recipes__head{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
  }
  .prompt-recipes__grid{display:contents}
  .prompt-recipe{
    position:absolute;z-index:6;
    width:min(240px,17vw);
    min-height:0;padding:12px;
  }
  .prompt-recipe:hover,
  .prompt-recipe:focus-visible,
  .prompt-recipe.is-active{transform:none}
  .prompt-recipe::before{
    inset:-16px;border-radius:26px;
    background:radial-gradient(circle at 50% 22%,rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.2),transparent 64%);
    opacity:0;transition:opacity .3s ease;
  }
  .prompt-recipe:hover::before,
  .prompt-recipe:focus-visible::before,
  .prompt-recipe.is-active::before{opacity:1}
  .prompt-recipe__icon{transition:transform .25s ease,box-shadow .25s ease}
  .prompt-recipe:hover .prompt-recipe__icon,
  .prompt-recipe.is-active .prompt-recipe__icon{
    transform:scale(1.12) rotate(-4deg);
    box-shadow:0 0 22px rgba(var(--card-accent-rgb,var(--tx-teal-rgb)),.42);
  }
  /* description folds away; hover / focus / active unfolds it */
  .prompt-recipe__copy>span:last-child{
    max-height:0;opacity:0;overflow:hidden;
    transition:max-height .35s ease,opacity .3s ease .05s;
  }
  .prompt-recipe:hover .prompt-recipe__copy>span:last-child,
  .prompt-recipe:focus-visible .prompt-recipe__copy>span:last-child,
  .prompt-recipe.is-active .prompt-recipe__copy>span:last-child{
    max-height:90px;opacity:1;
  }
  /* four corners, staggered entrances, independent drift rhythms */
  .prompt-recipe:nth-child(1){
    top:calc(var(--header) + clamp(48px,6vh,92px));left:clamp(16px,2.6vw,52px);
    animation:recipeDriftA 8.5s ease-in-out infinite,recipeInTL .9s .1s cubic-bezier(.22,1,.36,1) both;
  }
  .prompt-recipe:nth-child(2){
    top:calc(var(--header) + clamp(48px,6vh,92px));right:clamp(16px,2.6vw,52px);
    grid-template-columns:minmax(0,1fr) 34px;text-align:right;
    animation:recipeDriftB 10.5s ease-in-out infinite,recipeInTR .9s .24s cubic-bezier(.22,1,.36,1) both;
  }
  .prompt-recipe:nth-child(3){
    bottom:clamp(44px,7vh,110px);left:clamp(16px,2.6vw,52px);
    animation:recipeDriftB 9.2s .6s ease-in-out infinite,recipeInBL .9s .38s cubic-bezier(.22,1,.36,1) both;
  }
  .prompt-recipe:nth-child(4){
    bottom:clamp(44px,7vh,110px);right:clamp(16px,2.6vw,52px);
    grid-template-columns:minmax(0,1fr) 34px;text-align:right;
    animation:recipeDriftA 11.4s .3s ease-in-out infinite,recipeInBR .9s .52s cubic-bezier(.22,1,.36,1) both;
  }
  .prompt-recipe:nth-child(2) .prompt-recipe__icon,
  .prompt-recipe:nth-child(4) .prompt-recipe__icon{order:2}
  .prompt-recipe:nth-child(2) .prompt-recipe__copy,
  .prompt-recipe:nth-child(4) .prompt-recipe__copy{justify-items:end}
  .prompt-recipe:nth-child(2) small,
  .prompt-recipe:nth-child(4) small{margin-left:auto}
}
/* drift uses margins so it never fights the entrance transform */
@keyframes recipeDriftA{50%{margin-top:-9px}}
@keyframes recipeDriftB{50%{margin-top:7px}}
@keyframes recipeInTL{from{opacity:0;transform:translate(-38px,-38px) scale(.92)}to{opacity:1;transform:none}}
@keyframes recipeInTR{from{opacity:0;transform:translate(38px,-38px) scale(.92)}to{opacity:1;transform:none}}
@keyframes recipeInBL{from{opacity:0;transform:translate(-38px,38px) scale(.92)}to{opacity:1;transform:none}}
@keyframes recipeInBR{from{opacity:0;transform:translate(38px,38px) scale(.92)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .prompt-recipe{animation:none!important}
  .prompt-recipe__copy>span:last-child{max-height:none;opacity:1}
}

/* Homepage assistant modal ------------------------------------------------ */
.chat-backdrop{
  background:rgba(12,13,18,.58);
  backdrop-filter:blur(16px) saturate(.85);
}

.chat-toggle{
  border-color:rgba(var(--tx-red-rgb),.18);
  background:
    radial-gradient(circle at 68% 22%,rgba(var(--tx-orange-rgb),.28),transparent 42%),
    linear-gradient(145deg,var(--tx-yellow),var(--tx-white));
  color:var(--tx-blue);
  box-shadow:0 22px 54px rgba(var(--tx-blue-rgb),.24),0 0 0 1px rgba(255,255,255,.68) inset;
}

.chat-toggle::after{
  background:var(--tx-blue);
  color:var(--tx-white);
  border-color:rgba(var(--tx-yellow-rgb),.16);
}

.chat-toggle::before{
  background:var(--tx-blue);
  border-color:rgba(var(--tx-yellow-rgb),.16);
}

.chat-panel{
  --chat-visual-width:100vw;
  --chat-visual-height:100dvh;
  --chat-visual-top:0px;
  --chat-visual-left:0px;
  left:50%;
  right:auto;
  top:50%;
  bottom:auto;
  width:min(900px,calc(100vw - 48px));
  height:auto;
  max-height:min(760px,calc(100dvh - 48px));
  grid-template-rows:auto minmax(0,1fr);
  border:0;
  border-radius:26px;
  background:
    radial-gradient(circle at 7% 0%,rgba(var(--tx-red-rgb),.16),transparent 30%),
    radial-gradient(circle at 92% 4%,rgba(var(--tx-teal-rgb),.16),transparent 34%),
    linear-gradient(145deg,rgba(var(--tx-white-rgb),.98),rgba(var(--tx-yellow-rgb),.74));
  color:var(--tx-blue);
  box-shadow:0 34px 96px rgba(var(--tx-blue-rgb),.24),0 0 0 1px rgba(255,255,255,.72) inset;
  transform:translate(-50%,-46%) scale(.97);
}

.chat-panel.is-open{
  transform:translate(-50%,-50%) scale(1);
}

.chat-head{
  align-items:flex-start;
  padding:26px 28px 20px;
  border-bottom:1px solid rgba(var(--tx-red-rgb),.12);
}

.chat-title{
  gap:7px;
}

.chat-kicker{
  color:var(--tx-red)!important;
  letter-spacing:.18em;
}

.chat-title strong{
  color:var(--tx-blue);
  font-size:clamp(34px,4vw,52px);
  line-height:.98;
}

.chat-title span:last-child{
  max-width:560px;
  color:rgba(var(--tx-blue-rgb),.62);
  font-size:15px;
}

.chat-close{
  width:46px;
  height:46px;
  border:0;
  border-radius:16px;
  background:rgba(var(--tx-blue-rgb),.08);
  color:var(--tx-blue);
  box-shadow:inset 0 0 0 1px rgba(var(--tx-blue-rgb),.09);
}

.chat-close:hover,
.chat-close:focus-visible{
  background:var(--tx-blue);
  color:var(--tx-white);
}

.chat-layout{
  grid-template-columns:minmax(230px,.36fr) minmax(0,1fr);
}

.chat-aside{
  gap:14px;
  padding:22px 22px 24px 28px;
  border-right:1px solid rgba(var(--tx-red-rgb),.1);
}

.chat-spotlight,
.chat-quick button,
.chat-suggestion,
.chat-welcome,
.chat-message,
.chat-inputbar textarea{
  border:0;
  box-shadow:inset 0 0 0 1px rgba(var(--tx-blue-rgb),.08);
}

.chat-spotlight{
  background:rgba(255,255,255,.52);
}

.chat-spotlight h3,
.chat-welcome h3{
  color:var(--tx-blue);
}

.chat-spotlight p,
.chat-welcome p{
  color:rgba(var(--tx-blue-rgb),.62);
}

.chat-quick{
  gap:10px;
}

.chat-quick button,
.chat-suggestion{
  background:rgba(255,255,255,.5);
  color:var(--tx-red);
}

.chat-quick button:hover,
.chat-quick button:focus-visible,
.chat-suggestion:hover,
.chat-suggestion:focus-visible{
  background:rgba(var(--tx-teal-rgb),.1);
  color:var(--tx-teal)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--tx-teal-rgb),.18);
}

.chat-main{
  background:rgba(255,255,255,.18);
}

.chat-body{
  min-height:210px;
  max-height:min(38dvh,360px);
  padding:24px 28px 18px;
}

.chat-welcome,
.chat-message{
  background:rgba(255,255,255,.6);
  color:rgba(var(--tx-blue-rgb),.72);
}

.chat-message{
  max-width:min(640px,86%);
}

.chat-message strong{
  color:var(--tx-blue);
}

.chat-message a{
  color:var(--tx-teal);
}

.chat-message.me{
  background:linear-gradient(135deg,var(--tx-blue),#24315d);
  color:var(--tx-white);
  box-shadow:none;
}

.chat-message.me a,
.chat-message.me strong{
  color:var(--tx-yellow);
}

.chat-message.typing span{
  background:var(--tx-orange);
}

.chat-suggestions{
  padding:0 28px 14px;
}

.chat-inputbar{
  align-items:flex-end;
  gap:14px;
  padding:16px 28px 26px;
  border-top:1px solid rgba(var(--tx-red-rgb),.1);
  background:rgba(var(--tx-white-rgb),.46);
}

.chat-inputbar textarea{
  min-height:58px;
  border-radius:18px;
  background:rgba(255,255,255,.7);
  color:var(--tx-blue);
}

.chat-inputbar textarea::placeholder{
  color:rgba(var(--tx-blue-rgb),.46);
}

.chat-inputbar textarea:focus{
  border-color:transparent;
  box-shadow:0 0 0 3px rgba(var(--tx-teal-rgb),.16),inset 0 0 0 1px rgba(var(--tx-teal-rgb),.34);
}

.chat-send{
  min-width:112px;
  min-height:58px;
  border-radius:18px;
  background:linear-gradient(135deg,var(--tx-orange),#e9491a 56%,var(--tx-red));
  color:#120907;
  box-shadow:0 14px 34px rgba(var(--tx-orange-rgb),.2),inset 0 1px 0 rgba(255,255,255,.36);
}

.chat-send:hover,
.chat-send:focus-visible{
  background:linear-gradient(135deg,#ff6431,var(--tx-orange) 48%,var(--tx-red));
}

@media(max-width:820px){
  .chat-panel{
    left:max(10px,env(safe-area-inset-left));
    right:max(10px,env(safe-area-inset-right));
    top:auto;
    bottom:max(10px,env(safe-area-inset-bottom));
    width:auto;
    height:calc(100dvh - max(20px,env(safe-area-inset-top)) - max(20px,env(safe-area-inset-bottom)));
    max-height:none;
    border-radius:22px;
    transform:translateY(14px) scale(.98);
  }

  .chat-panel.is-open{
    transform:translateY(0) scale(1);
  }

  .chat-panel.has-keyboard{
    bottom:calc(var(--chat-keyboard-offset,0px) + max(10px,env(safe-area-inset-bottom)));
    height:calc(100dvh - var(--chat-keyboard-offset,0px) - max(20px,env(safe-area-inset-top)) - max(20px,env(safe-area-inset-bottom)));
  }

  .chat-head{
    padding:18px 18px 14px;
  }

  .chat-title{
    gap:5px;
  }

  .chat-kicker{
    font-size:9px;
  }

  .chat-title strong{
    font-size:34px;
  }

  .chat-title span:last-child{
    font-size:13px;
  }

  .chat-close{
    width:42px;
    height:42px;
    flex:0 0 42px;
  }

  .chat-layout{
    grid-template-columns:1fr;
  }

  .chat-aside{
    display:none;
  }

  .chat-body{
    min-height:0;
    max-height:none;
    padding:16px;
    gap:10px;
  }

  .chat-welcome,
  .chat-message{
    max-width:100%;
    padding:15px 16px;
  }

  .chat-message.me{
    max-width:88%;
  }

  .chat-suggestions{
    gap:8px;
    padding:0 16px 12px;
  }

  .chat-suggestion{
    max-width:76vw;
    padding:10px 13px;
  }

  .chat-inputbar{
    position:sticky;
    bottom:0;
    gap:10px;
    padding:12px 12px calc(12px + env(safe-area-inset-bottom));
    background:rgba(var(--tx-white-rgb),.72);
  }

  .chat-inputbar textarea{
    min-height:54px;
    max-height:112px;
    font-size:16px;
  }

  .chat-send{
    width:58px;
    min-width:58px;
    min-height:54px;
    border-radius:17px;
    flex:0 0 58px;
  }

  .chat-send span{
    display:none;
  }
}

@media(max-width:430px){
  .chat-panel{
    left:0;
    right:0;
    bottom:0;
    width:100vw;
    height:100dvh;
    border-radius:0;
  }

  .chat-head{
    padding-top:calc(14px + env(safe-area-inset-top));
  }

  .chat-title strong{
    font-size:30px;
  }
}

/* ==========================================================================
   ASK TIMRX PANEL — definitive layout + palette (2026-08-20)
   --------------------------------------------------------------------------
   Fixes a pre-existing cascade bug: the "Floating UI and modals" section of
   homepage-responsive.css sits at TOP LEVEL (its @media(max-width:760px)
   closes early upstream), so `.chat-aside{display:none}` applied at every
   width while this file's 2-column `.chat-layout` still reserved a 230px
   first column. The panel therefore squeezed all of its real content —
   welcome, suggestions, textarea — into that dead column and left the rest
   of the sheet blank.

   Rather than re-scope that leaked block (large blast radius across unrelated
   modals), the panel is fully specified here. This file loads last, so these
   rules win deterministically at every breakpoint.

   The aside is retired on purpose: its quick-prompt list duplicated
   `.chat-suggestions` in the main column and its spotlight copy repeated the
   header subtitle. One column = narrower, taller, no redundancy.
   ========================================================================== */

.chat-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  min-height:0;
}

.chat-aside{
  display:none!important;
}

/* ---- panel shell: narrower and taller ---------------------------------- */
.chat-panel{
  left:50%;
  right:auto;
  top:50%;
  bottom:auto;
  width:min(520px,calc(100vw - 40px));
  height:min(760px,calc(100dvh - 56px));
  max-height:none;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  border:0;
  border-radius:24px;
  overflow:hidden;
  color:var(--tx-blue);
  background:
    radial-gradient(120% 60% at 4% 0%,rgba(var(--tx-red-rgb),.07),transparent 58%),
    radial-gradient(110% 55% at 96% 2%,rgba(var(--tx-teal-rgb),.07),transparent 56%),
    linear-gradient(180deg,#fff 0%,var(--tx-white) 100%);
  box-shadow:
    0 32px 90px rgba(var(--tx-blue-rgb),.26),
    0 0 0 1px rgba(var(--tx-blue-rgb),.07);
  transform:translate(-50%,-46%) scale(.97);
}

.chat-panel.is-open{
  transform:translate(-50%,-50%) scale(1);
}

.chat-backdrop{
  background:rgba(var(--tx-blue-rgb),.42);
  backdrop-filter:blur(12px) saturate(.9);
}

/* ---- header ------------------------------------------------------------ */
.chat-head{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:20px 20px 16px;
  border-bottom:1px solid rgba(var(--tx-blue-rgb),.09);
  background:rgba(255,255,255,.5);
}

.chat-title{
  display:grid;
  gap:5px;
  min-width:0;
}

.chat-kicker{
  color:var(--tx-red)!important;
  font-size:9.5px;
  letter-spacing:.17em;
}

.chat-title strong{
  color:var(--tx-blue);
  font-size:clamp(22px,2.4vw,28px);
  line-height:1.05;
  letter-spacing:-.03em;
}

.chat-title span:last-child{
  max-width:42ch;
  color:rgba(var(--tx-blue-rgb),.6);
  font-size:13px;
  line-height:1.45;
}

.chat-close{
  flex:0 0 auto;
  width:38px;
  height:38px;
  border:0;
  border-radius:12px;
  background:rgba(var(--tx-blue-rgb),.07);
  color:var(--tx-blue);
  font-size:19px;
  line-height:1;
  cursor:pointer;
  transition:background .16s ease,color .16s ease;
}

.chat-close:hover,
.chat-close:focus-visible{
  background:var(--tx-red);
  color:var(--tx-white);
}

/* ---- conversation ------------------------------------------------------ */
.chat-main{
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
  background:none;
}

.chat-body{
  flex:1 1 auto;
  display:grid;
  align-content:start;
  gap:10px;
  min-height:0;
  max-height:none;
  overflow-y:auto;
  padding:18px 20px 14px;
}

.chat-welcome,
.chat-message{
  max-width:100%;
  border:0;
  border-radius:16px 16px 16px 6px;
  background:rgba(255,255,255,.72);
  box-shadow:inset 0 0 0 1px rgba(var(--tx-blue-rgb),.07);
  color:rgba(var(--tx-blue-rgb),.78);
  font-size:14px;
  line-height:1.55;
}

.chat-welcome{
  border-radius:18px;
  background:rgba(255,255,255,.82);
}

.chat-welcome h3{
  margin:0 0 6px;
  color:var(--tx-blue);
  font-size:19px;
  line-height:1.2;
  letter-spacing:-.02em;
}

.chat-welcome p{
  margin:0;
  color:rgba(var(--tx-blue-rgb),.62);
  font-size:13.5px;
}

.chat-message{max-width:92%}
.chat-message strong{color:var(--tx-blue)}
.chat-message a{color:var(--tx-teal)}

.chat-message.me{
  justify-self:end;
  max-width:88%;
  border-radius:16px 16px 6px 16px;
  background:linear-gradient(135deg,var(--tx-blue),#2a3157);
  color:var(--tx-white);
  box-shadow:none;
}

.chat-message.me a,
.chat-message.me strong{color:var(--tx-yellow)}
.chat-message.typing span{background:var(--tx-orange)}

/* ---- suggestion chips -------------------------------------------------- */
.chat-suggestions{
  display:flex;
  flex:0 0 auto;
  gap:8px;
  padding:0 20px 12px;
  overflow-x:auto;
  scrollbar-width:none;
}

.chat-suggestion{
  flex:0 0 auto;
  max-width:230px;
  padding:9px 13px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  box-shadow:inset 0 0 0 1px rgba(var(--tx-blue-rgb),.08);
  color:var(--tx-red);
  font-size:12px;
  font-weight:750;
  white-space:nowrap;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,box-shadow .16s ease;
}

.chat-suggestion:hover,
.chat-suggestion:focus-visible{
  background:rgba(var(--tx-teal-rgb),.09);
  color:var(--tx-teal)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--tx-teal-rgb),.24);
}

/* ---- composer ---------------------------------------------------------- */
.chat-inputbar{
  position:static;
  display:flex;
  flex:0 0 auto;
  align-items:flex-end;
  gap:10px;
  padding:14px 20px 18px;
  border-top:1px solid rgba(var(--tx-blue-rgb),.09);
  background:rgba(255,255,255,.62);
  box-shadow:none;
}

.chat-inputbar textarea{
  flex:1 1 auto;
  width:100%;
  min-width:0;
  min-height:52px;
  max-height:132px;
  padding:14px 15px;
  border:0;
  border-radius:15px;
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(var(--tx-blue-rgb),.1);
  color:var(--tx-blue);
  font-size:14.5px;
  line-height:1.4;
}

.chat-inputbar textarea::placeholder{color:rgba(var(--tx-blue-rgb),.42)}

.chat-inputbar textarea:focus{
  border-color:transparent;
  box-shadow:0 0 0 3px rgba(var(--tx-teal-rgb),.14),inset 0 0 0 1px rgba(var(--tx-teal-rgb),.4);
}

.chat-send{
  flex:0 0 auto;
  min-width:92px;
  width:auto;
  min-height:52px;
  height:52px;
  padding:0 16px;
  border:0;
  border-radius:15px;
  background:linear-gradient(135deg,var(--tx-orange),#e2481a);
  color:#fff;
  font-size:13px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 10px 24px rgba(var(--tx-orange-rgb),.26);
}

.chat-send span{display:inline}

.chat-send:hover:not(:disabled),
.chat-send:focus-visible:not(:disabled){
  background:linear-gradient(135deg,#ff6635,var(--tx-orange) 60%,var(--tx-red));
}

/* ---- tablet: keep it centred, trim the chrome -------------------------- */
@media(max-width:820px){
  .chat-panel{
    width:min(480px,calc(var(--chat-visual-width,100vw) - 32px));
    height:min(720px,calc(var(--chat-visual-height,100dvh) - 40px));
  }

  .chat-panel.has-keyboard{
    left:calc(var(--chat-visual-left,0px) + 16px);
    right:auto;
    top:calc(var(--chat-visual-top,0px) + 16px);
    bottom:auto;
    width:min(520px,calc(var(--chat-visual-width,100vw) - 32px));
    height:calc(var(--chat-visual-height,100dvh) - 32px);
    max-height:calc(var(--chat-visual-height,100dvh) - 32px);
    transform:translateY(0) scale(1);
    transition:none;
  }

  .chat-panel.is-open.has-keyboard{
    transform:translateY(0) scale(1);
  }
}

/* ---- phones: full-height sheet pinned to the real visual viewport ------- */
@media(max-width:600px){
  .chat-panel{
    left:calc(var(--chat-visual-left,0px) + max(8px,env(safe-area-inset-left,0px)));
    right:auto;
    top:calc(var(--chat-visual-top,0px) + max(8px,env(safe-area-inset-top,0px)));
    bottom:auto;
    width:calc(var(--chat-visual-width,100vw) - max(16px,env(safe-area-inset-left,0px)) - max(16px,env(safe-area-inset-right,0px)));
    height:calc(var(--chat-visual-height,100dvh) - max(16px,env(safe-area-inset-top,0px)) - max(16px,env(safe-area-inset-bottom,0px)));
    max-height:calc(var(--chat-visual-height,100dvh) - max(16px,env(safe-area-inset-top,0px)) - max(16px,env(safe-area-inset-bottom,0px)));
    border-radius:20px;
    transform:translateY(10px) scale(.985);
  }

  .chat-panel.is-open{transform:translateY(0) scale(1)}

  .chat-panel.has-keyboard{
    top:calc(var(--chat-visual-top,0px) + 6px);
    height:calc(var(--chat-visual-height,100dvh) - 12px);
    max-height:calc(var(--chat-visual-height,100dvh) - 12px);
    border-radius:18px;
  }

  .chat-panel.is-open.has-keyboard{
    transform:translateY(0) scale(1);
  }

  .chat-head{padding:16px 16px 13px}
  .chat-title strong{font-size:23px}
  .chat-title span:last-child{font-size:12.5px}
  .chat-body{padding:14px 16px 12px}
  .chat-suggestions{padding:0 16px 10px}
  .chat-suggestion{max-width:72vw}

  .chat-inputbar{
    gap:8px;
    padding:10px 12px calc(12px + env(safe-area-inset-bottom,0px));
    background:rgba(255,255,255,.72);
  }

  .chat-inputbar textarea{font-size:16px} /* iOS zoom guard */

  .chat-send{
    min-width:52px;
    width:52px;
    padding:0;
    font-size:17px;
  }

  .chat-send span{display:none}

  .chat-panel.has-keyboard .chat-head{
    padding:10px 12px 8px;
  }

  .chat-panel.has-keyboard .chat-kicker,
  .chat-panel.has-keyboard .chat-title span:last-child{
    display:none;
  }

  .chat-panel.has-keyboard .chat-title strong{
    font-size:20px;
  }

  .chat-panel.has-keyboard .chat-close{
    width:34px;
    height:34px;
    border-radius:11px;
  }

  .chat-panel.has-keyboard .chat-body{
    padding:10px 12px 8px;
  }

  .chat-panel.has-keyboard .chat-welcome{
    padding:13px 14px;
  }

  .chat-panel.has-keyboard .chat-welcome h3{
    font-size:17px;
  }

  .chat-panel.has-keyboard .chat-welcome p{
    font-size:12.5px;
    line-height:1.45;
  }

  .chat-panel.has-keyboard .chat-suggestions{
    padding:0 12px 8px;
  }

  .chat-panel.has-keyboard .chat-suggestion{
    max-width:68vw;
    padding:8px 11px;
    font-size:11px;
  }

  .chat-panel.has-keyboard .chat-inputbar{
    padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px));
  }

  .chat-panel.has-keyboard .chat-inputbar textarea{
    min-height:48px;
    max-height:86px;
    padding:12px 13px;
  }

  .chat-panel.has-keyboard .chat-send{
    min-width:48px;
    width:48px;
    height:48px;
    min-height:48px;
  }
}

@media(max-width:430px){
  .chat-panel{
    left:calc(var(--chat-visual-left,0px) + 6px);
    top:calc(var(--chat-visual-top,0px) + 6px);
    width:calc(var(--chat-visual-width,100vw) - 12px);
    height:calc(var(--chat-visual-height,100dvh) - 12px);
    max-height:calc(var(--chat-visual-height,100dvh) - 12px);
    border-radius:18px;
  }

  .chat-head{
    padding-top:12px;
  }

  .chat-title strong{
    font-size:22px;
  }
}

@media(prefers-reduced-motion:reduce){
  .chat-panel,
  .chat-panel.is-open{transition:none}
}

@media(max-width:820px) and (prefers-reduced-motion:reduce){
  .chat-panel.has-keyboard,
  .chat-panel.is-open.has-keyboard{
    transform:translateY(0) scale(1);
  }
}

@media(max-width:600px) and (prefers-reduced-motion:reduce){
  .chat-panel,
  .chat-panel.is-open{
    transform:translateY(0) scale(1);
  }
}

/* the chip rail scrolls horizontally — fade its right edge so a clipped chip
   reads as "there is more", not as a broken layout */
.chat-suggestions{
  -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent 100%);
  mask-image:linear-gradient(90deg,#000 88%,transparent 100%);
}
.chat-suggestions::-webkit-scrollbar{display:none}

/* ==========================================================================
   COMMUNITY CARDS (2026-08-20): the live feed cards were still built for the
   old dark landing — dark panel surface, near-black media wells, smoked-glass
   badges and a leftover purple avatar — while the section around them is now
   light. Re-tone the whole card to the page palette: white surface, Midnight
   Blue type, per-type accent badges, teal hover. Markup and JS untouched.
   ========================================================================== */
.proof-grid .ls-card{
  border:0;
  border-radius:18px;
  background:linear-gradient(180deg,#fff,var(--tx-white));
  box-shadow:
    0 12px 34px rgba(var(--tx-blue-rgb),.09),
    0 0 0 1px rgba(var(--tx-blue-rgb),.07);
  color:var(--tx-blue);
}

.proof-grid .ls-card:hover,
.proof-grid .ls-card:focus-visible{
  transform:translateY(-8px);
  background:#fff;
  box-shadow:
    0 26px 58px rgba(var(--tx-blue-rgb),.16),
    0 0 0 1px rgba(var(--tx-teal-rgb),.26);
}

/* light media well — a slow or broken thumbnail no longer flashes black */
.proof-grid .ls-card-media{
  background:linear-gradient(160deg,rgba(var(--tx-yellow-rgb),.5),rgba(var(--tx-blue-rgb),.06));
}

/* ---- overlays on the thumbnail ---------------------------------------- */
.proof-grid .ls-card-badge{
  border:0;
  background:rgba(255,255,255,.9);
  box-shadow:inset 0 0 0 1px rgba(var(--tx-blue-rgb),.1);
  color:var(--tx-blue);
}

.proof-grid .ls-card.is-model .ls-card-badge{
  color:var(--tx-blue);
  box-shadow:inset 0 0 0 1px rgba(var(--tx-blue-rgb),.24);
}

.proof-grid .ls-card.is-image .ls-card-badge{
  color:var(--tx-teal);
  box-shadow:inset 0 0 0 1px rgba(var(--tx-teal-rgb),.3);
}

.proof-grid .ls-card.is-video .ls-card-badge{
  color:#c93c11;
  box-shadow:inset 0 0 0 1px rgba(var(--tx-orange-rgb),.34);
}

.proof-grid .ls-card.is-animated .ls-card-badge{
  color:var(--tx-red);
  box-shadow:inset 0 0 0 1px rgba(var(--tx-red-rgb),.3);
}

.proof-grid .ls-card-time{
  background:rgba(255,255,255,.86);
  box-shadow:inset 0 0 0 1px rgba(var(--tx-blue-rgb),.08);
  color:rgba(var(--tx-blue-rgb),.66);
}

/* the hover plate sits over artwork, so it stays dark for contrast */
.proof-grid .ls-card-hover{
  background:rgba(var(--tx-blue-rgb),.82);
  color:var(--tx-white);
}

/* ---- card body --------------------------------------------------------- */
.proof-grid .ls-card-info strong{color:var(--tx-blue)}
.proof-grid .ls-card-excerpt{color:rgba(var(--tx-blue-rgb),.58)}
.proof-grid .ls-card-bottom{border-top:1px solid rgba(var(--tx-blue-rgb),.09)}
.proof-grid .ls-card-author{color:rgba(var(--tx-blue-rgb),.58)}

.proof-grid .ls-card-avatar{
  background:linear-gradient(135deg,var(--tx-yellow),#fff);
  box-shadow:inset 0 0 0 1px rgba(var(--tx-red-rgb),.18);
  color:var(--tx-red);
  font-weight:800;
}

.proof-grid .ls-card-stats{color:rgba(var(--tx-blue-rgb),.56)}

.proof-grid .ls-card-stats span{
  background:rgba(var(--tx-blue-rgb),.05);
  box-shadow:inset 0 0 0 1px rgba(var(--tx-blue-rgb),.06);
}

/* ---- empty / loading state -------------------------------------------- */
.proof-grid .ls-empty{
  border:1px dashed rgba(var(--tx-blue-rgb),.2);
  border-radius:18px;
  background:rgba(255,255,255,.44);
  color:rgba(var(--tx-blue-rgb),.55);
}

@media(max-width:760px){
  .hero-cap-card--model{
    --hero-model-x:67%;
    --hero-model-w:82%;
  }

  .hero-cap-card--model .hero-model-stage::before{
    background:
      linear-gradient(180deg,rgba(4,6,10,.18) 0%,rgba(4,6,10,.58) 62%,rgba(4,6,10,.88) 100%),
      linear-gradient(90deg,rgba(4,6,10,.66),transparent 70%);
  }

  .hero-cap-card--model .hero-model-stage::after{
    bottom:22%;
    width:48%;
  }

  .hero-cap-card--model .hero-model-stage model-viewer{
    top:-2%;
    right:-18%;
    bottom:22%;
    width:86%;
    height:78%;
  }

  .hero-cap-card--model .hero-model-poster{
    inset:0 -14% 24% auto;
    width:86%;
    height:72%;
  }

  .hero-cap-card--model .hero-model-stage[data-model-fit="wide"] model-viewer,
  .hero-cap-card--model .hero-model-stage[data-model-fit="product"] model-viewer{
    right:-12%;
    width:78%;
  }

  .hero-cap-card--model .hero-model-stage[data-model-fit="wide"] .hero-model-poster,
  .hero-cap-card--model .hero-model-stage[data-model-fit="product"] .hero-model-poster{
    right:-8%;
    width:78%;
  }

  .hero-cap-card--model .hero-model-hologram--one{
    left:52%;
    top:12%;
    width:30%;
    height:42%;
  }

  .hero-cap-card--model .hero-model-hologram--two{
    right:8%;
    top:20%;
  }

  .hero-cap-card--model .hero-model-hologram--three{
    left:34%;
    top:27%;
  }

  .hero-cap-card--model strong{
    max-width:11ch;
  }

  .hero-cap-card--model p{
    max-width:22ch;
  }
}

@media(max-width:430px){
  .hero-cap-card--model .hero-model-stage model-viewer{
    right:-20%;
    width:90%;
  }

  .hero-cap-card--model .hero-model-poster{
    right:-16%;
    width:90%;
  }

  .hero-cap-card--model .hero-model-stage[data-model-fit="wide"] model-viewer,
  .hero-cap-card--model .hero-model-stage[data-model-fit="product"] model-viewer{
    right:-12%;
    width:72%;
  }

  .hero-cap-card--model .hero-model-stage[data-model-fit="wide"] .hero-model-poster,
  .hero-cap-card--model .hero-model-stage[data-model-fit="product"] .hero-model-poster{
    right:-9%;
    width:72%;
  }

  .hero-cap-card--model .hero-media-chip{
    right:12px;
    top:12px;
    max-width:calc(100% - 24px);
  }
}

/* ==========================================================================
   MOBILE / TABLET HERO REARRANGE — 2026-08-22
   --------------------------------------------------------------------------
   Why this block exists:

   The hero deck was sized by UNSCOPED rules earlier in this file —
   .hero-cap-card--model hard-set flex-basis:clamp(480px,36vw,620px) and
   min-height:420px with no media query. index-palette.css loads AFTER
   homepage-responsive.css, so those values beat its @media(max-width:767px)
   block entirely. Measured on a 375px viewport before this fix:

     model card   480x420  (128% of viewport width)
     video card   390x420  (104% of viewport width)
     other cards  280x420
     hero section 1418px tall

   The uniform 420px height came from the model card: .hero-product-surface
   is a stretch row, so the tallest member sets the height for all six.

   Fix below re-scopes the OUTER FOOTPRINT (width + height) per breakpoint.
   The model card's internal model-viewer art direction in the
   @media(max-width:760px) / (max-width:430px) blocks above is deliberate
   and left untouched.
   ========================================================================== */

/* ---- Tablet: keep the deck horizontally scrollable, but stop the two
        feature cards from monopolising the row ---------------------------- */
@media(max-width:1024px){
  .hero-cap-card{
    flex-basis:clamp(240px,32vw,300px);
    min-height:clamp(210px,26vh,270px);
  }

  .hero-cap-card--feature{
    flex-basis:clamp(300px,42vw,380px);
    min-height:clamp(230px,28vh,290px);
  }

  .hero-cap-card--video,
  .hero-cap-card--model{
    flex-basis:clamp(320px,46vw,420px);
    min-height:clamp(240px,29vh,310px);
  }
}

/* ---- Phone: one uniform card size, derived from the viewport so the next
        card always peeks. That peek is the only scroll affordance the deck
        has on touch, so it has to survive. ------------------------------- */
@media(max-width:767px){
  .hero-card-deck{
    margin-top:12px;
  }

  .hero-product-surface{
    gap:12px;
    padding:6px 16px 14px;
    scroll-padding-inline:16px;
  }

  /* All four selectors together — a stretch row is only as short as its
     tallest member, so the feature/video/model cards must come down too
     or they drag the plain cards back up to their height. */
  .hero-cap-card,
  .hero-cap-card--feature,
  .hero-cap-card--video,
  .hero-cap-card--model{
    flex-basis:min(74vw,290px);
    min-height:min(48vw,200px);
    padding:14px;
    border-radius:16px;
  }

  .hero-cap-card strong,
  .hero-cap-card--feature strong,
  .hero-cap-card--model strong{
    max-width:15ch;
    font-size:16px;
    line-height:1.2;
  }

  .hero-cap-card p,
  .hero-cap-card--feature p,
  .hero-cap-card--model p{
    max-width:30ch;
    font-size:11.5px;
    line-height:1.38;
  }

  .hero-cap-kicker{
    font-size:9.5px;
  }

  .hero-cap-icon{
    font-size:10px;
  }

  .hero-card-arrow{
    top:38px;
    width:36px;
    height:36px;
    font-size:15px;
  }
}

/* ---- Small phones: shave the last few pixels ------------------------- */
@media(max-width:430px){
  .hero-cap-card,
  .hero-cap-card--feature,
  .hero-cap-card--video,
  .hero-cap-card--model{
    flex-basis:min(78vw,268px);
    min-height:min(50vw,184px);
    padding:13px;
  }

  .hero-cap-card strong,
  .hero-cap-card--feature strong,
  .hero-cap-card--model strong{
    font-size:15px;
  }
}

/* ==========================================================================
   PROMPT RECIPES — 2x2 ON MOBILE
   --------------------------------------------------------------------------
   landing.css collapses .prompt-recipes__grid to a single column at
   <=760px, giving a 440px-tall stack of four full-width rows. Requested
   layout is 2x2. The horizontal "icon | copy" card does not survive a
   ~153px column, so the card stacks to icon-over-copy at the same time.
   ========================================================================== */
@media(max-width:760px){
  .prompt-recipes__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    /* equal rows: "Image to 3D reference" wraps to two lines and would
       otherwise make the bottom row 15px taller than the top */
    grid-auto-rows:1fr;
    gap:8px;
  }

  .prompt-recipe{
    grid-template-columns:minmax(0,1fr);
    gap:8px;
    min-height:0;
    padding:11px;
    border-radius:14px;
    /* the hero centres its text on mobile; once the icon stacks above the
       copy that inherited centring leaves a left-flush icon over centred
       text, so pin the whole tile left like the desktop card */
    justify-items:start;
    text-align:left;
  }

  .prompt-recipe__icon{
    width:28px;
    height:28px;
    border-radius:10px;
    font-size:12px;
  }

  .prompt-recipe__copy{
    gap:4px;
  }

  .prompt-recipe strong{
    font-size:12.5px;
    line-height:1.18;
  }

  .prompt-recipe small{
    padding:3px 6px;
    font-size:8.5px;
    letter-spacing:.06em;
  }

  /* Two lines of description keeps all four tiles the same height without
     hard-coding one; overflow past that is clipped rather than ragged. */
  .prompt-recipe span span{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    line-clamp:2;
    overflow:hidden;
    font-size:10.5px;
    line-height:1.34;
  }
}

/* Very narrow: the description is the first thing to go, so the title and
   its CTA badge stay readable rather than all three fighting for room. */
@media(max-width:360px){
  .prompt-recipe span span{
    display:none;
  }

  .prompt-recipe{
    padding:10px;
  }
}