/* Public title regions share typography and spacing; copy and colors stay owned by the page. */
@font-face {
  font-family: Poppins;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/poppins/Poppins-Regular.ttf') format('truetype');
}
@font-face {
  font-family: Poppins;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/assets/fonts/poppins/Poppins-Bold.ttf') format('truetype');
}

.sc-public-hero {
  margin-block-start: 0 !important;
  padding-block-start: var(--sc-hero-top-space) !important;
  gap: 0 !important;
}
.sc-public-hero:not(:has(.sc-public-hero__next)) { padding-block-end: 0 !important; }
.sc-public-hero.hero { min-height: 0; display: block; }
.sc-public-hero.sc-container { width: min(100%, var(--sc-container)); }
.sc-public-hero :is(.use-case-hero__inner, .model-hero__inner, .local-media-page__hero-inner) {
  gap: 0 !important;
  padding-block-start: 0 !important;
}
.sc-public-hero > :is(.sc-container, .shell) { width: min(100%, var(--sc-container)) !important; }
.sc-public-hero .sc-tool-hero,
.sc-public-hero.sc-tool-hero {
  display: block !important;
  width: min(100%, var(--sc-hero-copy-width));
  max-width: var(--sc-hero-copy-width) !important;
  min-width: 0;
  margin: 0 auto !important;
  gap: 0;
  text-align: center;
  font-family: var(--sc-font-hero);
  order: 0 !important;
  grid-row: 1 !important;
  grid-column: 1 / -1;
}
.sc-public-hero .sc-tool-hero { padding: 0 !important; }
.sc-public-hero .sc-tool-hero h1,
.sc-public-hero.sc-tool-hero h1 {
  display: block;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--sc-font-hero) !important;
  font-size: var(--sc-hero-title-size) !important;
  font-weight: 600 !important;
  font-style: normal;
  line-height: var(--sc-hero-title-leading) !important;
  letter-spacing: -.05em !important;
  text-align: center;
  text-wrap: balance;
  white-space: normal;
  overflow-wrap: anywhere;
}
.sc-public-hero .sc-tool-hero h1 :is(span, strong),
.sc-public-hero.sc-tool-hero h1 :is(span, strong) {
  display: inline;
  font: inherit !important;
  letter-spacing: inherit;
}
.sc-public-hero .sc-tool-hero__lead {
  display: block !important;
  width: 100%;
  max-width: none !important;
  margin: var(--sc-hero-lead-space) auto 0 !important;
  padding: 0 !important;
  font-family: var(--sc-font-hero) !important;
  font-size: var(--sc-hero-lead-size) !important;
  font-weight: 400 !important;
  font-style: normal;
  line-height: var(--sc-hero-lead-leading) !important;
  letter-spacing: normal !important;
  text-align: center;
  text-wrap: pretty;
  white-space: normal;
  overflow-wrap: anywhere;
}
.sc-public-hero__next {
  margin-block-start: var(--sc-hero-content-space) !important;
  order: 1 !important;
  grid-row: 2 !important;
  grid-column: 1 / -1;
}
/* Title regions contain the heading and its description; legacy badges stay out of that rhythm. */
.sc-public-hero .sc-tool-hero > :is(.sc-eyebrow, .eyebrow, .studio-eyebrow, .hero-pills, .model-hero__chips, .omni-hero__facts, .gender-hero__eyebrow, .atr-kicker, .atr-hero-meta, .sc-tool-hero__eyebrow, .badge-eyebrow, .baby-trust),
.sc-public-hero.sc-tool-hero > :is(.sc-eyebrow, .badge-eyebrow),
.sc-public-hero > .shell > :is(.eyebrow, .trust) { display: none !important; }

/* Retire the previous page-level constraints without changing workspace widths. */
.sc-public-hero .use-case-hero__inner { max-width: none !important; }
.sc-public-hero.use-case-hero--compact .sc-public-hero__next {
  width: min(100%, var(--sc-composer-width));
  margin-inline: auto;
}
.sc-public-hero .omni-hero__intro { margin-bottom: 0; }
.detector-page .main-container { padding-top: 0 !important; }
.sc-public-hero.collection-hero { max-width: var(--sc-hero-copy-width); }
.sc-public-hero__next.page-wrapper,
.sc-public-hero__next.sc-section { padding-top: 0; }
.sc-public-hero .tools-mobile-copy { display: none !important; }
@media (min-width: 1024px) {
  .sc-public-hero.sc-tool-hero { padding-inline: 0 !important; }
  .sc-public-hero > :is(.sc-container, .shell) { padding-inline: 0; }
  .prompt-collection-page main { width: min(1440px, 100%); }
  .tools-page.sc-container,
  .detector-page .main-container { width: min(var(--sc-container), calc(100% - 32px)); }
}
@media (max-width: 1023px) {
  .sc-public-hero { padding-inline: var(--sc-space-4) !important; }
  .sc-public-hero.sc-tool-hero { width: 100%; max-width: calc(var(--sc-hero-copy-width) + 32px) !important; }
  .sc-public-hero > :is(.sc-container, .shell, .atr-container) { width: 100% !important; padding-inline: 0; }
  .prompt-collection-page main,
  .detector-page .main-container { width: 100%; }
  .tools-page.sc-container { width: 100%; }
  .tools-page > .sc-public-hero__next,
  .prompt-collection-page main > .sc-public-hero__next,
  .prompt-collection-page .collection-context,
  .detector-page #detector,
  .detector-page .seo-section { margin-inline: var(--sc-space-4); }
  .sc-public-hero.anime-hero .sc-container { width: 100%; }
}
@media (max-width: 720px) {
  .sc-public-hero .tools-desktop-copy { display: none !important; }
  .sc-public-hero p.tools-mobile-copy { display: block !important; }
  .sc-public-hero h1 > .tools-mobile-copy { display: inline !important; }
}

/* v5b public page title metrics; page-specific workspaces keep their own widths. */
.sc-public-hero { --sc-hero-top-space:64px; --sc-hero-title-size:clamp(3rem,4vw,3.5rem); --sc-hero-title-leading:1.12; --sc-hero-lead-size:var(--sc-content-font-size); --sc-hero-lead-leading:1.8; --sc-hero-lead-space:24px; --sc-hero-content-space:40px; --sc-font-hero:var(--sc-font-display); }
@media(max-width:1300px) and (min-width:768px) { .sc-public-hero { --sc-hero-top-space:48px; } }
@media(max-width:767px) { .sc-public-hero { --sc-hero-top-space:32px; --sc-hero-title-size:2rem; --sc-hero-title-leading:1.16; --sc-hero-lead-size:1rem; --sc-hero-lead-space:16px; --sc-hero-content-space:32px; } }

.sc-public-hero .sc-tool-hero__lead { max-width:var(--sc-hero-lead-width)!important; color:var(--sc-color-muted); font-family:var(--sc-font-sans)!important; }
/* The approved model heading softens its secondary credit phrase. */
.sc-public-hero .sc-tool-hero h1 .sc-hero-title-tail { color:var(--sc-color-muted); font-weight:500!important; }

/* v5b supplied hero grid, curves and particles; never cover interactive content. */
.sc-has-hero-backdrop { position:relative; isolation:isolate; }
.sc-hero-backdrop{position:absolute;left:0;right:0;top:0;bottom:-60px;z-index:0;pointer-events:none;overflow:hidden;-webkit-mask:linear-gradient(#000 68%,transparent);mask:linear-gradient(#000 68%,transparent)}
.sc-hero-backdrop>*{position:absolute;inset:0}
.sc-hero-backdrop svg{width:100%;height:100%}
.sc-hero-backdrop .grid-lines{background-image:linear-gradient(rgba(255,220,180,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,220,180,.045) 1px,transparent 1px);background-size:64px 64px;background-position:center -1px;
  -webkit-mask:radial-gradient(ellipse 62% 78% at 50% 44%,transparent 18%,#000 46%,transparent 82%);mask:radial-gradient(ellipse 62% 78% at 50% 44%,transparent 18%,#000 46%,transparent 82%);animation:scHerogridDrift 60s linear infinite}
.sc-hero-backdrop .grid-dots{background-image:radial-gradient(rgba(255,190,130,.22) 1.2px,transparent 1.6px);background-size:64px 64px;background-position:-32px -33px;
  -webkit-mask:radial-gradient(ellipse 62% 78% at 50% 44%,transparent 22%,#000 50%,transparent 80%);mask:radial-gradient(ellipse 62% 78% at 50% 44%,transparent 22%,#000 50%,transparent 80%);animation:scHerogridDrift 60s linear infinite}
@keyframes scHerogridDrift{to{background-position:64px 63px}}
.sc-hero-backdrop .arc{animation:scHerobreathe 22s ease-in-out infinite alternate;-webkit-mask:radial-gradient(ellipse 30% 30% at 50% 32%,rgba(0,0,0,.2),#000);mask:radial-gradient(ellipse 30% 30% at 50% 32%,rgba(0,0,0,.2),#000)}
.sc-hero-backdrop .arc path{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round}
.sc-hero-backdrop .arc .base{stroke:rgba(244,232,214,.08);stroke-width:1}
.sc-hero-backdrop .arc .base.e{stroke:rgba(255,106,43,.22);stroke-width:1.2}
.sc-hero-backdrop .arc .flow{stroke:var(--sc-color-brand-500);stroke-width:1.6;stroke-dasharray:140 1860;opacity:.75;animation:scHeroflow 26s linear infinite}
.sc-hero-backdrop .arc .flow.f2{stroke:#ffb547;opacity:.35;stroke-dasharray:90 1910;animation-duration:34s;animation-delay:-12s}
@keyframes scHeroflow{from{stroke-dashoffset:2000}to{stroke-dashoffset:0}}
@keyframes scHerobreathe{from{opacity:.75;transform:translateY(-6px)}to{opacity:1;transform:translateY(6px)}}
.sc-hero-backdrop .stars{-webkit-mask:radial-gradient(ellipse 60% 70% at 50% 40%,rgba(0,0,0,.25),#000 70%);mask:radial-gradient(ellipse 60% 70% at 50% 40%,rgba(0,0,0,.25),#000 70%)}
.sc-hero-backdrop .stars i{position:absolute;width:var(--s);height:var(--s);border-radius:50%;background:#ffd9ad;box-shadow:0 0 6px 1px rgba(255,170,90,.45);opacity:.5;animation:scHerorise2 var(--d) linear infinite,scHerotw var(--t) ease-in-out infinite alternate}
@keyframes scHerorise2{from{transform:translateY(30px)}to{transform:translateY(-60px)}}
@keyframes scHerotw{0%{opacity:.08}100%{opacity:.6}}
.sc-hero-backdrop .cursor-glow{opacity:0;transition:opacity .8s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,40%),rgba(255,120,50,.085),transparent 70%)}
.sc-hero-backdrop.hot .cursor-glow{opacity:1}
.sc-hero-backdrop.short .arc{display:none}
.sc-hero-backdrop.short{bottom:-20px}


.sc-has-hero-backdrop > .sc-hero-backdrop { left:calc(50% - var(--sc-sidebar-width, 0px)/2); right:auto; width:var(--sc-backdrop-viewport-width, 100vw); top:calc(-1 * var(--sc-header-height, 72px)); bottom:-100px; transform:translateX(-50%); z-index:-1; }
.halloween-hero.sc-has-hero-backdrop > .sc-hero-backdrop { bottom:-60px; }
@media(max-width:767px) { .sc-hero-backdrop .grid-lines,.sc-hero-backdrop .grid-dots { background-size:44px 44px; } .sc-hero-backdrop .stars i:nth-child(n+13),.sc-hero-backdrop .cursor-glow { display:none; } .sc-hero-backdrop .arc { width:240%; left:-70%; } }
@media(prefers-reduced-motion:reduce) { .sc-hero-backdrop,.sc-hero-backdrop * { animation:none!important; transition:none!important; } .sc-hero-backdrop .flow,.sc-hero-backdrop .cursor-glow { display:none; } }