/* contact layout: example components only */
.ct-main{padding-top:124px}
section#join.ct-top{padding-top:0!important;padding-bottom:24px!important}
.ct-chat{padding:0!important;margin:0!important}
#gap .chat-card{height:auto!important}
.ct-compose{color:inherit;text-decoration:none;display:inline-flex;align-items:center;min-height:24px}.ct-compose:hover{color:#fff!important}
.ct-compose:focus-visible{outline:2px solid #fff;outline-offset:3px}
#gap .chat-card>div:nth-child(2){flex:0 0 auto;padding-bottom:12px!important}
[data-testid="landing-page"] #main section .ct-btn{margin-top:28px!important}
#main .ct-before{margin-top:32px!important}
#main .lede p,#main .lede{text-wrap:balance}
#gap .chat-card>div:nth-child(2) p{text-wrap:balance}
#main .ct-top .ct-links{margin-top:14px!important}
.ct-links{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px 24px}
.ct-links a{display:inline-flex;align-items:center;gap:6px;min-height:24px}
.ct-links a:hover{text-decoration:none}.ct-links a:hover span{text-decoration:underline;text-underline-offset:4px}
.sa-ic{flex:none;width:16px;height:16px;transition:transform .2s}.ct-links a:hover .sa-ic{transform:translateX(3px)}
#main p{text-wrap:pretty}
#main section.ct-more{padding:40px 0 96px!important}
.ct-wrap{width:min(1280px,calc(100% - 96px));margin:0 auto}
.ct-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.ct-card{text-align:left!important;padding:28px!important;display:flex;flex-direction:column}
.ct-card::before{display:none!important}
.ct-p{margin-top:8px;font-size:16px;line-height:1.6;color:#B8B5C9;flex:1}
.ct-card .ct-links{margin-top:18px}
/* eyebrow on the gradient panel: pink words drop below 4.5:1, so Paper words in the pink pill (brand kit rule for labels on cards) */
html:not([data-theme="light"]) [data-testid="landing-page"] section#join .ask .ask-q{color:#FCFDFF!important}
/* dark mode: lift the email card off the panel so it reads clearly (Mia, 26 Oct) */
html:not([data-theme="light"]) #gap .chat-card{background:#24253A!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:0 24px 50px -24px rgba(0,0,0,.8)!important}
html:not([data-theme="light"]) #gap .chat-card>div:nth-child(2) p{background:#33344F!important;color:#FCFDFF!important}
html:not([data-theme="light"]) #gap .chat-card>div:last-child{background:#1A1B28!important;color:#FCFDFF!important}
/* eyebrow: one style in both modes (Mia, 26 Oct): words with the pink tab, no pill */
[data-testid="landing-page"] section:not(#top) .ask{background:none!important;border:0!important;padding:0!important;gap:10px!important;border-radius:0!important}
[data-testid="landing-page"] section:not(#top) .ask::before{content:""!important;display:block!important;flex:none;width:18px!important;height:4px!important;border-radius:2px!important;background:#E20575!important}
html:not([data-theme="light"]) [data-testid="landing-page"] section:not(#top) .ask .ask-q{color:#FCFDFF!important}
/* Explore drop-down: items sit as close together as the nav links (Mia, 26 Oct); desktop nav only */
@media (min-width:760px){.an-site .site-nav .explore-menu{left:auto!important;width:auto!important;justify-content:flex-end!important;gap:4px!important}
.an-site .site-nav .explore-menu>li{flex:0 0 auto!important}
.an-site .site-nav .explore-menu>li>a{padding:6px 12px!important}}
@media (min-width:760px) and (max-width:1023px){.an-site .site-nav .explore-menu{left:var(--gutter)!important;justify-content:center!important;gap:0!important}.an-site .site-nav .explore-menu>li>a{padding:6px 7px!important;font-size:14.5px!important;gap:6px!important}}
/* the header keeps its height when Explore opens; only the drop-down shows (Mia, 26 Oct) */
@media (min-width:760px){.an-site .site-header.explore-open{padding-bottom:0!important}}
/* header edges line up with the page content */
@media (min-width:760px){.an-site .site-header .an-wrap{width:min(1280px,calc(100% - 96px))!important;max-width:none!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}.an-site .site-nav .explore-menu{right:0!important}}
@media (min-width:760px) and (max-width:999px){.an-site .site-header .an-wrap{width:calc(100% - 32px)!important}}
/* footer links on one row (Mia, 26 Oct) */
.ft-right{flex-direction:row!important;align-items:center!important;flex-wrap:wrap;gap:8px 22px!important}
.ft-links{padding-top:0!important;gap:8px 22px!important}
.an-site .nav-menu-button{border:0!important;border-radius:999px}.an-site .nav-menu-button:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (max-width:999px){.ct-wrap{width:calc(100% - 32px)}.ct-grid{grid-template-columns:minmax(0,1fr)!important;gap:16px!important}.ct-card{padding:24px!important}.ct-p{flex:none}}
@media (max-width:640px){.ct-wrap{width:calc(100% - 32px)}#main section.ct-more{padding:24px 0 72px!important}.ct-main{padding-top:96px}
 .ft-right{align-items:flex-start!important}.ft-links,.ft-legal{justify-content:flex-start!important;flex-wrap:wrap}}
