/* Design review pass 3: readable interfaces and quieter, documentary imagery. */
:root{--navy:#0b2047;--cream:#f8f6ef;--interface-font:Inter,Arial,sans-serif}
:is(a,button,input,select,textarea,summary):focus-visible{outline:3px solid #0b2047;outline-offset:3px;box-shadow:0 0 0 6px #fffef9}
.button:hover{transform:none}
.site-header{padding:22px 40px;gap:32px;background:var(--navy)}
.site-header .brand img{width:245px}
.site-header nav{font:500 15px/1.4 var(--interface-font);letter-spacing:0;gap:28px}
.site-header nav>a{display:flex;align-items:center;min-height:48px;padding:12px 0;white-space:nowrap;text-underline-offset:9px;text-decoration-thickness:2px}
.site-header nav>a[aria-current]{color:#f2e3b8;text-decoration-line:underline}
.site-header nav>a:hover{text-decoration-line:underline}
.site-header nav .nav-portal{font-weight:500;min-height:48px;padding:12px 18px;gap:20px;border-color:#91a1b9}
.menu-toggle{font:500 15px/1.4 var(--interface-font);min-height:48px;padding:10px 14px}
.site-footer>div>a:not(.brand){font-size:14px;min-height:44px;display:flex;align-items:center}
.site-footer .eyebrow{font-size:12px}
.site-footer .footer-bottom{font-size:12px}

/* Shop: one photograph of the place; citizenship compared through type. */
.shop3{max-width:1320px;margin:auto;padding:58px 70px 80px}
.shop3-heading{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:70px;align-items:center;margin-bottom:40px}
.shop3-heading .eyebrow{font-size:12px;letter-spacing:.12em;color:#566653;margin-bottom:18px}
.shop3-heading h1{font-size:64px;line-height:1.08;margin:0 0 22px}
.shop3-heading p:not(.eyebrow){font-size:17px;line-height:1.7;max-width:520px;color:#586765}
.shop3-heading figure{margin:0}
.shop3-heading img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:55% 50%}
.shop3-heading figcaption{font-size:12px;color:#586765;margin-top:10px}
.shop3-welcome{display:flex;align-items:baseline;gap:28px;border-top:1px solid #cfd3c8;padding:23px 0}
.shop3-welcome h2{font-family:var(--interface-font);font-size:15px;font-weight:600;letter-spacing:0;line-height:1.5;flex:0 0 auto;margin:0}
.shop3-welcome p{font-size:14px;line-height:1.7;color:#586765;max-width:690px;margin:0}
.shop3 .shop-toolbar{padding:12px 0;margin-bottom:30px;gap:24px}
.shop3 .filter-list{gap:8px}
.shop3 .filter{min-height:48px;padding:12px 16px;font:500 15px/1.4 var(--interface-font);border:0;border-bottom:2px solid transparent;color:#53615f}
.shop3 .filter:hover{background:#edece3;color:var(--navy)}
.shop3 .filter.selected{background:transparent;border-bottom-color:var(--navy);color:var(--navy)}
.shop3 .shop-toolbar>.small{font-size:13px;white-space:nowrap}
.shop3-tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-bottom:40px;border-bottom:1px solid #cfd3c8}
.shop3-tier{padding:8px 28px 30px;border-right:1px solid #cfd3c8;display:flex;flex-direction:column;align-items:flex-start}
.shop3-tier:first-child{padding-left:0}
.shop3-tier:last-child{padding-right:0;border-right:0}
.shop3-tier .eyebrow{font-size:12px;letter-spacing:.07em;color:#626d5c;margin-bottom:15px}
.shop3-tier h2{font-size:36px;margin-bottom:16px}
.shop3-tier>p:not(.eyebrow){font-size:15px;line-height:1.75;color:#56635f;margin-bottom:20px}
.shop3-tier .shop3-price{color:var(--navy);font-weight:500;margin-top:auto;margin-bottom:12px}
.shop3-tier .text-button{display:inline-flex;align-items:center;gap:24px;min-height:44px;font-size:15px;font-weight:500;border-bottom:1px solid #94a093;padding:8px 0}
.shop3-coming{display:grid;grid-template-columns:1fr 1fr;gap:35px;padding:2px 0 32px}
.shop3-coming article{max-width:430px}
.shop3-coming .eyebrow{font-size:12px;letter-spacing:.07em;color:#626d5c;margin-bottom:12px}
.shop3-coming h2{font-size:29px;margin-bottom:12px}
.shop3-coming p{font-size:15px;color:#586765;line-height:1.75}
.shop3-note{font-size:13px;color:#586765;border-top:1px solid #cfd3c8;padding-top:25px;margin:0}
dialog.product-detail{max-width:640px}
dialog.product-detail[open]{display:block}
.product-detail .dialog-body{padding:50px}
.product-detail .dialog-body p,.product-detail .dialog-body .button{font-size:15px}
.product-detail .dialog-body .small{font-size:13px}

/* Shared citizen interface scale: no smaller navigation at tablet widths. */
.portal2{display:grid;grid-template-columns:260px minmax(0,1fr);grid-template-rows:auto 1fr auto;grid-template-areas:'sidebar topbar' 'sidebar main' 'sidebar footer'}
.p2-sidebar{grid-area:sidebar;padding-left:16px;padding-right:16px;min-height:calc(100vh - 34px)}
.p2-topbar{grid-area:topbar}
.p2-main{grid-area:main;padding-top:38px}
.p2-footer{grid-area:footer;font-size:12px;line-height:1.6}
.p2-sidebar nav>a{font:500 15px/1.4 var(--interface-font);min-height:48px;gap:12px;padding:12px 14px}
.p2-brand>span,.p2-nav-label{font-size:11px;letter-spacing:.12em}
.p2-sidebar-foot>a,.p2-sidebar-foot>button{font-size:14px;min-height:44px}
.p2-sidebar-foot>a.p2-public-link{font-size:13px}
.p2-breadcrumb,.p2-person{font-size:14px}
.p2-person>span>small{font-size:12px}
.p2-welcome{grid-template-columns:1fr 1.12fr;gap:35px}
.p2-welcome h1{font-size:54px;line-height:1.08}
.p2-welcome .eyebrow{font-size:12px;letter-spacing:.1em}
.p2-welcome p:not(.eyebrow){font-size:16px;line-height:1.75}
.p2-status{font-size:14px}
.p2-welcome figure{align-self:center;min-height:0;background:transparent;border-radius:0;overflow:visible}
.p2-welcome figure>img{position:static;aspect-ratio:4/3;height:auto;object-position:50% 50%}
.p2-welcome figure:after{display:none}
.p2-welcome figcaption{position:static;font:12px/1.6 var(--interface-font);color:#586765;margin-top:9px}
.p2-home-content{grid-template-columns:minmax(0,1fr) 255px;gap:26px}
.p2-section-heading h2{font-size:28px}
.p2-section-heading>span{display:none}
.p2-record{margin-top:50px}
.p2-offer-card{grid-template-columns:minmax(115px,.7fr) minmax(0,1.3fr)}
.p2-offer-copy{padding:28px 23px}
.p2-offer-label{font-size:11px;line-height:1.6;letter-spacing:.07em}
.p2-offer-copy h3{font-size:32px}
.p2-offer-copy p{font-size:15px;line-height:1.7}
.p2-offer-status{font-size:13px;line-height:1.65;color:#665a49}
.p2-offer-copy .button{font-size:14px;min-height:48px;padding:12px 16px;gap:14px}
.p2-record-top .eyebrow{font-size:11px}
.p2-record h2{font-size:28px}
.p2-record>p{font-size:15px;color:#56634e}
.p2-record dt{font-size:12px;color:#5f6956}
.p2-record dd{font-size:14px}
.p2-record>a{font-size:14px;min-height:44px}
.p2-record>small{font-size:12px;color:#58634d}
.p2-explore h3{font-size:24px}
.p2-explore p{font-size:14px;line-height:1.7;color:#586765}
.p2-start-card p,.p2-account-card p,.p2-member-benefits>p,.p2-member-benefits ul{font-size:15px}
.p2-membership-record dt,.p2-account-card dt{font-size:13px;color:#596451}
.p2-membership-record dd,.p2-account-card dd{font-size:16px}
.p2-membership-record .small,.p2-help-note,.p2-help-note p,.p2-help-note a{font-size:14px}
.portal2 .portal-heading>.eyebrow{font-size:12px}
.portal2 .portal-heading>p:last-child,.portal2 .elixir-banner p:not(.eyebrow){font-size:16px}
.portal2 .button,.auth2 .button{font-size:15px;min-height:48px}
.portal2 :is(.small,.field-hint,.check-label,.form-notice,.form-heading p,.claim-success>p,.text-link,.back-link){font-size:14px;line-height:1.7}
.portal2 :is(.claim-panel,.profile-panel) .field label{font-size:14px}
.portal2 :is(.claim-panel,.profile-panel) .field :is(input,textarea){font-size:16px;min-height:48px;border-color:#7e8980}
.profile-photo-row>div:has(#photo:focus-visible) .upload-label{outline:3px solid #0b2047;outline-offset:3px;box-shadow:0 0 0 6px #fffef9}
.offer-steps{list-style:none;margin:0 0 25px;padding:0;gap:24px}
.offer-steps>li{display:flex;align-items:center;gap:9px;font-size:14px;color:#5e6562}
.offer-steps>li[aria-current]{color:var(--indigo);text-decoration:underline;text-underline-offset:5px}
.offer-steps b{font-weight:500}
:is(.claim-review,.claim-success,.claim-panel) h2:focus{outline:2px solid var(--indigo);outline-offset:6px}

/* Quiet photograph on sign-in; the form supplies the welcome. */
.auth2-land:after{background:linear-gradient(180deg,#08172070,transparent 35%,#08172070)}
.auth2-location{font-size:13px;letter-spacing:.1em;color:#fffef9;left:45px;bottom:40px}
.auth2-top,.auth2-footer{font-size:14px;line-height:1.6}
.auth2-top>a,.auth2-footer>a{min-height:44px;display:inline-flex;align-items:center}
.auth2-main{max-width:535px}
.auth2-main>.eyebrow{font-size:12px;letter-spacing:.1em}
.auth2-main h1{font-size:52px}
.auth2-intro{font-size:16px}
.auth2-form>label,.auth2-label-row>label{font-size:15px}
.auth2-form>input,.auth2-password>input,.auth2-scenarios select{font-size:16px;border-color:#7e8980;min-height:50px}
.auth2-label-row a,.auth2-password>button,.auth2-demo-note,.auth2-scenarios,.auth2-back,.auth2-feedback,.auth2-feedback p{font-size:14px}
.auth2-label-row a,.auth2-scenarios summary{min-height:44px;display:flex;align-items:center}
.auth2-password>button{min-height:44px;top:3px}
.auth2-activate b,.auth2-activate p,.auth2-activate a,.auth2-join,.auth2-offer p{font-size:15px}
.auth2-activate a{min-height:44px}
.auth2-offer .eyebrow{font-size:11px}

@media(max-width:1150px){
 .site-header{padding:20px 28px;gap:26px}
 .site-header .brand img{width:220px}
 .site-header nav{gap:23px}
 .p2-main{padding:32px}
 .p2-home-content{grid-template-columns:1fr}
 .p2-record{margin-top:0;display:grid;grid-template-columns:44px 1fr 1fr;gap:0 18px;align-items:center}
 .p2-record-top{grid-column:1/-1;margin-bottom:18px}
 .p2-record>.avatar{grid-row:2/4;margin:0}
 .p2-record h2{grid-column:2;grid-row:2}
 .p2-record>p{grid-column:2;grid-row:3;margin:0}
 .p2-record dl{grid-column:3;grid-row:2/4;padding:0;border:0;margin:0}
 .p2-record>a{grid-column:1/-1;margin-top:20px}
 .p2-record>small{grid-column:1/-1}
 .p2-offer-card{grid-template-columns:170px minmax(0,1fr)}
 .p2-welcome{gap:24px}
 .p2-welcome h1{font-size:48px}
}
@media(max-width:1020px){
 .site-header{flex-wrap:wrap}
 .menu-toggle{display:flex;align-items:center;gap:12px}
 .site-header nav{display:none;flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;padding-top:4px;font-size:16px}
 .site-header nav.open{display:flex}
 .site-header nav>a{padding:14px 0;border-top:1px solid #31446a;min-height:50px}
 .site-header nav .nav-portal{padding:14px 16px;margin-top:12px;justify-content:space-between}
 .shop3{padding:42px 40px 65px}
 .shop3-heading{grid-template-columns:minmax(0,1fr) 240px;gap:40px}
 .shop3-heading h1{font-size:56px}
 .shop3-welcome{display:block}
 .shop3-welcome h2{margin-bottom:8px}
 .shop3-tier{padding-left:20px;padding-right:20px}
 .shop3-tier h2{font-size:32px}
 .p2-welcome{grid-template-columns:1fr}
 .p2-welcome figure{max-width:500px}
 .auth2-top,.auth2-footer{flex-wrap:wrap;gap:6px 18px}
}
@media(max-width:760px){
 .portal2{display:flex;flex-direction:column}
 .p2-topbar{order:initial}
 .p2-sidebar{order:initial;min-height:0;position:static}
 .p2-main,.p2-footer{order:initial}
 .p2-menu-toggle{font-size:15px;min-height:48px;padding:10px 14px;border-color:#7e8980}
 .p2-menu-toggle .p2-icon{width:20px;height:20px}
 .p2-nav-label{font-size:11px}
 .p2-sidebar nav>a{font-size:16px}
 .p2-sidebar-foot>a,.p2-sidebar-foot>button{font-size:14px}
 .p2-footer{flex-wrap:wrap;font-size:12px}
 .p2-footer>a{max-width:none}
 .p2-main{padding:30px 24px}
 .p2-welcome{gap:25px;margin-bottom:30px}
 .p2-welcome h1{font-size:48px}
 .p2-welcome figure{width:100%;min-height:0}
 .p2-offer-card{grid-template-columns:115px minmax(0,1fr)}
 .p2-offer-copy{padding:24px 16px}
 .p2-offer-copy h3{font-size:29px}
 .p2-offer-art{padding:14px 8px 14px 12px}
 .p2-offer-copy .button{padding:12px;gap:8px}
 .p2-record{grid-template-columns:44px minmax(0,1fr)}
 .p2-record dl{grid-column:1/-1;grid-row:4;padding-top:18px;margin-top:18px;border-top:1px solid #cdd4c3}
 .p2-section-heading h2{font-size:28px}
 .p2-explore h3{font-size:24px}
 .offer-steps{flex-wrap:wrap;gap:12px 20px}
 .offer-steps>li{font-size:13px}
 .portal2 .elixir-banner p:not(.eyebrow){font-size:15px}
 .auth2-land{min-height:250px}
 .auth2-location{display:block;left:26px;bottom:22px;font-size:11px}
 .auth2-top{padding:15px 26px;font-size:14px}
 .auth2-main{padding-top:20px}
 .auth2-main h1{font-size:44px}
 .auth2-footer{font-size:13px}
}
@media(max-width:650px){
 .site-header{padding:18px 22px;gap:18px}
 .site-header .brand img{width:195px}
 .shop3{padding:34px 24px 55px}
 .shop3-heading{grid-template-columns:1fr;gap:24px;margin-bottom:28px}
 .shop3-heading h1{font-size:49px}
 .shop3-heading p:not(.eyebrow){font-size:16px}
 .shop3-heading figure{max-width:400px}
 .shop3 .shop-toolbar{align-items:flex-start}
 .shop3 .filter-list{gap:0 5px}
 .shop3 .filter{padding:12px 10px;font-size:15px}
 .shop3 .shop-toolbar>.small{display:none}
 .shop3-tiers{grid-template-columns:1fr;gap:24px}
 .shop3-tier,.shop3-tier:first-child,.shop3-tier:last-child{padding:0 0 25px;border:0;border-bottom:1px solid #cfd3c8}
 .shop3-tier:last-child{border:0}
 .shop3-tier h2{font-size:34px}
 .shop3-coming{grid-template-columns:1fr;gap:25px}
 .product-detail .dialog-body{padding:45px 25px 30px}
}
@media(max-width:380px){
 .site-header .brand img{width:167px}
 .site-header{padding:18px}
 .p2-main{padding-left:18px;padding-right:18px}
 .p2-offer-card{grid-template-columns:1fr}
 .p2-offer-art{padding:22px}
 .p2-offer-art img{max-width:125px}
 .p2-offer-copy{padding:24px}
 .p2-offer-copy h3 br{display:none}
}

/* Match the full-panel label treatment used on the sound journey. */
.p2-offer-area{container-type:inline-size}
.p2-offer-card{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);min-height:0}
.p2-offer-art{position:relative;display:block;width:100%;min-width:0;aspect-ratio:1064/1426;padding:0;overflow:hidden;align-self:stretch}
.p2-offer-art>img{position:absolute;top:0;left:-1.033835%;display:block;width:102.06767%;height:101.54278%;max-width:none;object-fit:cover;object-position:center top;box-shadow:none}
.p2-offer-copy{min-width:0}
@container(max-width:620px){
 .p2-offer-card{grid-template-columns:1fr}
 .p2-offer-copy h3 br{display:none}
}