/* Keep landing content responsive across the full page width. */
.landing-page {
  --blue-bright:#e0e0e0;
  --bundle-section-gap:1.25rem;
  -webkit-user-select:none;
  user-select:none;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:3.75rem auto auto;
}
.landing-page :is(.customer-generation-gallery,.recent-gallery-dialog) {-webkit-user-select:none;user-select:none}
.landing-page :is(input,textarea,[contenteditable="true"]) {-webkit-user-select:text;user-select:text}
.landing-page > .site-header {grid-column:1/-1;grid-row:1;padding-inline:1.5rem;background:#000;border-bottom:0}
.landing-page .header-navigation a:hover,.landing-page .header-navigation a[aria-current="page"] {background:none;border-color:#aaa;color:#eee}
.landing-page .header-meta > a,.landing-page .account-access > summary {background:#000;border-color:#ffffff24}
.landing-page .account-access > summary {border:0}
.landing-page .brand-mark {color:#ddd;border-color:#ffffff40;box-shadow:none}
.landing-page > main {grid-column:1;grid-row:2;min-width:0;container:landing-content / inline-size}
/* Keep the footer measurable so the payment artwork's visibility observer can load it. */
.landing-page > footer {grid-column:1;grid-row:3;min-height:1px;padding-inline:1.5rem;gap:1rem;background:#000;border-top:0}
.bundle-showcase {padding:1rem clamp(1rem,3cqw,2.5rem) 0}
.bundle-showcase-heading {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem 1rem}
.bundle-showcase-heading > div {display:flex;align-items:baseline;flex-wrap:wrap;gap:.25rem .75rem}
.bundle-showcase-heading h2 {margin:0;font-size:1.3rem;line-height:1.15;letter-spacing:-.025em}
.bundle-showcase-heading p {margin:0;color:#9aafc2;font-size:.7rem;line-height:1.5}
.bundle-preview-label {margin-inline:auto 2.75rem;padding:.3rem 0;border:0;color:#9aafc2;font-size:.65rem;white-space:nowrap}
.bundle-carousel {display:grid;grid-template-columns:2rem minmax(0,1fr) 2rem;align-items:center;gap:.75rem;margin-top:var(--bundle-section-gap)}
.landing-page #image-bundles + .pricing-row {padding-top:var(--bundle-section-gap)}
.landing-page #image-bundles + .pricing-row .pricing-heading {align-items:flex-start}
.bundle-previews {display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3.75rem)/6);gap:.75rem;list-style:none;padding:0;margin:0;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity}
.bundle-previews::-webkit-scrollbar {display:none}
.bundle-scroll {display:grid;place-items:center;width:2rem;height:3rem;padding:0;border:0;border-radius:.3rem;color:#dce6ef;background:#ffffff08;font:2rem/1 Georgia,serif;cursor:pointer}
.bundle-scroll:hover:not(:disabled) {background:#ffffff15;color:#fff}
.bundle-scroll:disabled {opacity:.25;cursor:default}
.bundle-scroll:focus-visible {outline:2px solid var(--blue-bright);outline-offset:3px}
.bundle-previews:focus-visible {outline:2px solid var(--blue-bright);outline-offset:4px}
.bundle-preview-card {min-width:0;aspect-ratio:1;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border:0;border-radius:.4rem;background:#000;scroll-snap-align:start}
.bundle-preview-caption {padding:.6rem .7rem;display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:.25rem .5rem}
.bundle-preview-caption h3 {margin:0;font-size:.8rem;font-weight:600;color:#e1ebf3}
.landing-page .bundle-preview-link .bundle-preview-caption span {font-size:.6rem;color:#fff}
.bundle-preview-link {width:100%;padding:0;border:0;background:transparent;font:inherit;text-align:left;cursor:pointer;position:relative;display:flex;flex:1;min-height:0;flex-direction:column;justify-content:flex-end;color:inherit;text-decoration:none}
.bundle-preview-link img {transition:transform .2s ease,filter .2s ease;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.bundle-preview-link .bundle-preview-caption {position:relative;background:linear-gradient(transparent,#000e 30%);padding-top:1.2rem}
.bundle-preview-link:focus-visible {outline:2px solid var(--blue-bright);outline-offset:-3px}
.bundle-view-all {font-size:.7rem;color:inherit;white-space:nowrap}
@container landing-content (max-width:70rem) {.bundle-previews {grid-auto-columns:calc((100% - 2.25rem)/4)}}
@container landing-content (max-width:42rem) {.bundle-previews {grid-auto-columns:calc((100% - .75rem)/2)}}

.landing-page .hero,
.landing-page .commercial-section,
.landing-page main > .launch-explainer {padding-inline:clamp(1rem,3cqw,2.5rem)}
.landing-page .hero {grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:1px 1rem;align-items:center;padding-top:0}
.landing-page .hero-copy {align-self:start}
.landing-page .hero-copy > .eyebrow {min-height:1.25rem;color:#fff}
.landing-page .hero h1 {margin-top:0;font-size:min(3.2cqw,3.2rem);line-height:1.1;white-space:nowrap;text-wrap:nowrap}
.landing-page .hero h1 span {display:inline;color:#aaa}
.landing-page .hero-intro {font-size:clamp(.8rem,1.15cqw,.9rem)}
.landing-page .creative-benefits {font-size:.85rem}
.landing-page .hero-artwork {height:clamp(23rem,32cqw,26rem);margin-block:-1rem}
.landing-page .hero-artwork > img {height:calc(100% - 1rem);margin-top:1rem;object-fit:cover;object-position:center top;opacity:.7}
.landing-page .hero .primary-cta {font-size:clamp(.62rem,.9cqw,.75rem);letter-spacing:.035em;padding:.65rem .5rem}
.landing-page .commercial-section,
.landing-page main > .launch-explainer {font-size:.9rem}
.landing-page .commercial-section h2,
.landing-page .launch-explainer h2 {font-size:clamp(1.5rem,2.65cqw,2.1rem);text-wrap:balance}
.landing-page .commercial-section h3 {font-size:1rem}
.landing-page .signature-section {grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:1.25rem}
.landing-page .gallery-feature {gap:1.5rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.landing-page .pricing-heading {flex-wrap:wrap}
.landing-page .plan-preview .plan-grid {grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.landing-page .plan-preview .plan-card {padding:.85rem}
.landing-page .topup-packs {grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.landing-page .topup-packs li {flex-direction:row;align-items:center;font-size:.85rem}
.landing-page .fx-effect span {font-size:clamp(.6rem,.95cqw,.75rem)}

@container landing-content (min-width:70rem) {
  .landing-page .recent-work-compact {margin-left:-3rem;margin-right:-1.5rem}
  .landing-page .recent-work-compact .recent-project {flex-basis:max(8rem,calc((100% - 1.6rem)/4.5))}
}
@container landing-content (max-width:56rem) {
  .landing-page .plan-preview .plan-grid,
  .landing-page .topup-packs {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@container landing-content (max-width:48rem) {
  .landing-page .hero {grid-template-columns:minmax(0,1fr)}
  .landing-page .hero h1 {font-size:min(6.4cqw,2.65rem)}
  .landing-page .hero-artwork {height:23rem;margin:0}
  .landing-page .recent-work-compact {grid-column:1;margin-top:-1rem}
  .landing-page .hero-copy {max-width:38rem}
  .landing-page .hero-intro {font-size:.9rem}
  .landing-page .hero .primary-cta {font-size:.7rem}
}
@container landing-content (max-width:38rem) {
  .landing-page .signature-section,
  .landing-page .gallery-feature {grid-template-columns:minmax(0,1fr);gap:1rem}
  .landing-page .generation-modes > div {grid-template-columns:4.6rem minmax(0,1fr);gap:.65rem}
  .landing-page .hero .primary-cta {font-size:.62rem;gap:.35rem}
  .landing-page .recent-work-body {gap:.5rem}
  .landing-page .recent-work-compact .recent-work-state p {font-size:.65rem}
}
@container landing-content (max-width:30rem) {
  .landing-page .plan-preview .plan-grid {grid-template-columns:minmax(0,1fr)}
}
@media(max-width:52rem) {
  .landing-page > .site-header {padding-inline:1rem}
  .landing-page > footer {padding-inline:1rem}
}

/* Match the Recent Work thumbnail track: equal column width minus padding and arrows. */
.landing-page .hero-artwork.hero-editor-showcase {
  width:calc(93.47826% - 4.9rem);max-width:100%;height:auto;margin:0;
  align-self:start;justify-self:center;overflow:visible;background:transparent;
  /* Match the center of the equal-width Recent Work column below this 1:1.15 grid. */
  left:3.26087%;
}
.landing-page .hero-editor-showcase > .eyebrow {min-height:1.25rem;margin-bottom:calc(.65rem - 4px);justify-content:flex-start;color:#fff;position:relative;top:4px}
.landing-page .hero-editor-showcase::before {content:none}
.landing-page .hero-editor-showcase > img {
  height:auto;margin:0;object-fit:contain;opacity:1;
  border:0;border-radius:.5rem;
}
.landing-page .hero-editor-showcase .hero-overlays {position:static;display:block;margin-top:calc(.25rem + 2px)}
.landing-page .hero-editor-showcase .hero-action-panel {position:static;width:min(100%,24rem);margin-inline:auto;transform:none}
.landing-page :is(#account-generations,#recent-work),
.landing-page .hero-editor-showcase .hero-action-panel {translate:0 6px}
@container landing-content (max-width:48rem) {
  .landing-page .hero-artwork.hero-editor-showcase {width:100%;left:0}
}
.landing-page .hero-editor-showcase .primary-cta {
  min-height:2.75rem;background:rgba(0,0,0,.8);color:#fff;border-color:#fff;
  justify-content:center;padding-inline:.35rem;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
@container landing-content (min-width:48.01rem) {
  .landing-page .hero-editor-showcase .hero-action-panel {width:min(100%,26rem)}
  .landing-page .hero-editor-showcase .hero-actions {grid-template-columns:repeat(2,minmax(0,1fr))}
  .landing-page .hero-editor-showcase .primary-cta > span {white-space:nowrap}
}
.landing-page .hero-editor-showcase .generate-cta .cta-ai-word {color:#aaa}
.landing-page .hero-editor-showcase .primary-cta:hover,
.landing-page .hero-editor-showcase .primary-cta:focus-visible {
  border-color:#fff;
  background:linear-gradient(115deg,#ffffff29,#ffffff0f 55%,#ffffff1f),rgba(0,0,0,.8);
  box-shadow:inset 0 0 1.25rem #ffffff10,0 0 .85rem #ffffff26;
}

/* Compact bundle/header controls, using the existing monochrome landing style. */
.bundle-preview-link:hover:not(:disabled) img {transform:scale(1.025);filter:brightness(1.06)}
.bundle-preview-link:hover:not(:disabled) {box-shadow:inset 0 0 1rem #ffffff18}
.landing-page .header-meta {gap:.65rem}
.landing-page .header-meta > [data-editor-availability] {display:inline-flex;max-width:7.5rem;line-height:1.2;font-size:.62rem;letter-spacing:0}
.landing-page #bundle-cart-toggle {position:relative;width:2.25rem;height:2.25rem;min-height:2.25rem;padding:.35rem;border:0;background:transparent;color:#ddd}
.landing-page #bundle-cart-toggle:hover {color:#fff;background:#ffffff0c}
.landing-page #bundle-cart-badge {position:absolute;right:-.1rem;top:.05rem;font-size:.55rem;color:#fff}
@media(max-width:26rem) {
  .landing-page > .site-header {padding-inline:.7rem;gap:.4rem}
  .landing-page .header-meta {gap:.25rem}
  .landing-page .header-meta > [data-editor-availability] {max-width:5.3rem}
  .landing-page .brand {font-size:.55rem;gap:.4rem}
  .landing-page .brand-mark {width:1.4rem;height:1.4rem}
  .landing-page .account-access summary {width:3.6rem;font-size:.6rem;gap:.2rem}
  .landing-page .account-access summary svg {width:.9rem}
}
@media(prefers-reduced-motion:reduce) {.bundle-preview-link img {transition:none}.bundle-preview-link:hover:not(:disabled) img {transform:none}}

@media(max-width:68rem) {
  .landing-page {grid-template-rows:auto auto auto}
  .landing-page > .site-header {flex-wrap:wrap;row-gap:0;padding-block:.25rem}
  .landing-page .header-navigation {display:flex;order:3;width:100%;justify-content:space-between;gap:.35rem;font-size:.62rem}
  .landing-page .header-navigation a {padding:.5rem .2rem;white-space:nowrap}
}