/* Shared colorful presentation for every v11 page, including legacy layouts. */
.warm-every-page{--page-tint:#eee4fa;--page-tint-end:#ffeadc;--page-accent:#74518b;--v11-bg:#f4effa;--cream:#f4effa;--paper:#f0e7f8;background:#f4effa!important}
.warm-every-page[data-warm-palette=mint]{--page-tint:#d9f0e7;--page-tint-end:#eef5cd;--page-accent:#2c735c}
.warm-every-page[data-warm-palette=peach]{--page-tint:#ffe2ce;--page-tint-end:#f0e4fa;--page-accent:#96472f}
.warm-every-page[data-warm-palette=gold]{--page-tint:#fff0ba;--page-tint-end:#ddf0e9;--page-accent:#7b5a19}
.warm-every-page .site-header{background:#f4effa!important}
.warm-every-page .warm-page-hero{background:linear-gradient(120deg,var(--page-tint),var(--page-tint-end))!important;color:#241a3a!important;border-bottom:1px solid #d7c9df}
.warm-every-page .warm-page-hero:is(.wrap){border-radius:0 0 28px 28px;padding-inline:2rem}
.warm-every-page .warm-page-hero :is(h1,.eyebrow,.v11-kicker,.v11-lede,.ag-lede){color:#241a3a!important}
.warm-every-page .warm-page-hero>div>p:not([class]),.warm-every-page .warm-page-hero>div>.subtitle,.warm-every-page .warm-page-hero>div>.lede{color:#49384f!important}
.warm-title-row{display:grid;grid-template-columns:minmax(0,1fr) 160px;align-items:center;gap:2rem;text-align:left;margin:.4rem 0 1.2rem;isolation:isolate}
.warm-title-row h1{margin:0!important;min-width:0;max-width:100%!important;overflow-wrap:break-word}
.warm-topic-art{width:160px;height:160px;position:relative;display:grid;place-items:center;background:#ffffff80;border-radius:47% 53% 60% 40%;box-shadow:9px 10px 0 #ffffff50;transform:rotate(4deg)}
.warm-topic-art img{display:block;width:140px;height:140px;object-fit:contain;transform:rotate(-4deg)}
.warm-topic-art::after{content:'✦';position:absolute;right:0;top:-12px;font-size:1.7rem;color:var(--page-accent)}
.warm-every-page .gay-intro{box-shadow:0 7px 0 #241a3a09;border-left-color:var(--page-accent)}
.warm-every-page main>section.section:not(.warm-page-hero):nth-of-type(3n+1),.warm-every-page main>section.ag-section:nth-of-type(3n+1){background:#eee5f8}
.warm-every-page main>section.section:not(.warm-page-hero):nth-of-type(3n+2),.warm-every-page main>section.ag-section:nth-of-type(3n+2){background:#e5f3ec}
.warm-every-page main>section.section:not(.warm-page-hero):nth-of-type(3n),.warm-every-page main>section.ag-section:nth-of-type(3n){background:#fff0e5}
.warm-every-page .v11-card,.warm-every-page .ag-card{border-top:5px solid #a487bc!important}
.warm-every-page .v11-card:nth-child(3n+2),.warm-every-page .ag-card:nth-child(3n+2){border-top-color:#4b9b80!important}
.warm-every-page .v11-card:nth-child(3n),.warm-every-page .ag-card:nth-child(3n){border-top-color:#d78d59!important}
.warm-every-page main>section:not(.warm-page-hero):not(.start-welcome)>div.wrap>h2::before{content:'';display:inline-block;vertical-align:middle;width:48px;height:52px;margin-right:.6rem;background:var(--page-topic-icon) center/contain no-repeat}
.warm-every-page .warm-numbered{padding-left:1.65rem;max-width:80ch}
.warm-numbered>li{position:relative;background:#eee5f8;color:#241a3a;border:1px solid #d4c5df;border-radius:16px;margin:.8rem 0;padding:1rem 1rem 1rem 4.2rem;min-height:76px;break-inside:avoid}
.warm-numbered>li:nth-child(3n+2){background:#e1f2e9;border-color:#b8d8c9}
.warm-numbered>li:nth-child(3n){background:#ffebd9;border-color:#eccbb0}
.warm-numbered>li::marker{color:var(--page-accent);font-weight:800;font-size:1.1em}
.warm-numbered>li::before{content:'';position:absolute;left:.7rem;top:1rem;width:44px;height:44px;background:var(--page-topic-icon) center/contain no-repeat}
.warm-numbered>li :is(p,strong,h2,h3){color:#241a3a}
.warm-every-page .pv-help{background:#e0f1e8;border-left:5px solid #418269;border-radius:12px}
.warm-every-page .pv-pages figure{background:#fff;border-radius:12px;padding:.7rem;box-shadow:0 5px 15px #241a3a12}
.warm-every-page main.sheet{border-top:8px solid var(--page-accent)}
/* Preserve the original dark and high-contrast reading choices. */
html[data-theme=dark] .warm-every-page{--v11-bg:#21182d;--cream:#21182d;--paper:#2c2238;background:#21182d!important}
html[data-theme=dark] .warm-every-page .site-header{background:#21182d!important}
html[data-theme=dark] .warm-every-page main>section.section:not(.warm-page-hero),html[data-theme=dark] .warm-every-page main>section.ag-section{background:#2b2237!important}
html[data-theme=contrast] .warm-every-page{--v11-bg:#fff;--cream:#fff;--paper:#fff;background:#fff!important}
html[data-theme=contrast] .warm-every-page .site-header,html[data-theme=contrast] .warm-every-page .warm-page-hero,html[data-theme=contrast] .warm-every-page main>section,html[data-theme=contrast] .warm-numbered>li,html[data-theme=contrast] .warm-every-page .pv-help{background:#fff!important;color:#000!important;border-color:#000!important}
html[data-theme=contrast] .warm-every-page .warm-page-hero :is(h1,p,.eyebrow),html[data-theme=contrast] .warm-numbered>li :is(p,strong,h2,h3){color:#000!important}
@media(max-width:680px){.warm-title-row{grid-template-columns:minmax(0,1fr) 90px;gap:.8rem}.warm-topic-art{width:90px;height:90px}.warm-topic-art img{width:80px;height:80px}.warm-topic-art::after{font-size:1.2rem}.warm-every-page .warm-page-hero:is(.wrap){padding-inline:1rem}.warm-title-row h1{font-size:clamp(1.8rem,6vw,2.6rem)!important}.warm-numbered>li{padding-left:3.4rem}.warm-numbered>li::before{width:34px;height:34px;left:.5rem}.warm-every-page main>section:not(.warm-page-hero)>div.wrap>h2::before{width:36px;height:40px}}
@media(max-width:400px){.warm-title-row{grid-template-columns:1fr}.warm-topic-art{grid-row:1;width:72px;height:72px;margin-bottom:.4rem}.warm-topic-art img{width:66px;height:66px}}
@media print{.warm-every-page,.warm-every-page main>section,.warm-every-page .warm-page-hero,.warm-numbered>li{background:#fff!important;color:#000!important;box-shadow:none!important}.warm-topic-art,.warm-every-page .gay-intro,.warm-every-page main>section>div.wrap>h2::before{display:none!important}.warm-title-row{display:block}.warm-numbered>li{border-color:#bbb;box-shadow:none}.warm-every-page .pv-pages figure{padding:0;box-shadow:none}}

/* A single, generous type rhythm for page introductions and primary section headings. */
.warm-every-page{
  --warm-eyebrow-gap:1rem;
  --warm-hero-title-size:clamp(3rem,5.15vw,4.6rem);
}
.warm-every-page .warm-page-hero :is(.eyebrow,.v11-kicker),
.warm-every-page .start-welcome .v11-kicker,
.warm-every-page main>section:not(.warm-page-hero):not(.start-welcome)>.wrap>.v11-kicker{
  display:block;
  font-size:.82rem!important;
  font-weight:800!important;
  line-height:1.35!important;
  letter-spacing:.11em!important;
  text-transform:uppercase!important;
}
.warm-every-page .warm-page-hero :is(.eyebrow,.v11-kicker),
.warm-every-page .start-welcome .v11-kicker{
  margin:0 0 var(--warm-eyebrow-gap)!important;
}
.warm-every-page .warm-page-hero .warm-title-row{
  margin-top:0!important;
  align-items:start;
}
.warm-every-page .warm-page-hero h1,
.warm-every-page .start-welcome h1,
.warm-every-page .v11-quiz > .wrap > h2{
  font-size:var(--warm-hero-title-size)!important;
  line-height:1.04!important;
  letter-spacing:-.04em!important;
  margin-top:0!important;
}
.warm-every-page main>section:not(.warm-page-hero):not(.start-welcome)>.wrap>.v11-kicker{
  margin:0 0 .85rem!important;
}
.warm-every-page main>section:not(.warm-page-hero):not(.start-welcome)>.wrap>.v11-kicker+h2{
  margin-top:0!important;
}
@media(max-width:680px){
  .warm-every-page{
    --warm-eyebrow-gap:.8rem;
    --warm-hero-title-size:clamp(2.55rem,10.5vw,3.35rem);
  }
}
@media(max-width:400px){
  .warm-title-row .warm-topic-art{
    grid-row:auto;
  }
}
/* Breadcrumbs must stay readable when a formerly navy header becomes pastel. */
.warm-every-page .warm-page-hero .breadcrumbs,.warm-every-page .warm-page-hero .breadcrumbs :is(a,li,span){color:#594568!important}

/* Icon URLs are relative to this CSS file for root and nested pages alike. */
.warm-every-page[data-warm-icon="apps"]{--page-topic-icon:url('../img/illos/apps.svg')}
.warm-every-page[data-warm-icon="cocktail"]{--page-topic-icon:url('../img/illos/cocktail.svg')}
.warm-every-page[data-warm-icon="consent"]{--page-topic-icon:url('../img/illos/consent.svg')}
.warm-every-page[data-warm-icon="deepfake"]{--page-topic-icon:url('../img/illos/deepfake.svg')}
.warm-every-page[data-warm-icon="desk"]{--page-topic-icon:url('../img/illos/desk.svg')}
.warm-every-page[data-warm-icon="doctor"]{--page-topic-icon:url('../img/illos/doctor.svg')}
.warm-every-page[data-warm-icon="ear"]{--page-topic-icon:url('../img/illos/ear.svg')}
.warm-every-page[data-warm-icon="envelope"]{--page-topic-icon:url('../img/illos/envelope.svg')}
.warm-every-page[data-warm-icon="first-conversation"]{--page-topic-icon:url('../img/illos/first-conversation.svg')}
.warm-every-page[data-warm-icon="joy"]{--page-topic-icon:url('../img/illos/joy.svg')}
.warm-every-page[data-warm-icon="legacy-checklist"]{--page-topic-icon:url('../img/illos/legacy-checklist.svg')}
.warm-every-page[data-warm-icon="lightbulb"]{--page-topic-icon:url('../img/illos/lightbulb.svg')}
.warm-every-page[data-warm-icon="magnifier"]{--page-topic-icon:url('../img/illos/magnifier.svg')}
.warm-every-page[data-warm-icon="medicare-card"]{--page-topic-icon:url('../img/illos/medicare-card.svg')}
.warm-every-page[data-warm-icon="message-banking"]{--page-topic-icon:url('../img/illos/message-banking.svg')}
.warm-every-page[data-warm-icon="never-ai"]{--page-topic-icon:url('../img/illos/never-ai.svg')}
.warm-every-page[data-warm-icon="phishing"]{--page-topic-icon:url('../img/illos/phishing.svg')}
.warm-every-page[data-warm-icon="printer"]{--page-topic-icon:url('../img/illos/printer.svg')}
.warm-every-page[data-warm-icon="prompt-cards"]{--page-topic-icon:url('../img/illos/prompt-cards.svg')}
.warm-every-page[data-warm-icon="robot"]{--page-topic-icon:url('../img/illos/robot.svg')}
.warm-every-page[data-warm-icon="safe-word"]{--page-topic-icon:url('../img/illos/safe-word.svg')}
.warm-every-page[data-warm-icon="shield"]{--page-topic-icon:url('../img/illos/shield.svg')}
.warm-every-page[data-warm-icon="signpost"]{--page-topic-icon:url('../img/illos/signpost.svg')}
.warm-every-page[data-warm-icon="starter-kit"]{--page-topic-icon:url('../img/illos/starter-kit.svg')}
.warm-every-page[data-warm-icon="state-help"]{--page-topic-icon:url('../img/illos/state-help.svg')}
.warm-every-page[data-warm-icon="stop-card"]{--page-topic-icon:url('../img/illos/stop-card.svg')}
.warm-every-page[data-warm-icon="story-book"]{--page-topic-icon:url('../img/illos/story-book.svg')}
.warm-every-page[data-warm-icon="toolkit"]{--page-topic-icon:url('../img/illos/toolkit.svg')}
.warm-every-page[data-warm-icon="tune-up"]{--page-topic-icon:url('../img/illos/tune-up.svg')}
.warm-every-page[data-warm-icon="video"]{--page-topic-icon:url('../img/illos/video.svg')}
.warm-every-page[data-warm-icon="voice-clone"]{--page-topic-icon:url('../img/illos/voice-clone.svg')}

/* The opening safety exercise uses the same title rhythm as other pages. */
.warm-every-page main > .v11-quiz > .wrap > .v11-kicker{margin-bottom:var(--warm-eyebrow-gap)!important;}

/* A11Y-FIXES-2026-10-23 */
/* Footer links sit inside a sentence, so they must not rely on color alone (WCAG 1.4.1) */
.site-footer .footer-bottom a{text-decoration:underline;text-underline-offset:.18em}
/* The long email address must wrap instead of running off a phone at the largest text size */
.site-footer .footer-bottom a[href^="mailto:"],.site-footer a[href^="mailto:"]{overflow-wrap:anywhere;word-break:break-word}
/* Tiles must fit a 320px phone at the largest text size (WCAG 1.4.10) */
.print-tiles{grid-template-columns:repeat(auto-fit,minmax(min(13rem,100%),1fr))}
/* Printable preview captions sit on white pages in every color mode */
.pv-pages figcaption,html[data-theme=dark] .pv-pages figcaption{color:#4A3F5C!important}
html[data-theme=contrast] .pv-pages figcaption{color:#000!important}
/* Dark mode: boxes that keep a pale background keep dark text */
html[data-theme=dark] :is(.video-caption-help,.scam-card-help,.photo-search-help,.warm-numbered>li) :is(strong,em,summary,p,span,li){color:#241A3A!important}
html[data-theme=dark] :is(.video-caption-help,.scam-card-help,.photo-search-help,.warm-numbered>li) a{color:#86311F!important}
html[data-theme=dark] :is(.scam-card-help,.photo-search-help)>summary{color:#241A3A!important}
html[data-theme=dark] .ag-page .ag-card .ag-category{background:#F3EDF8;color:#241A3A}
/* Extra contrast: table headings and the play button keep readable pairs */
html[data-theme=contrast] :is(.chatbot-comparison,.prompt-recipe-table) thead th{background:#fff!important;color:#000!important;border-bottom:4px solid #000}
/* Extra contrast: numbered circles, play buttons and tags keep readable pairs.
   (Class names are repeated on purpose so these outrank the general black-text rule.) */
html[data-theme=contrast] .v11-step-num.v11-step-num.v11-step-num.v11-step-num.v11-step-num,
html[data-theme=contrast] .recipe-number.recipe-number.recipe-number.recipe-number.recipe-number,
html[data-theme=contrast] .scam-method-step.scam-method-step.scam-method-step.scam-method-step.scam-method-step.scam-method-step h3>span[aria-hidden="true"],
html[data-theme=contrast] .home-welcome-play.home-welcome-play.home-welcome-play.home-welcome-play.home-welcome-play,
html[data-theme=contrast] .episode-play.episode-play.episode-play.episode-play.episode-play{background:#000!important;color:#fff!important}
html[data-theme=contrast] .home-welcome-play.home-welcome-play.home-welcome-play.home-welcome-play.home-welcome-play span:not(.home-play-icon),
html[data-theme=contrast] .episode-play.episode-play.episode-play.episode-play.episode-play span:not(.episode-play-symbol){color:#fff!important}
html[data-theme=contrast] .home-welcome-play.home-welcome-play.home-welcome-play.home-welcome-play.home-welcome-play .home-play-icon,
html[data-theme=contrast] .episode-play.episode-play.episode-play.episode-play.episode-play .episode-play-symbol{background:#ffb514!important;color:#000!important}
html[data-theme=contrast] .article-tile.article-tile.article-tile.article-tile.article-tile .tile-meta{background:#fff!important;color:#000!important;border:2px solid #000}
/* Dark mode leftovers */
html[data-theme=dark] .term-of-day .term-use,html[data-theme=dark] .term-of-day .term-use strong{color:#241A3A!important}
.start-welcome .topic-hero-scene figcaption{color:#49384F!important}
html[data-theme=contrast] .start-welcome .topic-hero-scene figcaption{color:#000!important}
/* The pale page headers (.warm-page-hero) are pale in every color mode, so the text inside them stays dark (WCAG 1.4.3).
   Boxes inside the header that have their own dark background are left alone. */
.warm-every-page .warm-page-hero :is(p,li,strong,em,span,small,figcaption,h2,h3,dt,dd,.small,.micro,.lede,.eyebrow,.pv-meta,.article-meta,.term-use):not(:is(.gay-intro,.pv-help,.facts-date,.notice,.gays-desk,.v11-button,.ag-button,.btn,.home-welcome-watch,.home-welcome-play,.home-welcome-player,.episode-player-stage,.episode-play,.gay-intro-face-badge) *):not(:is(.gay-intro,.pv-help,.facts-date,.notice,.gays-desk,.v11-button,.ag-button,.btn,.home-welcome-watch,.home-welcome-play,.home-welcome-player,.episode-player-stage,.episode-play,.gay-intro-face-badge)){color:#241A3A!important}
html[data-theme=contrast] .warm-every-page .warm-page-hero :is(p,li,strong,em,span,small,figcaption,h2,h3,dt,dd,.small,.micro,.lede,.eyebrow,.pv-meta,.article-meta,.term-use):not(:is(.gay-intro,.pv-help,.facts-date,.notice,.gays-desk,.v11-button,.ag-button,.btn,.home-welcome-watch,.home-welcome-play,.home-welcome-player,.episode-player-stage,.episode-play,.gay-intro-face-badge) *):not(:is(.gay-intro,.pv-help,.facts-date,.notice,.gays-desk,.v11-button,.ag-button,.btn,.home-welcome-watch,.home-welcome-play,.home-welcome-player,.episode-player-stage,.episode-play,.gay-intro-face-badge)){color:#000!important}
html[data-theme=dark] .warm-every-page .warm-page-hero a:not(:is(.btn,.btn-outline,.btn-outline-navy,.v11-button,.ag-button,.home-welcome-watch,.episode-play,.gay-intro-face)):not(:is(.gay-intro,.pv-help,.facts-date,.notice,.gays-desk,.v11-button,.ag-button,.btn,.home-welcome-watch,.home-welcome-play,.home-welcome-player,.episode-player-stage,.episode-play,.gay-intro-face-badge) *){color:#86311F!important}
html[data-theme=dark] .warm-every-page .warm-page-hero :is(.btn-outline,.btn-outline-navy):not(:is(.gay-intro,.pv-help,.facts-date,.notice,.gays-desk,.v11-button,.ag-button,.btn,.home-welcome-watch,.home-welcome-play,.home-welcome-player,.episode-player-stage,.episode-play,.gay-intro-face-badge) *){color:#241A3A!important;border-color:#241A3A!important;background:transparent!important}
.warm-every-page .warm-page-hero h1 em{color:#8A3F00!important}
html[data-theme=contrast] .warm-every-page .warm-page-hero h1 em{color:#000!important}
/* The "Stay connected" sign-up box is dark, so its small heading is light */
.optin .eyebrow,.optin>div>.eyebrow{color:#FFD27A!important}
html[data-theme=contrast] .optin .eyebrow{color:#FFD27A!important}
/* Article tag pills: white text needs at least 4.5:1 on every part of the gradient */
html .article-tile .tile-meta,html .grid-2 .article-tile:nth-child(n) .tile-meta{background:linear-gradient(135deg,#BF4A2A,#A53A22)!important;color:#fff!important}
html .grid-2 .article-tile:nth-child(3) .tile-meta{background:linear-gradient(135deg,#B8501F,#A53A22)!important}
/* Extra contrast: numbered circles and play buttons keep readable pairs */
