/* The Answer Atlas / AI photo prompt showcase. Scoped to opt-in gallery surfaces. */
.ai-promo{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(180px,.8fr);gap:2.5rem;align-items:center;background:#182832;color:#fff;margin-block:2.5rem 3rem;border-radius:18px;padding:clamp(1.25rem,4vw,3rem);overflow:hidden}
.ai-promo-copy h2{font-family:Syne,sans-serif;font-weight:750;line-height:1.1;font-size:clamp(1.7rem,3.2vw,2.8rem);letter-spacing:-.04em;margin:.55rem 0 1rem}
.ai-promo-copy p{color:#d0d9d9;max-width:52ch;font-size:1.02rem;line-height:1.55}
.ai-promo-copy a{display:inline-flex;color:#101b22;background:#e7faa2;text-decoration:none;font-weight:750;padding:.8rem 1.1rem;border-radius:99px;margin-top:1.1rem}
.ai-promo img{display:block;width:100%;max-height:280px;object-fit:cover;aspect-ratio:1;border-radius:14px}
.ai-showcase{max-width:1250px;margin-inline:auto;padding-bottom:7rem;overflow-x:clip}
.ai-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(240px,.8fr);align-items:center;gap:clamp(1.2rem,4vw,4rem);padding:3rem 0 3.25rem}
.ai-hero h1{font-family:Syne,sans-serif;font-size:clamp(2.4rem,5.1vw,5.1rem);font-weight:800;letter-spacing:-.065em;line-height:1.06;margin:1.3rem 0}
.ai-hero p{font-size:clamp(1.08rem,1.6vw,1.4rem);max-width:57ch;color:#42545b;line-height:1.6}
.ai-hero-art{position:relative;max-width:430px;margin-left:auto}
.ai-hero-art:before{content:"";position:absolute;inset:-.8rem;background:#dae9d1;transform:rotate(5deg);border-radius:18px}
.ai-hero-art img{position:relative;display:block;width:100%;border-radius:16px;box-shadow:0 25px 60px #17242a22;aspect-ratio:4/5;object-fit:cover}
.ai-hero-tags{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:1.7rem}
.ai-hero-tags span{border:1px solid #b2c0bd;border-radius:100px;font-weight:700;letter-spacing:.06em;font-size:.7rem;padding:.45rem .7rem}
.ai-notice{border-left:4px solid #9fba7d;background:#eef4e5;padding:1.1rem 1.4rem;margin-bottom:2.5rem;border-radius:0 14px 14px 0}
.ai-notice strong{font-size:.88rem}
.ai-notice p{margin:.35rem 0;color:#41544a;font-size:.98rem;line-height:1.6}
.ai-jump{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin:2rem 0 3.5rem}
.ai-jump a{border:1px solid #d1d6cf;background:white;min-height:90px;padding:1rem;display:flex;align-items:flex-start;gap:.6rem;border-radius:12px;text-decoration:none;color:#17262d;font-weight:700;line-height:1.4}
.ai-jump a span{font-weight:800;color:#687a70}
.ai-jump a:hover,.ai-jump a:focus-visible{border-color:#20342e;background:#f4f9ed}
.ai-example{scroll-margin-top:2rem;margin:3rem 0 5rem;padding-top:2rem;border-top:2px solid #dce5d9}
.ai-example-top{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.3rem;color:#5c6a61;font-size:.78rem;font-weight:750;letter-spacing:.09em}
.ai-number{color:#152b26;font-family:Syne,sans-serif;font-size:1.45rem}
.ai-example-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(1.5rem,3vw,2.25rem);max-width:900px;margin:0 auto;align-items:start}
.ai-preview{position:static;width:min(100%,720px);margin:0 auto}
.ai-preview img{display:block;width:100%;height:auto;border-radius:17px;object-fit:cover;box-shadow:0 18px 52px #132c3030;background:#e0e7df}
.ai-preview figcaption{font-size:.76rem;color:#5e6b67;letter-spacing:.035em;margin-top:.8rem}
.ai-detail h2{font-family:Syne,sans-serif;font-size:clamp(1.7rem,3vw,2.8rem);line-height:1.18;letter-spacing:-.04em;margin:0 0 .7rem}
.ai-summary{font-size:1.05rem;line-height:1.6;color:#4a5954}
.ai-howto{background:#fff;border-radius:16px;border:1px solid #e0e5df;padding:1.25rem 1.5rem;margin:1.5rem 0}
.ai-howto h3,.ai-prompt-title h3{font-size:.92rem;letter-spacing:.025em;margin:.6rem 0}
.ai-howto p,.ai-howto li{line-height:1.6;color:#3e514a;font-size:.93rem}
.ai-howto ol{padding-left:1.45rem;margin:.6rem 0}
.ai-howto li+li{margin-top:.5rem}
.ai-prompt-title{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.ai-copy{appearance:none;border:0;border-radius:100px;background:#10252d;color:#e4f5ad;padding:.72rem 1.1rem;font:700 .85rem/1.2 'DM Sans',sans-serif;cursor:pointer;min-height:44px}
.ai-copy:hover,.ai-copy:focus-visible{background:#24463e;color:#fff;outline-offset:2px}
.ai-prompt{white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal;overflow:auto;margin:.7rem 0;border-radius:14px;border:1px solid #d8e0d6;background:#f6f8f2;padding:1.15rem 1.25rem;max-height:370px;color:#243d33;font:400 .89rem/1.68 'DM Sans',sans-serif}
.ai-prompt code{font:inherit;white-space:pre-wrap}
.ai-feedback{min-height:1.5em;color:#285d37;font-size:.83rem;line-height:1.4;margin:.3rem 0}
.ai-end-note{margin-top:3rem}
.ai-end-note a{display:inline-block;margin-top:.75rem;color:#153b31;font-weight:750;text-decoration:underline;text-underline-offset:4px}
@media(max-width:900px){.ai-jump{grid-template-columns:repeat(2,minmax(0,1fr))}.ai-example-grid{gap:1.5rem}.ai-promo{gap:1.2rem}}
@media(max-width:650px){.ai-promo{grid-template-columns:1fr;padding:1.45rem}.ai-promo img{max-height:220px}.ai-hero{grid-template-columns:1fr;padding:1.2rem 0 2rem}.ai-hero-art{max-width:330px;width:100%;margin:1rem auto 0}.ai-jump{grid-template-columns:1fr;margin:1.6rem 0 2.4rem}.ai-jump a{min-height:0}.ai-example-grid{grid-template-columns:1fr}.ai-preview{position:static;width:min(100%,460px);margin:0 auto}.ai-detail h2{margin-top:.5rem}.ai-example{margin:2rem 0 3rem}.ai-howto{padding:1rem}.ai-prompt{max-height:360px;font-size:.87rem}.ai-prompt-title{flex-wrap:wrap}.ai-copy{margin-left:auto}}

/* Decorative rotated accents remain inside the page, never producing document-wide horizontal scroll. */
.ai-hero{overflow-x:clip}
.ai-prompt,.ai-example,.ai-detail{min-width:0;max-width:100%}