/* Shared readable typography and tactile controls. */
body,body[data-season=city]{font-family:"Avenir Next","Segoe UI",Arial,sans-serif!important}
button,input,textarea,select{font-family:inherit}
h1,h2,h3,h4,.city-hero h1,.city-about .meet-copy h2{font-family:"Avenir Next","Segoe UI",Arial,sans-serif!important;font-weight:800}
body[data-season=city] .meet-family-section,body[data-season=city] .city-about.meet-band{background:#fff}
.meet-family-card{box-shadow:none}
.fan-portals>*>span{aspect-ratio:1;overflow:visible;border:0!important;border-radius:0;box-shadow:none!important;background:transparent}
.fan-portals img{object-fit:contain;width:100%;height:100%;filter:drop-shadow(0 9px 6px #173b7724)}
.fan-portals strong{font-size:clamp(22px,2vw,28px);letter-spacing:-.5px}
.fan-portals small{font-size:15px}
body :is(.city-button,.city-text-button,.pill,.adv-button,.greeting-primary,.greeting-secondary,.greeting-send,.greeting-share-grid button,.choices button,.explore-banner-button){font-size:16px!important;line-height:1.35!important;font-weight:800!important;letter-spacing:.35px!important;min-height:50px;padding:14px 24px!important;border-radius:16px!important;border:1px solid #ffffff66!important;box-shadow:inset 0 2px 0 #ffffff66,0 6px 0 var(--button-base,#153889),0 10px 16px #15294d24!important;transition:transform .16s,box-shadow .16s!important;text-align:center;white-space:normal}
body :is(.city-button,.pill,.adv-button){--button-base:#b88012}
body :is(.city-greetings,.city-about,.meet-family-copy) .city-button{--button-base:#172c78}
body .city-button.fan-outline{background:#fff;color:#1454ed;--button-base:#a3b6d8}
body .city-text-button{background:#244bc3;color:#fff;--button-base:#142d83;display:inline-flex;align-items:center;justify-content:center}
body :is(.city-button,.city-text-button,.pill,.adv-button,.greeting-primary,.greeting-secondary,.greeting-send,.greeting-share-grid button,.choices button,.explore-banner-button):hover:not(:disabled){transform:translateY(-2px);box-shadow:inset 0 2px 0 #ffffff66,0 8px 0 var(--button-base,#153889),0 13px 20px #15294d26!important}
body :is(.city-button,.city-text-button,.pill,.adv-button,.greeting-primary,.greeting-secondary,.greeting-send,.greeting-share-grid button,.choices button,.explore-banner-button):active:not(:disabled){transform:translateY(4px);box-shadow:inset 0 2px 0 #ffffff44,0 2px 0 var(--button-base,#153889)!important}
body :is(button,.city-button,.pill,.greeting-send):focus-visible{outline:3px solid #f39a21;outline-offset:5px}
body :is(.city-play,.city-arrow,.menu-toggle,.city-player-close,.close){box-shadow:inset 0 2px 0 #ffffff99,0 4px 0 #173b7759,0 7px 14px #173b7726;font-size:24px;min-width:44px;min-height:44px}
body :is(.greeting-primary,.greeting-secondary,.greeting-send,.greeting-share-grid button){--button-base:#84351f}
body :is(button:disabled,[aria-disabled=true]){box-shadow:none!important;transform:none!important}
.christmas-art-feature{position:relative;background:#fff5e7;text-align:center}
.christmas-art-feature>img{width:100%;height:auto;display:block;object-fit:contain}
.christmas-art-feature>.city-button{position:absolute;top:73%;left:14%;background:#bf1527;color:white;--button-base:#7c0b1a}
.halloween-art-feature>.city-button{--button-base:#14382a}
.city-film-info{gap:26px}
@media(max-width:850px){.fan-portals small{font-size:14px}.christmas-art-feature>.city-button{left:12%;top:74%}}
@media(max-width:600px){body :is(.city-button,.city-text-button,.pill,.adv-button,.greeting-primary,.greeting-secondary,.greeting-send,.greeting-share-grid button){font-size:15px!important;padding:13px 19px!important}.christmas-art-feature{padding-bottom:26px}.christmas-art-feature>.city-button{position:relative;left:auto;top:auto;margin:18px auto 0}.fan-portals small{font-size:13px}.fan-actions{gap:20px}.meet-family-copy{padding-top:20px}}
@media(prefers-reduced-motion:reduce){body button,body a{transition:none!important}}

/* Vibrant readable brand text on light surfaces. */
body[data-season=city]{--ink:#1454ed;color:#1454ed}
body[data-season=city] header nav a:not(.nav-greeting),.mobile-nav a:not(.nav-greeting),.fan-welcome h2,.fan-portals strong,.city-section-heading h2,.city-film-info h3,.city-talk strong,.city-about .meet-copy h2,.city-greetings h2{color:#1454ed}
body .share-heading h1,body .greeting-card h3{color:#1454ed}
body .share-eyebrow,body .share-subheading{color:#000000}
/* The greeting feature matches the craft panel, with quiet envelope details. */
body[data-season=city] .city-greetings{display:block;max-width:none;width:100%;margin:35px 0;padding:20px 0 40px;background:#fff;box-shadow:none;clip-path:none}
body[data-season=city] .greeting-feature-layout{
  --greeting-envelope:url("greeting-envelope-detail.svg?v=blue197");
  --greeting-wash:linear-gradient(105deg,#def1fc 0%,#edf8fe 35%,#fff 76%);
  box-sizing:border-box;width:94%;max-width:1440px;margin-inline:auto;padding:clamp(32px,3.2vw,48px) clamp(24px,3vw,44px);
  display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:center;gap:clamp(24px,2.8vw,44px);
  border:1px solid #a9d4f1;border-radius:clamp(24px,2.6vw,40px);box-shadow:0 16px 36px -20px #7ba9cf66;
  background-color:#fff;
  background-image:var(--greeting-envelope),var(--greeting-envelope),var(--greeting-envelope),var(--greeting-envelope),var(--greeting-envelope),var(--greeting-envelope),var(--greeting-envelope),var(--greeting-envelope),var(--greeting-wash);
  background-repeat:no-repeat;
  background-position:3% 8%,29% 5%,57% 7%,96% 14%,3% 93%,34% 95%,67% 94%,96% 90%,0 0;
  background-size:40px auto,30px auto,32px auto,40px auto,36px auto,28px auto,30px auto,40px auto,100% 100%;
}
body[data-season=city] .greeting-feature-layout .city-greeting-art{display:block;box-sizing:border-box;width:100%;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}
body[data-season=city] .greeting-feature-layout .city-greeting-art img{display:block;width:100%;height:auto;border-radius:0;object-fit:contain}
body[data-season=city] .greeting-feature-layout .city-greeting-art:focus-visible{outline:3px solid #1454ed;outline-offset:4px}
body[data-season=city] .greeting-copy{min-width:0;padding:12px 0 18px}
body[data-season=city] .greeting-copy h2{font-size:clamp(32px,3.2vw,46px);line-height:1.16;letter-spacing:-1.3px}
body[data-season=city] .greeting-copy h2>span{white-space:normal}
body[data-season=city] .greeting-copy p:not(.city-kicker){line-height:1.6;margin:22px 0 26px}
body[data-season=city] .greeting-copy .city-button{max-width:100%;box-sizing:border-box;justify-content:center;gap:16px}
@media(max-width:960px){
  body[data-season=city] .city-greetings{margin:24px 0;padding:12px 0 28px}
  body[data-season=city] .greeting-feature-layout{--greeting-wash:linear-gradient(160deg,#def1fc 0%,#f1faff 35%,#fff 68%);width:92%;grid-template-columns:minmax(0,1fr);gap:26px;padding:30px 24px;background-position:4% 3%,48% 2%,94% 4%,96% 40%,3% 60%,6% 96%,54% 96%,95% 94%,0 0}
  body[data-season=city] .greeting-feature-layout .city-greeting-art{max-width:680px;justify-self:center}
  body[data-season=city] .greeting-copy{max-width:560px;justify-self:center;text-align:center;padding:0 0 14px}
  body[data-season=city] .greeting-copy h2{font-size:clamp(28px,5vw,42px)}
}
@media(max-width:480px){
  body[data-season=city] .greeting-feature-layout{padding:26px 14px 28px;gap:22px}
  body[data-season=city] .greeting-copy h2{font-size:clamp(26px,7.1vw,34px);letter-spacing:-.7px}
  body[data-season=city] .greeting-copy p:not(.city-kicker){font-size:15px;margin:18px 0 22px}
  body[data-season=city] .greeting-copy .city-button{padding-inline:16px!important;font-size:14px!important;gap:10px}
}
body[data-season=city] .city-watch{background:#fff}

.meet-banner-feature{position:relative;background:#fff;text-align:center}
.meet-banner-feature>img{display:block;width:100%;height:auto;object-fit:contain}
.meet-banner-feature>.city-button{position:absolute;bottom:1.5%;left:12%;background:#1454ed;color:white;--button-base:#123698}
@media(max-width:1100px){.meet-banner-feature{padding-bottom:76px}.meet-banner-feature>.city-button{bottom:18px;left:50%;translate:-50% 0;white-space:nowrap}}

body[data-season=city] header nav a,body[data-season=city] .mobile-nav a{color:#000!important}
body[data-season=city] header .nav-greeting,body[data-season=city] .mobile-nav .nav-greeting{background:transparent}

.sock-slot{grid-column:1/-1;flex-basis:100%;width:100%;height:58px;position:relative;box-sizing:border-box}
#sock-invite{width:min(850px,94vw);max-height:90dvh;overflow:auto;padding:34px;border:0;border-radius:24px;background:#fff;color:#1454ed}
#sock-invite::backdrop{background:#102246b8}
.sock-invite-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:32px;align-items:center}
.sock-invite-screen{width:100%;height:min(65dvh,560px);min-height:200px;border-radius:18px;overflow:hidden;background:#111}.sock-invite-screen video{width:100%;height:100%;border:0;display:block;object-fit:contain}
.sock-invite-layout h2{font-size:30px;line-height:1.2}.sock-invite-layout p{color:#222;line-height:1.7;font-size:17px}
#sock-progress{position:fixed;bottom:18px;left:18px;z-index:15;border:2px solid #ffcf22;border-radius:28px;padding:10px 18px;background:#fff;color:#1454ed;box-shadow:0 4px 16px #1236;font-size:15px;font-weight:800;pointer-events:auto}
#sock-progress[hidden]{display:none}
@media(max-width:600px){#sock-invite{padding:38px 20px 24px}.sock-invite-layout{grid-template-columns:1fr;gap:18px;text-align:center}.sock-invite-screen{height:37dvh}.sock-invite-layout h2{font-size:25px}.sock-invite-layout p{font-size:15px}#sock-progress{font-size:13px;bottom:10px;left:10px}}
.meet-band:has(.sock-slot){flex-wrap:wrap}
/* Display the sock-hunt badge as a circle, hiding its black image corners. */
.fan-portals [data-hunt="invite"] img{clip-path:circle(49% at 50% 49.5%)}

body[data-season=city] .city-hero h1{letter-spacing:.025em}

#adventure-banner .independent-adventure{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:40px 6%;background:linear-gradient(120deg,#1454ed,#008cdb);color:white;text-align:left}#adventure-banner .independent-adventure h2{color:white;font-size:clamp(26px,4vw,44px)}#adventure-banner .independent-adventure p{color:white}#adventure-banner .independent-adventure img{width:28%;max-height:300px;object-fit:contain}#adventure-banner .independent-adventure .adv-button{background:#ffdf2b;color:#111}@media(max-width:600px){#adventure-banner .independent-adventure{padding:26px 6%;gap:12px}#adventure-banner .independent-adventure img{width:25%}}

.kindness-page-banner{width:100%;background:#fff}.kindness-page-banner img{display:block;width:100%;height:auto;object-fit:contain}

.adv-category{position:relative}.adv-category .category-check{display:none;position:absolute;top:9px;right:9px;width:28px;height:28px;border-radius:50%;background:#fff;color:#1454ed;font-size:21px;line-height:28px;box-shadow:0 2px 5px #0003}.adv-category[aria-pressed=true] .category-check{display:block}.category-description{background:white;color:#15224b;padding:20px 24px;border-radius:18px;margin-top:24px;text-align:left;border-left:6px solid #ffdf2b}.category-description strong{color:#1454ed;font-size:20px}.category-description p{font-size:17px;line-height:1.6;margin:8px 0 0}.category-description[hidden]{display:none}

.adv-hero .kindness-intro-headline{font-size:clamp(21px,2.5vw,28px);line-height:1.25;margin:18px 0}.adv-hero>div:first-child{padding-bottom:24px}

.adv-hero p.adventure-age-note{font-size:12px!important;font-weight:400;line-height:1.5;margin:0 0 16px;letter-spacing:normal;text-transform:none}.adv-hero .adv-actions:has(+.adventure-age-note){padding-bottom:0;margin-bottom:10px}

body[data-season=city] footer .footer-contact{background:#1454ed;color:#fff;border:1px solid #ffffff60;border-radius:14px;min-height:48px;padding:15px 24px;font-size:16px;letter-spacing:0;justify-content:center;text-transform:none;box-shadow:0 4px 0 #082b85}
body[data-season=city] footer .footer-contact:focus-visible{outline:3px solid #f0d125;outline-offset:5px}

/* Five activities, with consistent description weight for links and buttons. */
html body .fan-portals{grid-template-columns:repeat(5,minmax(0,1fr));max-width:1200px;gap:28px}
html body .fan-portals small{font-weight:600}
@media(max-width:850px){html body .fan-portals{grid-template-columns:repeat(2,minmax(0,1fr));max-width:650px;gap:32px}html body .fan-portals>:last-child{grid-column:1 / -1;width:calc((100% - 32px)/2);justify-self:center}}
@media(max-width:580px){html body .fan-portals{gap:28px 18px}html body .fan-portals>:last-child{width:calc((100% - 18px)/2)}}

/* Gentle, opt-in help for an unfinished sock hunt. */
#sock-help{position:fixed;bottom:76px;left:18px;width:min(350px,calc(100vw - 36px));z-index:30;background:#fff;border:3px solid #ffcf22;border-radius:22px;box-shadow:0 6px 24px #1234;padding:18px;color:#1454ed}
#sock-help[hidden]{display:none!important}
#sock-help p{font-size:18px;font-weight:700;line-height:1.4;margin:0 0 14px}
#sock-help>div{display:flex;flex-wrap:wrap;gap:10px}
#sock-help button{flex:1;min-height:48px;border:2px solid #1454ed;border-radius:14px;background:#1454ed;color:#fff;padding:10px;font-family:inherit;font-size:15px;font-weight:700;line-height:1.3;cursor:pointer}
#sock-help button:last-child{background:#fff;color:#1454ed}
#sock-help button:focus-visible{outline:3px solid #e66712;outline-offset:3px}
html body .sock-collect.sock-hinted{background:#fff5a5;outline:4px solid #1454ed;outline-offset:4px;box-shadow:0 0 0 12px #ffcf2266,0 0 24px #ffcf22;scroll-margin-block:140px}

/* Keep restart and hint available throughout a round. */
#sock-progress{pointer-events:auto;border-radius:18px;max-width:calc(100vw - 36px)}
#sock-progress>div{display:flex;gap:8px;margin-top:6px}
#sock-progress button{min-height:44px;padding:6px 12px;border:1px solid #1454ed;border-radius:12px;background:white;color:#1454ed;font:inherit;cursor:pointer}
#sock-progress button:disabled{opacity:.5;cursor:default}
#sock-progress button:focus-visible{outline:3px solid #e66712;outline-offset:2px}
#sock-help{bottom:138px}

#sock-progress{z-index:40}#sock-progress button{pointer-events:auto;touch-action:manipulation}
.city-video-choices{display:flex;flex-wrap:wrap;gap:8px;padding:16px 20px}.city-video-choices button{min-height:44px;border:1px solid #ffcf22;border-radius:14px;background:#fff;color:#1454ed;font:inherit;font-weight:700;padding:8px 14px;cursor:pointer}

.header-brand-links,.header-socials{display:flex;align-items:center}
.header-brand-links{gap:clamp(4px,1vw,14px);flex:none}
.header-socials a{width:32px;height:44px;display:grid;place-items:center;border-radius:12px}
.header-socials a:is(:hover,:focus-visible){background:#edf3ff}
.header-socials a:focus-visible{outline:2px solid #1454ed}
.header-socials svg{width:21px;height:21px}
@media(max-width:525px){body[data-season=city] header{gap:4px;padding-inline:2%}header .header-brand-links .image-wordmark{width:clamp(56px,15vw,78px)}.header-socials a{width:clamp(24px,7vw,32px)}}
@media(min-width:851px) and (max-width:1100px){body[data-season=city] header{gap:10px;padding-inline:2%}body[data-season=city] header nav{gap:12px}}

/* The bed starts at the card edge; only the copy needs a left gutter. */
#sock-thanks .sock-thanks-layout{padding-left:0}
#sock-thanks .thanks-art{margin-left:0}
#sock-thanks .thanks-art+div{padding-left:12px}
@media(max-width:760px){
 #sock-thanks .sock-thanks-layout{padding-right:0}
 #sock-thanks .thanks-art+div{padding-inline:20px}
}

/* Move the whole tap target within the space left after its 52px width. */
body[data-season=city] .sock-slot:not([hidden]){display:block;padding:3px 14px;clear:both}
body[data-season=city] .sock-slot .sock-collect{display:block;margin-left:calc((100% - 52px) * var(--sock-lane,0) / 4)}

/* Hide socks in the page artwork and margins, retaining a comfortable tap target. */
body[data-season=city] .sock-hide-host{position:relative}
body[data-season=city] .sock-hide-host>.sock-slot:not([hidden]){position:absolute;width:52px;height:52px;left:calc(4px + (100% - 60px) * var(--sock-lane,0) / 4);top:calc((100% - 52px) * var(--sock-y,50) / 100);padding:0;clear:none;z-index:3}
body[data-season=city] .sock-hide-host>.sock-slot[data-sock-context="margin"][data-sock-lane="1"]{top:auto;bottom:12px}
body[data-season=city] .sock-hide-host>.sock-slot[data-sock-context="margin"][data-sock-lane="2"]{top:10px}
body[data-season=city] .sock-hide-host>.sock-slot[data-sock-context="margin"][data-sock-lane="3"]{top:auto;bottom:24px}
body[data-season=city] .sock-hide-host>.sock-slot .sock-collect{width:52px;height:52px;margin:0;padding:0;display:grid;place-items:center}
body[data-season=city] .sock-hide-host>.sock-slot .sock-collect img{width:28px;height:34px;transform:rotate(var(--sock-tilt,-17deg))}

footer .genci-contact summary{cursor:pointer;list-style:none}footer .genci-contact summary::-webkit-details-marker{display:none}footer .genci-contact p{margin:.8em 0;color:white}footer .genci-contact p a{color:white;text-decoration:underline;user-select:all}

#good-deed-form .adv-stop-submit{display:block;width:100%;padding:14px 20px;background:#193bb4;color:white;border:2px solid white;border-radius:999px;box-shadow:0 4px 0 #07174e;font-weight:750;text-align:center}#good-deed-form .adv-stop-submit:focus-visible{outline:3px solid #07174e;outline-offset:5px}


/* Preserve a true portrait frame for vertical videos within the viewport. */
.is-short #city-player-screen{width:min(100%,calc(66svh * 9 / 16));margin-inline:auto}

/* Four equal video cards on desktop, with comfortable tablet and phone layouts. */
#explore .city-video-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
#explore .city-film{min-width:0;display:flex;flex-direction:column}
#explore .city-film-info{padding:22px 20px;min-height:190px;flex:1}
#explore .city-film-info h3{font-size:clamp(21px,1.8vw,27px);line-height:1.2}
@media(max-width:1050px){#explore .city-video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#explore .city-film-info h3{font-size:25px}}
@media(max-width:580px){#explore .city-video-grid{grid-template-columns:1fr}#explore .city-film-info{min-height:0;padding:23px}#explore .city-film-info h3{font-size:27px}}

/* Mirror the opening blue curve above the podcast introduction. */
body[data-season=city] .separate-conversations{padding:0 0 75px;background:#f7faff}
body[data-season=city] .separate-conversations .conversation-intro{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;margin:0 0 42px;padding:72px 6% 52px;text-align:center;background:radial-gradient(ellipse at 50% 0%,#265cbb,#082e75 75%);border-radius:50% 50% 0 0 / 40px 40px 0 0;color:#fff}
body[data-season=city] .separate-conversations .conversation-intro>div{max-width:1100px}
body[data-season=city] .separate-conversations .conversation-intro .city-kicker{margin:0 0 18px;color:#e3edff;font-size:12px;line-height:1.6;letter-spacing:.14em}
body[data-season=city] .separate-conversations .conversation-intro h2{margin:0;color:#fff;font-size:clamp(32px,4.1vw,58px);line-height:1.15;letter-spacing:-.02em;text-wrap:balance}
body[data-season=city] .separate-conversations .conversation-intro>p{margin:0;max-width:760px;color:#e3edff;font-size:17px;line-height:1.7;text-wrap:balance}
body[data-season=city] .separate-conversations .city-talk-grid{width:88%;max-width:1050px;margin:0 auto}
@media(max-width:580px){
 body[data-season=city] .separate-conversations{padding-bottom:48px}
 body[data-season=city] .separate-conversations .conversation-intro{gap:18px;margin-bottom:30px;padding:48px 6% 38px;border-radius:50% 50% 0 0 / 20px 20px 0 0}
 body[data-season=city] .separate-conversations .conversation-intro .city-kicker{font-size:10px;letter-spacing:.12em;margin-bottom:14px}
 body[data-season=city] .separate-conversations .conversation-intro>p{font-size:15px}
}
