@keyframes saIn { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: translateY(0); } }
@keyframes saProg { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes saDrift1 { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(60px,-40px) scale(1.16); } }
@keyframes saDrift2 { 0%,100% { transform: translate(0,0) scale(1.05); } 50% { transform: translate(-70px,30px) scale(.92); } }
@keyframes saDrift3 { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(40px,60px) scale(1.2); } }
@keyframes saMarq { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes saMarqR { from { transform: translateX(-50%); } to { transform: translateX(0); } }
@keyframes saPulse { 0%,100% { opacity: .55; transform: scale(1); } 50% { opacity: 1; transform: scale(1.08); } }
@keyframes saSpin { to { transform: rotate(360deg); } }
@keyframes saFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes saRise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: translateY(0); } }
@keyframes saShine { to { left: 140%; } }
*{box-sizing: border-box;}
html{scroll-behavior: smooth; scroll-padding-top: 150px;}
body{margin: 0; background: #08080a;}
::selection{background: rgba(255,255,255,.18); color: #fff;}
[data-pg="ai-news-article"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 20%;}
[data-pg="blog-article"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 20%;}
[data-pg="ai-news"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 22%;}
[data-pg="blog"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 22%;}
[data-pg="chat-models"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 22%;}
[data-pg="contact"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 22%;}
[data-pg="image-models"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 22%;}
[data-pg="pricing"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 22%;}
[data-pg="video-models"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 22%;}
[data-pg="chat-model"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 24%;}
[data-pg="image-model"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 24%;}
[data-pg="video-model"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 24%;}
[data-pg="home"] [data-sa~="rv"]{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 26%;}
[data-sa~="prog"]{transform-origin: left; transform: scaleX(0); animation: saProg linear; animation-timeline: scroll(root);}
[data-pg="ai-news-article"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease;}
[data-pg="blog-article"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease;}
[data-pg="contact"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease;}
[data-pg="pricing"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease;}
[data-pg="ai-news"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease, opacity .3s ease;}
[data-pg="blog"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease, opacity .3s ease;}
[data-pg="chat-models"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease, opacity .3s ease;}
[data-pg="image-models"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease, opacity .3s ease;}
[data-pg="video-models"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease, opacity .3s ease;}
[data-pg="chat-model"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease, box-shadow .35s ease;}
[data-pg="image-model"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease, box-shadow .35s ease;}
[data-pg="home"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease, box-shadow .35s ease;}
[data-pg="video-model"] [data-sa~="card"]{transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s ease, background .35s ease, box-shadow .35s ease;}
[data-pg="ai-news-article"] [data-sa~="art"]{grid-template-columns: minmax(0,1fr) 280px; gap: 52px;}
[data-pg="blog-article"] [data-sa~="art"]{grid-template-columns: 230px minmax(0,1fr); gap: 56px;}
[data-sa~="rel"]{display: grid; grid-template-columns: repeat(3,1fr); gap: 20px;}
[data-pg="ai-news-article"] [data-sa~="ar"] p{font-family: 'Geist', sans-serif; font-weight: 350; font-size: 17px; line-height: 1.8; color: rgba(255,255,255,.72); margin: 0 0 22px;}
[data-pg="blog-article"] [data-sa~="ar"] p{font-family: 'Geist', sans-serif; font-weight: 350; font-size: 17px; line-height: 1.8; color: rgba(255,255,255,.7); margin: 0 0 22px;}
[data-pg="ai-news-article"] [data-sa~="ar"] h2{font-family: 'Space Grotesk', sans-serif; font-size: clamp(23px,2.8vw,30px); font-weight: 600; letter-spacing: -.02em; color: #fff; margin: 44px 0 16px; scroll-margin-top: 110px;}
[data-pg="blog-article"] [data-sa~="ar"] h2{font-family: 'Space Grotesk', sans-serif; font-size: clamp(24px,3vw,32px); font-weight: 600; letter-spacing: -.02em; color: #fff; margin: 48px 0 18px; scroll-margin-top: 110px;}
[data-sa~="ar"] ul{margin: 0 0 22px; padding-left: 20px;}
[data-pg="ai-news-article"] [data-sa~="ar"] li{font-family: 'Geist', sans-serif; font-size: 16.5px; line-height: 1.7; color: rgba(255,255,255,.7); margin-bottom: 8px;}
[data-pg="blog-article"] [data-sa~="ar"] li{font-family: 'Geist', sans-serif; font-size: 16.5px; line-height: 1.7; color: rgba(255,255,255,.68); margin-bottom: 8px;}
[data-sa~="ar"] strong{color: #fff; font-weight: 600;}
[data-sa~="ar"] a{color: #fff; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255,255,255,.3);}
[data-sa~="feat2"]{grid-template-columns: 1.4fr 1fr;}
[data-pg="ai-news"] [data-sa~="layout"]{grid-template-columns: 1fr 320px;}
[data-pg="contact"] [data-sa~="layout"]{grid-template-columns: 1.2fr .9fr;}
[data-sa~="ng"]{display: grid; grid-template-columns: 1fr 1fr; gap: 18px;}
[data-sa~="ar"] h3{font-family: 'Space Grotesk', sans-serif; font-size: 20px; font-weight: 600; color: #fff; margin: 32px 0 12px;}
[data-sa~="feat"]{grid-template-columns: 1.1fr .9fr;}
[data-sa~="bgrid"]{display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;}
[data-sa~="stag"] > *{animation: saIn linear both; animation-timeline: view(); animation-range: entry 2% cover 20%;}
[data-sa~="prose"]{grid-template-columns: 1fr 320px;}
[data-sa~="g3"]{display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;}
[data-sa~="g2"]{display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px;}
[data-pg="chat-model"] [data-sa~="cmp"]{grid-template-columns: 1.4fr 1fr 1fr 1fr;}
[data-pg="pricing"] [data-sa~="cmp"]{grid-template-columns: 2fr 1fr 1fr 1fr 1fr;}
[data-sa~="price4"]{display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; align-items: stretch;}
[data-sa~="mgrid"]{display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;}
[data-sa~="2"]{grid-template-columns: 1fr 1fr;}
[data-sa~="foffices"]{grid-template-columns: 1fr 1fr;}
input:focus, textarea:focus, select:focus{border-color: rgba(255,255,255,.32) !important;}
input::placeholder, textarea::placeholder{color: rgba(255,255,255,.32);}
[data-sa~="flink"]{transition: color .2s ease; text-decoration: none;}
[data-sa~="flink"]:hover{color: #fff !important;}
[data-sa~="soc"]{transition: border-color .25s ease, background .25s ease, transform .25s ease;}
[data-sa~="soc"]:hover{border-color: rgba(255,255,255,.3) !important; background: rgba(255,255,255,.06) !important; transform: translateY(-2px);}
[data-sa~="gal"]{display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;}
[data-sa~="navlink"]{position: relative;}
[data-sa~="navlink"]::after{content: ""; position: absolute; left: 0; right: 100%; bottom: -4px; height: 1px; background: rgba(255,255,255,.85); transition: right .28s cubic-bezier(.4,0,.2,1);}
[data-sa~="navlink"]:hover::after{right: 0;}
[data-sa~="navlink"]:hover{color: #fff !important;}
[data-sa~="cta-btn"]{transition: transform .2s cubic-bezier(.4,0,.2,1), box-shadow .3s ease;}
[data-sa~="cta-btn"]:hover{transform: translateY(-1px); box-shadow: 0 8px 30px rgba(255,255,255,.18);}
[data-sa~="menu-btn"]{display: none;}
[data-sa~="mobile-menu"]{display: none;}
[data-sa~="mlink"]{transition: background .2s ease, color .2s ease;}
[data-sa~="mlink"]:hover{background: rgba(255,255,255,.06) !important; color: #fff !important;}
[data-sa~="tiers"]{display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; align-items: stretch;}
[data-sa~="packs"]{display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;}
[data-sa~="marq-track"]{display: flex; width: max-content; animation: saMarq 38s linear infinite;}
[data-sa~="marq-track"][data-sa~="rev"]{animation: saMarqR 44s linear infinite;}
[data-sa~="marq"]:hover [data-sa~="marq-track"]{animation-play-state: paused;}
[data-sa~="grid-3"]{display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;}
[data-sa~="grid-4"]{display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px;}
[data-sa~="cats"]{display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;}
[data-sa~="bento"]{display: grid; grid-template-columns: repeat(6, 1fr); grid-auto-rows: 220px; gap: 18px;}
[data-sa~="hero-h"]{font-size: clamp(46px, 8vw, 104px);}
[data-sa~="sec-h"]{font-size: clamp(32px, 4.6vw, 60px);}
[data-sa~="demo"]{grid-template-columns: 250px 1fr;}
[data-sa~="split"]{display: grid; grid-template-columns: 1.05fr 1fr; gap: 56px; align-items: center;}
[data-sa~="load"]{transform: translateY(20px); transition: transform .8s cubic-bezier(.2,.72,.2,1);}
[data-hero].in .sa-load{transform: none;}
[data-sa~="load"][data-sa~="d1"]{transition-delay: .05s;}
[data-sa~="load"][data-sa~="d2"]{transition-delay: .15s;}
[data-sa~="load"][data-sa~="d3"]{transition-delay: .27s;}
[data-sa~="load"][data-sa~="d4"]{transition-delay: .39s;}
[data-sa~="load"][data-sa~="d5"]{transition-delay: .51s;}
[data-sa~="float"]{animation: saFloat 8s ease-in-out infinite;}
[data-sa~="shine"]{position: relative; overflow: hidden;}
[data-sa~="shine"]::after{content: ""; position: absolute; top: 0; left: -130%; width: 60%; height: 100%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.5), transparent); transform: skewX(-18deg); pointer-events: none;}
[data-sa~="shine"]:hover::after{animation: saShine .9s ease;}
[data-sa~="spot"]{position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: 0; transition: opacity .6s ease; background: radial-gradient(420px circle at var(--mx,50%) var(--my,30%), rgba(255,255,255,.06), transparent 62%);}
[data-sa~="reel"]{display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;}
@media (max-width: 940px){
[data-pg="ai-news-article"] [data-sa~="art"]{grid-template-columns: 1fr; gap: 28px;}
[data-pg="blog-article"] [data-sa~="art"]{grid-template-columns: 1fr; gap: 24px;}
[data-sa~="aside"]{display: none !important;}
[data-sa~="rel"]{grid-template-columns: 1fr;}
[data-sa~="toc"]{display: none !important;}
[data-sa~="layout"]{grid-template-columns: 1fr !important;}
[data-sa~="2"]{grid-template-columns: 1fr;}
[data-sa~="nav-center"]{display: none !important;}
[data-sa~="login"]{display: none !important;}
[data-sa~="menu-btn"]{display: flex !important;}
[data-sa~="mobile-menu"].open{display: flex !important;}
[data-sa~="cmp-wrap"]{overflow-x: auto;}
[data-sa~="cmp"]{min-width: 760px;}
}
@media (prefers-reduced-motion: reduce){
[data-sa~="rv"]{animation: none;}
[data-sa~="prog"]{animation: none; transform: scaleX(0);}
[data-sa~="rv"], [data-sa~="stag"] > *{animation: none;}
[data-sa~="rv"], [data-sa~="stag"] > *, [data-sa~="float"]{animation: none;}
[data-sa~="load"]{transform: none; transition: none;}
[data-sa~="marq-track"]{animation: none;}
[data-sa~="shine"]:hover::after{animation: none;}
[data-sa~="spot"]{display: none;}
}
@media (max-width: 1000px){
[data-sa~="layout"]{grid-template-columns: 1fr;}
[data-sa~="feat2"]{grid-template-columns: 1fr !important;}
[data-sa~="ng"]{grid-template-columns: 1fr;}
[data-sa~="bgrid"]{grid-template-columns: 1fr 1fr;}
[data-sa~="feat"]{grid-template-columns: 1fr !important;}
[data-sa~="prose"], [data-sa~="g3"], [data-sa~="g2"]{grid-template-columns: 1fr;}
[data-sa~="spy"]{display: none !important;}
[data-sa~="hero2"]{grid-template-columns: 1fr !important;}
[data-sa~="price4"]{grid-template-columns: 1fr 1fr;}
[data-sa~="mgrid"]{grid-template-columns: 1fr 1fr;}
[data-sa~="gal"]{grid-template-columns: 1fr 1fr;}
[data-sa~="grid-3"], [data-sa~="cats"]{grid-template-columns: 1fr;}
[data-sa~="grid-4"]{grid-template-columns: 1fr 1fr;}
[data-sa~="bento"]{grid-template-columns: 1fr 1fr; grid-auto-rows: 200px;}
[data-sa~="split"]{grid-template-columns: 1fr; gap: 32px;}
[data-sa~="demo"]{grid-template-columns: 1fr;}
[data-sa~="demo-side"]{display: none !important;}
[data-sa~="reel"]{grid-template-columns: 1fr 1fr;}
}
@media (max-width: 640px){
[data-sa~="bgrid"]{grid-template-columns: 1fr;}
[data-sa~="stats"]{display: grid !important; grid-template-columns: 1fr 1fr; gap: 0 !important; width: 100%; max-width: 300px; padding: 4px 0 !important;}
[data-sa~="stats"] > div:not([data-sa~="statdiv"]){align-items: center; padding: 16px 8px;}
[data-sa~="stats"] > div:nth-of-type(1), [data-sa~="stats"] > div:nth-of-type(3){border-right: 1px solid rgba(255,255,255,.1);}
[data-sa~="stats"] > div:nth-of-type(1), [data-sa~="stats"] > div:nth-of-type(2){border-bottom: 1px solid rgba(255,255,255,.1);}
[data-sa~="statdiv"]{display: none !important;}
[data-sa~="bento-cur"]{flex-direction: column !important; align-items: stretch !important; gap: 20px !important;}
[data-sa~="reel"]{grid-template-columns: 1fr;}
}
@media (max-width: 720px){
[data-sa~="cmp"]{font-size: 12px;}
}
@media (max-width: 560px){
[data-sa~="price4"]{grid-template-columns: 1fr;}
[data-sa~="tiers"]{grid-template-columns: 1fr;}
}
@media (max-width: 680px){
[data-sa~="mgrid"]{grid-template-columns: 1fr;}
}
@media (max-width: 860px){
[data-sa~="foot-grid"]{grid-template-columns: 1fr 1fr !important;}
[data-sa~="foot-brand"]{grid-column: 1 / -1 !important;}
}
@media (max-width: 1080px){
[data-sa~="tiers"]{grid-template-columns: 1fr 1fr;}
}
@media (max-width: 760px){
[data-sa~="packs"]{grid-template-columns: 1fr;}
}
@media (max-width: 620px){
[data-sa~="grid-4"]{grid-template-columns: 1fr;}
[data-sa~="bento"]{grid-template-columns: 1fr;}
}
[data-sa~="az0"]{animation: saDrift1 22s ease-in-out infinite}
[data-sa~="az1"]{animation: saDrift1 20s ease-in-out infinite}
[data-sa~="az2"]{animation: saDrift2 26s ease-in-out infinite}
[data-sa~="az3"]{animation: saDrift2 24s ease-in-out infinite}
[data-sa~="az4"]{animation: saDrift1 18s ease-in-out infinite}
[data-sa~="az5"]{animation: saDrift2 22s ease-in-out infinite}
[data-sa~="az6"]{animation: saDrift3 26s ease-in-out infinite}
[data-sa~="az7"]{animation: saDrift1 30s ease-in-out infinite}
[data-sa~="az8"]{animation: saSpin 1.1s linear infinite}
[data-sa~="az9"]{animation: saDrift3 28s ease-in-out infinite}
[data-sa~="az10"]{animation: saPulse 2.4s ease-in-out infinite}
.ai-news-article-header__label-10:hover{border-color: rgba(255,255,255,.3)}
.ai-news-article-body-sidebar__link-3:hover{background: rgba(255,255,255,.04)}
.ai-news-article-body-sidebar__btn:hover{transform: translateY(-2px)}
.ai-news-article-related__link:hover{transform: translateY(-5px); border-color: rgba(255,255,255,.22)}
.ai-news-featured__card:hover{border-color: rgba(255,255,255,.24); transform: translateY(-3px)}
.ai-news-layout-latest-sidebar__link:hover{transform: translateY(-4px); border-color: rgba(255,255,255,.22)}
.ai-news-layout-latest-sidebar__link-2:hover{background: rgba(255,255,255,.04)}
.blog-article-related__link:hover{transform: translateY(-5px); border-color: rgba(255,255,255,.22)}
.blog-article-cta__btn:hover{transform: translateY(-2px); box-shadow: 0 16px 44px rgba(255,255,255,.22)}
.blog-featured__card:hover{border-color: rgba(255,255,255,.24); transform: translateY(-3px)}
.blog-grid__card:hover{transform: translateY(-5px); border-color: rgba(255,255,255,.22)}
.chat-model-hero__btn:hover{transform: translateY(-2px); box-shadow: 0 12px 36px rgba(255,255,255,.2)}
.chat-model-hero__link-2:hover{background: rgba(255,255,255,.1)}
.chat-model-features__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.chat-model-usecases__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.chat-model-prompts__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.chat-model-howto__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.chat-model-pricing__wrap-3:hover{transform: translateY(-6px); border-color: rgba(255,255,255,.22)}
.chat-model-pricing__btn:hover{background: rgba(255,255,255,.12)}
.chat-model-pricing__wrap-8:hover{transform: translateY(-6px) scale(1.035); border-color: rgba(124,108,255,.8)}
.chat-model-pricing__btn-2:hover{opacity:.88}
.chat-model-related__link-2:hover{transform: translateY(-4px); border-color: rgba(255,255,255,.22)}
.chat-model-cta__btn:hover{transform: translateY(-2px); box-shadow: 0 16px 44px rgba(255,255,255,.25)}
.chat-model-cta__link:hover{background: rgba(255,255,255,.12)}
.chat-models-grid__card:hover{transform: translateY(-5px); border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.045)}
.chat-models-grid__card-2:hover{transform: translateY(-5px); border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.045)}
.chat-models-compare-strip__btn:hover{transform: translateY(-2px); box-shadow: 0 16px 44px rgba(255,255,255,.22)}
.chat-models-compare-strip__link:hover{background: rgba(255,255,255,.12)}
.contact-form-info__btn:hover{transform: translateY(-2px); box-shadow: 0 12px 36px rgba(255,255,255,.2)}
.contact-form-info__wrap-7:hover{border-color: rgba(255,255,255,.2)}
.contact-form-info__link:hover{border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.05)}
.contact-form-info__link-2:hover{border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.05)}
.contact-form-info__link-3:hover{border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.05)}
.contact-form-info__link-4:hover{border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.05)}
.image-model-hero__btn:hover{transform: translateY(-2px); box-shadow: 0 12px 36px rgba(255,255,255,.2)}
.image-model-hero__link-2:hover{background: rgba(255,255,255,.1)}
.image-model-gallery__wrap-3:hover{transform: scale(1.02); border-color: rgba(255,255,255,.26)}
.image-model-gallery__wrap-4:hover{transform: scale(1.02); border-color: rgba(255,255,255,.26)}
.image-model-gallery__wrap-5:hover{transform: scale(1.02); border-color: rgba(255,255,255,.26)}
.image-model-gallery__wrap-6:hover{transform: scale(1.02); border-color: rgba(255,255,255,.26)}
.image-model-features__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.image-model-usecases__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.image-model-prompts__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.image-model-howto__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.image-model-pricing__wrap-3:hover{transform: translateY(-6px); border-color: rgba(255,255,255,.22)}
.image-model-pricing__btn:hover{background: rgba(255,255,255,.12)}
.image-model-pricing__wrap-8:hover{transform: translateY(-6px) scale(1.035); border-color: rgba(124,108,255,.8)}
.image-model-pricing__btn-2:hover{opacity:.88}
.image-model-related__link-2:hover{transform: translateY(-4px); border-color: rgba(255,255,255,.22)}
.image-model-cta__btn:hover{transform: translateY(-2px); box-shadow: 0 16px 44px rgba(255,255,255,.25)}
.image-model-cta__link:hover{background: rgba(255,255,255,.12)}
.image-models-grid__card:hover{transform: translateY(-5px); border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.045)}
.image-models-grid__card-2:hover{transform: translateY(-5px); border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.045)}
.image-models-compare-strip__btn:hover{transform: translateY(-2px); box-shadow: 0 16px 44px rgba(255,255,255,.22)}
.image-models-compare-strip__link:hover{background: rgba(255,255,255,.12)}
.pricing-tiers__wrap-2:hover{transform: translateY(-5px)}
.pricing-tiers__btn:hover{opacity: .88}
.pricing-tiers__wrap-7:hover{transform: translateY(-5px)}
.pricing-tiers__btn-2:hover{opacity: .88}
.pricing-add-on-credit-packs__wrap-3:hover{transform: translateY(-5px)}
.pricing-add-on-credit-packs__btn:hover{background: rgba(255,255,255,.12)}
.pricing-add-on-credit-packs__wrap-5:hover{transform: translateY(-5px)}
.pricing-team-cta__btn:hover{transform: translateY(-2px); box-shadow: 0 16px 44px rgba(255,255,255,.22)}
.pricing-team-cta__link:hover{background: rgba(255,255,255,.12)}
.home-hero__btn:hover{transform: translateY(-2px); box-shadow: 0 14px 40px rgba(255,255,255,.28)}
.home-hero__link:hover{background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.3)}
.home-categories__card:hover{transform: translateY(-6px); border-color: rgba(255,255,255,.24)}
.home-categories__card-2:hover{transform: translateY(-6px); border-color: rgba(255,255,255,.24)}
.home-categories__card-3:hover{transform: translateY(-6px); border-color: rgba(255,255,255,.24)}
.home-why-bento__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.home-why-bento__wrap-6:hover{border-color: rgba(255,255,255,.2)}
.home-why-bento__wrap-8:hover{border-color: rgba(255,255,255,.2)}
.home-why-bento__wrap-10:hover{border-color: rgba(255,255,255,.2)}
.home-how-it-works__wrap-3:hover{border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.04)}
.home-pricing__wrap-4:hover{transform: translateY(-6px); border-color: rgba(255,255,255,.22)}
.home-pricing__btn:hover{background: rgba(255,255,255,.12)}
.home-pricing__wrap-9:hover{transform: translateY(-6px) scale(1.035); border-color: rgba(124,108,255,.8)}
.home-pricing__btn-2:hover{opacity:.88}
.home-latest-models__card:hover{transform: translateY(-5px); border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.04)}
.home-blog-news__card:hover{border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.04)}
.home-blog-news__link:hover{background: rgba(255,255,255,.04)}
.home-final-cta__btn:hover{transform: translateY(-2px); box-shadow: 0 16px 44px rgba(255,255,255,.25)}
.home-final-cta__link:hover{background: rgba(255,255,255,.12)}
.video-model-hero__btn:hover{transform: translateY(-2px); box-shadow: 0 12px 36px rgba(255,255,255,.2)}
.video-model-hero__link-2:hover{background: rgba(255,255,255,.1)}
.video-model-reel__wrap-3:hover{transform: scale(1.02); border-color: rgba(255,255,255,.26)}
.video-model-reel__wrap-4:hover{transform: scale(1.02); border-color: rgba(255,255,255,.26)}
.video-model-reel__wrap-5:hover{transform: scale(1.02); border-color: rgba(255,255,255,.26)}
.video-model-reel__wrap-6:hover{transform: scale(1.02); border-color: rgba(255,255,255,.26)}
.video-model-features__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.video-model-usecases__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.video-model-prompts__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.video-model-workflow__wrap-3:hover{border-color: rgba(255,255,255,.2)}
.video-model-pricing__wrap-3:hover{transform: translateY(-6px); border-color: rgba(255,255,255,.22)}
.video-model-pricing__btn:hover{background: rgba(255,255,255,.12)}
.video-model-pricing__wrap-8:hover{transform: translateY(-6px) scale(1.035); border-color: rgba(124,108,255,.8)}
.video-model-pricing__btn-2:hover{opacity:.88}
.video-model-related__link-2:hover{transform: translateY(-4px); border-color: rgba(255,255,255,.22)}
.video-model-cta__btn:hover{transform: translateY(-2px); box-shadow: 0 16px 44px rgba(255,255,255,.25)}
.video-model-cta__link:hover{background: rgba(255,255,255,.12)}
.video-models-grid__card:hover{transform: translateY(-5px); border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.045)}
.video-models-grid__card-2:hover{transform: translateY(-5px); border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.045)}
.video-models-compare-strip__btn:hover{transform: translateY(-2px); box-shadow: 0 16px 44px rgba(255,255,255,.22)}
.video-models-compare-strip__link:hover{background: rgba(255,255,255,.12)}

/* CMS blog template (v8) */
.blog-article-richtext h1{color:#fff;font-size:clamp(26px,3.4vw,34px);font-weight:600;letter-spacing:-0.02em;font-family:'Space Grotesk',sans-serif;margin:0 0 20px}
.blog-article-richtext p{color:rgba(255,255,255,.7);font-size:17px;line-height:1.8;font-family:'Geist',sans-serif;font-weight:350;margin:0 0 22px}
.blog-article-richtext h2{color:#fff;font-size:clamp(24px,3vw,32px);font-weight:600;letter-spacing:-0.02em;font-family:'Space Grotesk',sans-serif;margin:48px 0 18px}
.blog-article-richtext h3{color:#fff;font-size:20px;font-weight:600;font-family:'Space Grotesk',sans-serif;margin:32px 0 12px}
.blog-article-richtext h4,.blog-article-richtext h5,.blog-article-richtext h6{color:#fff;font-family:'Space Grotesk',sans-serif;margin:28px 0 10px}
.blog-article-richtext ul,.blog-article-richtext ol{padding-left:20px;margin:0 0 22px}
.blog-article-richtext li{margin-bottom:8px;color:rgba(255,255,255,.68);font-size:16.5px;line-height:1.7;font-family:'Geist',sans-serif}
.blog-article-richtext a{color:#fff;text-decoration:underline}
.blog-article-richtext strong{color:rgba(255,255,255,.92)}
.blog-article-richtext blockquote{border-left:3px solid rgba(255,255,255,.25);padding:6px 0 6px 18px;margin:0 0 22px;color:rgba(255,255,255,.75);font-style:italic}
.blog-article-richtext img{max-width:100%;border-radius:14px;margin:8px 0 22px}
.blog-article-richtext figure{margin:0 0 22px}
/* cover image fills the framed container (removes stripe border artifact) */
.blog-article-hero-image__wrap-2{position:relative}
.blog-article-cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:21px;display:block}
.blog-article-cover-img[src=""],.blog-article-cover-img:not([src]){display:none}
/* header author photo + social */
.blog-article-author-photo{width:44px;height:44px;border-radius:50%;object-fit:cover}
.blog-article-author-social{display:flex;gap:8px;align-items:center;margin-left:14px}
.blog-article-author-social__link{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.14);color:#fff;font-size:13px;text-decoration:none}
/* author box at end of article */
.blog-article-author-box{display:flex;gap:18px;margin-top:44px;padding:24px;border-radius:18px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.025)}
.blog-article-author-box__avatar{position:relative;overflow:hidden;flex-shrink:0;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#7c6cff,#5a48e0);display:inline-flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:19px;color:#fff}
.blog-article-author-box__name{font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:600;margin:0 0 5px;color:#fff}
.blog-article-author-box__bio{font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.55);margin:0}
.blog-card-avatar{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%}
.blog-card-avatar[src=""],.blog-card-avatar:not([src]){display:none}
/* listing card avatar photos */
.blog-avatar-img[src=""],.blog-avatar-img:not([src]){display:none}
/* listing card cover images fill their framed containers */
.blog-featured__wrap-2{position:relative}
.blog-featured__cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.blog-featured__cover-img[src=""],.blog-featured__cover-img:not([src]){display:none}
.blog-grid__wrap-2{position:relative}
.blog-grid__cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.blog-grid__cover-img[src=""],.blog-grid__cover-img:not([src]){display:none}
/* grid card author line: name white (like featured), date muted; overrides card link color */
.blog-grid__label-3-1{color:rgba(255,255,255,.5)}
.blog-grid__card [data-c="author"]{color:#fff}
.blog-grid__card [data-c="date"]{color:rgba(255,255,255,.5)}
/* social links moved into author box */
.blog-article-author-box .blog-article-author-social{margin-left:0;margin-top:12px}
/* video model CMS overview richtext + reel video */
.video-model-overview__richtext p{color:rgba(255,255,255,.68);font-size:15.5px;line-height:1.75;font-family:'Geist',sans-serif;margin:0 0 16px}
.video-model-reel__wrap-3 video,.video-model-reel__wrap-4 video,.video-model-reel__wrap-5 video,.video-model-reel__wrap-6 video,[data-reel] iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}

/* Normalize provider logos on model tiles to a crisp white mark, matching the homepage slider's monochrome treatment. !important beats the runtime's inline 62% sizing. */
[data-hg="m-tile"] img,
a[href^="/ai-chat-model/"] img,
a[href^="/ai-image-model/"] img,
a[href^="/ai-video-model/"] img {
  filter: brightness(0) invert(1);
  width: 58% !important;
  height: 58% !important;
  object-fit: contain;
}

/* model page CMS overview rich text (data-hg="m-ovrt") — chat, image, video.
   The Rich Text inner <p> cannot inherit the design's *-model-overview__text-2 class, so the
   measured static-paragraph styling is reproduced here. Measured live: 16.5px / 28.875px /
   rgba(255,255,255,.66) / weight 350 / Geist, with 18px between paragraphs (previously produced by
   flex gap:18px on the *-model-overview__wrap-3 container with margin:0 on each <p>).
   Margins are used rather than flex+gap because .w-richtext carries ::before/::after clearfix
   pseudo-elements that would become phantom flex items. */
[data-hg="m-ovrt"] p{color:rgba(255,255,255,.66);font-size:16.5px;line-height:28.875px;font-family:'Geist',sans-serif;font-weight:350;margin:0 0 18px}
[data-hg="m-ovrt"] p:last-child{margin-bottom:0}

/* ================================================================
   RESPONSIVE FIXES  (v15)
   Heading scale, bento grid, pricing matrix, article layout.
   Everything is scoped to <= 991px so desktop is untouched.
   Each clamp resolves to the class's exact desktop size at 991px,
   so there is no jump at the breakpoint.
   ================================================================ */

@media (max-width: 991px) {

  /* ---- 1. Fluid heading scale ---- */
  .chat-models-hero__title,
  .image-models-hero__title,
  .video-models-hero__title {
    font-size: clamp(34px, 8.68vw, 86px);
  }

  .chat-model-hero__title,
  .pricing-hero__title {
    font-size: clamp(34px, 8.07vw, 80px);
  }

  .contact-hero__title,
  .image-model-hero__title {
    font-size: clamp(31px, 7.47vw, 74px);
  }

  .ai-news-hero__title,
  .blog-hero-search__title {
    font-size: clamp(30px, 7.27vw, 72px);
  }

  .video-model-hero__title {
    font-size: clamp(30px, 7.06vw, 70px);
  }

  .home-final-cta__title {
    font-size: clamp(29px, 6.86vw, 68px);
  }

  .chat-model-cta__title,
  .image-model-cta__title,
  .video-model-cta__title {
    font-size: clamp(24px, 5.65vw, 56px);
  }

  .blog-article-article-header__title {
    font-size: clamp(30px, 5.45vw, 54px);
  }

  .ai-news-article-header__title {
    font-size: clamp(30px, 5.25vw, 52px);
  }

  .home-how-it-works__label {
    font-size: clamp(24px, 5.25vw, 52px);
  }

  .blog-article-cta__title,
  .chat-model-howto__label,
  .chat-models-compare-strip__title,
  .image-model-howto__label,
  .image-models-compare-strip__title,
  .pricing-team-cta__title,
  .video-model-workflow__label,
  .video-models-compare-strip__title {
    font-size: clamp(24px, 4.84vw, 48px);
  }

  .chat-model-faq__title,
  .chat-model-features__title,
  .chat-model-howto__title,
  .chat-model-pricing__title,
  .chat-model-prompts__title,
  .chat-model-usecases__title,
  .contact-faq__title,
  .image-model-faq__title,
  .image-model-features__title,
  .image-model-gallery__title,
  .image-model-howto__title,
  .image-model-pricing__title,
  .image-model-prompts__title,
  .image-model-usecases__title,
  .pricing-add-on-credit-packs__title,
  .pricing-comparison-matrix__title,
  .pricing-faq__title,
  .video-model-faq__title,
  .video-model-features__title,
  .video-model-pricing__title,
  .video-model-prompts__title,
  .video-model-reel__title,
  .video-model-usecases__title,
  .video-model-workflow__title {
    font-size: clamp(24px, 4.64vw, 46px);
  }

  .chat-model-pricing__label,
  .home-pricing__label,
  .image-model-pricing__label,
  .pricing-tiers__label,
  .video-model-pricing__label {
    font-size: clamp(24px, 4.44vw, 44px);
  }

  .chat-model-overview__title,
  .image-model-overview__title,
  .video-model-overview__title {
    font-size: clamp(24px, 4.24vw, 42px);
  }

  .home-blog-news__title,
  .pricing-add-on-credit-packs__label {
    font-size: clamp(24px, 4.04vw, 40px);
  }

  /* hero utility already fluid, but its floor is too tall for phones */
  .u-heading-hero {
    font-size: clamp(33px, 8vw, 104px);
  }

  /* ---- 2. Bento grid: children carry span-3 / span-6 / row-span-2 that
        were never reset, forcing implicit tracks (a 58px card holding
        1296px of text). Force one full-width row per card. ---- */
  .u-grid-bento {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
  }
  .u-grid-bento > * {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
    min-height: 0;
  }

  /* ---- 3. Pricing comparison matrix is a fixed 800px grid clipped by a
        ~294px parent, making columns 3-5 unreachable. Let it scroll. ---- */
  .cmp-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }
  .cmp {
    min-width: 760px;
    overflow-x: visible;
  }

  /* ---- 4. Article layouts collapsed only under 768px, so iPad portrait
        rendered a 230px article column beside a 434px sidebar. ---- */
  .u-layout-article-blog,
  .u-layout-article-news {
    grid-template-columns: 1fr;
  }
  /* grid items default to min-width:auto, so a wide scrolling table inside
     the article would otherwise stretch the 1fr track past the viewport */
  .u-layout-article-blog > *,
  .u-layout-article-news > * {
    min-width: 0;
  }
}

@media (max-width: 767px) {
  /* Phone: shrink the matrix so the pinned label column plus one full plan
     column fit on screen, and so the last column never slides under the
     pinned labels at maximum scroll. The embed's own rule for .r is (0,3,0)
     and loads after this sheet, so these selectors go one level deeper. */
  .hcpr .cmp-wrap > .cmp {
    min-width: 0;
    width: max-content;
  }
  .hcpr .cmp-wrap > .cmp > .r {
    grid-template-columns: 164px repeat(4, 104px);
    padding-left: 0;
    padding-right: 14px;
  }
  .hcpr .cmp-wrap > .cmp > .grp {
    padding-left: 14px;
    padding-right: 14px;
  }
  .hcpr .cmp .r > * {
    font-size: 13px;
  }
  .hcpr .cmp .r > *:first-child {
    padding-left: 14px;
    box-sizing: border-box;
  }
}

/* ---- Wide prose tables (docs, blog posts) get their own scroller instead
      of collapsing to one word per line. Wrapper added by HG_TABLE_SCROLL. ---- */
.hc-tscroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}
@media (max-width: 767px) {
  .hc-tscroll > table {
    min-width: 560px;
  }
}

/* ---- Pricing plan cards are promoted from h3 to h2 by HG_PRICING_HEADINGS
      so the page outline does not skip a level. These mirror the embed's own
      .tier h3 / .ent h3 rules so the promotion is visually invisible. ---- */
.hcpr .tier h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 20px;
  font-weight: 600;
  margin: 0 0 6px;
}
.hcpr .ent h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.08;
  margin: 0 0 14px;
}

/* ---- Crawlable tool cards. The /tools cards are real <a href="/tool/...">
      links rendered server-side by a Collection List, so search and AI crawlers
      see them without running JavaScript. HG_TOOLS_PILLAR then moves them into
      the designed category grids. These rules style the pre-JS fallback. ---- */
[data-hg="tool-source"] .w-dyn-items {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 24px 80px;
}
[data-hg="tool-source"] .hc-card {
  min-height: 186px;
  padding: 22px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, .1);
  background: rgba(255, 255, 255, .02);
  color: #fff;
}
[data-hg="tool-source"] .hc-card h3 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17.5px;
  font-weight: 600;
  margin: 0 0 7px;
}
[data-hg="tool-source"] .hc-card p {
  font-size: 14px;
  line-height: 1.5;
  color: rgba(255, 255, 255, .52);
  margin: 0;
}
[data-hg="tool-source"] .hc-open {
  margin-top: auto;
  padding-top: 14px;
  font-size: 13.5px;
  color: rgba(255, 255, 255, .62);
}
@media (max-width: 1000px) {
  [data-hg="tool-source"] .w-dyn-items { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  [data-hg="tool-source"] .w-dyn-items { grid-template-columns: 1fr; }
}