/* Reference credential layout; existing authentication forms remain intact. */
.credential-nav,.credential-welcome,.credential-login-title,.credential-login-sub{display:none}
html body#scenicAuth.ig-auth:not(.is-index-tab){background:#d9eaff url('../assets/auth-pavilion.png') center/cover fixed no-repeat!important;color:#071330!important;font-family:Arial,Helvetica,sans-serif}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-nav{display:flex;align-items:center;gap:30px;padding:16px 6.8%;height:84px;box-sizing:border-box;background:#0e1b2c;color:#d8deea;position:relative;z-index:2}
.credential-brand{font-size:48px;font-weight:750;letter-spacing:-2px;color:white!important;line-height:1}.credential-brand span{color:#008dff}.credential-nav nav{display:flex;flex:1;justify-content:center;gap:30px}.credential-nav nav a{color:#d8deea;font-size:18px;white-space:nowrap}.credential-search{color:#e0e6ef;font-size:26px}.credential-signin{background:linear-gradient(110deg,#00b4f8,#1835ff);padding:16px 30px;border-radius:12px;color:#fff!important;font-size:19px;font-weight:600;white-space:nowrap}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page{min-height:calc(100svh - 84px);background:none!important;display:flex;flex-direction:column}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-shell{width:87%;max-width:1800px;grid-template-columns:minmax(0,1fr) minmax(380px,520px);gap:9%;padding:60px 0 30px;margin:auto;align-items:center}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-left>.ig-logo,html body#scenicAuth.ig-auth:not(.is-index-tab) .ig-headline,html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-hero-description,html body#scenicAuth.ig-auth:not(.is-index-tab) .ig-phones,html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-benefits{display:none!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-welcome{display:block}
.credential-welcome h1{font-size:clamp(48px,4.5vw,78px);line-height:1.02;letter-spacing:-2px;font-weight:800;margin:0 0 12px;color:#061137}.credential-welcome h1 span{color:#0766ff;font-size:1.35em}.credential-welcome>p{color:#52617b;font-size:24px;line-height:1.35;margin:0 0 26px}.credential-benefits{display:grid;gap:18px}.credential-benefits>div{display:flex;align-items:center;gap:18px}.credential-benefits>div>i{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:#c7edff;color:#009cff;font-size:34px;flex-shrink:0}.credential-benefits>div:nth-child(2)>i{background:#d4f7e6;color:#00ad54}.credential-benefits>div:nth-child(3)>i{background:#e8d7ff;color:#7822eb}.credential-benefits>div:nth-child(4)>i{background:#ffe2c9;color:#ff7b00}.credential-benefits p{margin:0;color:#5e6e87;font-size:18px;line-height:1.4}.credential-benefits strong{display:block;color:#091939;font-size:21px;margin-bottom:3px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-right{padding:40px 44px!important;border-radius:28px;background:linear-gradient(120deg,#ffffffed,#edf2f9e8)!important;backdrop-filter:blur(20px);box-shadow:0 15px 45px #13294f26;border:1px solid #ffffffa8;box-sizing:border-box}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-right-head{margin:0 0 24px!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-login-title{display:block;color:#07132f;font-size:40px;font-weight:750;margin:0 0 10px;letter-spacing:-1px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-login-sub{display:block;color:#66758d;font-size:19px;margin:0}
html body#scenicAuth.ig-auth:not(.is-index-tab)[data-auth-view=login] :is(.auth-sub,.auth-kicker,.auth-title){display:none!important}
html body#scenicAuth.ig-auth:not(.is-index-tab)[data-auth-view=register] :is(.credential-login-title,.credential-login-sub){display:none}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-field{background:#ffffffef!important;border:1px solid #e6e9f0!important;min-height:56px;border-radius:14px;margin-bottom:14px;padding:10px 18px;gap:14px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-field input,html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-field select{color:#17233b!important;font-size:17px;background:transparent!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-field input::placeholder{color:#637189!important;font-size:17px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-field .fa{color:#72819a!important;font-size:23px!important}
.scenic-login-options{justify-content:flex-end;margin:0 0 24px;font-size:16px}.scenic-login-options>span{display:none}.scenic-login-options a{color:#0868ff}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-continue{height:56px;border-radius:18px;background:linear-gradient(105deg,#00b8ef,#1935ff)!important;font-size:20px;position:relative}.auth-continue>.fa-arrow-right{position:absolute;right:24px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .scenic-or{color:#748198;margin:22px 0;gap:18px}.scenic-or:before,.scenic-or:after{background:#d9dfe8}
html body#scenicAuth.ig-auth:not(.is-index-tab) .scenic-social{height:56px;background:#ffffffee;color:#0a1732;border:1px solid #e5e9f1;border-radius:15px;font-size:17px;margin-bottom:14px;gap:16px}.microsoft-mark{display:grid;grid-template-columns:repeat(2,14px);gap:2px}.microsoft-mark i{height:14px;background:#f25022}.microsoft-mark i:nth-child(2){background:#7fba00}.microsoft-mark i:nth-child(3){background:#00a4ef}.microsoft-mark i:nth-child(4){background:#ffb900}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-switch{font-size:16px;color:#66748b;margin-top:24px}html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-switch button{font-size:16px;color:#0868ff!important;text-decoration:none}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page-foot{background:#0e1b2c;width:100%;margin-top:auto;padding:14px;text-align:center;box-sizing:border-box}.auth-page-copy{color:#bdc8da!important;font-size:16px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page-foot nav{display:none!important}
@media(max-width:1200px){.credential-nav nav{gap:15px}.credential-nav nav a{font-size:14px}html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-nav{padding:16px 4%;gap:20px}.credential-brand{font-size:38px}html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-shell{width:90%;gap:6%;grid-template-columns:1fr 440px}.credential-welcome>p{font-size:20px}html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-right{padding:32px!important}}
@media(max-width:900px){.credential-nav nav{display:none}.credential-brand{margin-right:auto}html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-shell{grid-template-columns:1fr;max-width:520px;padding:35px 0;gap:30px}.credential-welcome{text-align:center}.credential-welcome h1{font-size:44px}.credential-welcome>p{font-size:18px}.credential-benefits{display:none}html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-right{padding:28px!important}.credential-login-title{font-size:32px}.credential-signin{padding:12px 20px}}

html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page-foot{justify-content:center}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page-foot>:not(.auth-page-copy){display:none!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-left{position:relative}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page{background:linear-gradient(90deg,rgba(255,255,255,.65),transparent 60%)!important}
/* Compact credential proportions for everyday laptop and desktop screens. */
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-nav{height:68px;padding:10px 6%;gap:24px}
.credential-brand{font-size:38px;letter-spacing:-1.5px}
.credential-nav nav{gap:24px}.credential-nav nav a{font-size:15px}
.credential-search{font-size:22px}.credential-signin{font-size:16px;padding:12px 25px;border-radius:10px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page{min-height:calc(100svh - 68px)}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-shell{width:86%;max-width:1440px;grid-template-columns:minmax(0,1fr) minmax(340px,430px);gap:9%;padding:30px 0 24px}
.credential-welcome h1{font-size:clamp(40px,4.1vw,64px);letter-spacing:-1.5px;margin-bottom:12px}
.credential-welcome>p{font-size:20px;margin-bottom:22px}
.credential-benefits{gap:16px}.credential-benefits>div{gap:14px}
.credential-benefits>div>i{width:58px;height:58px;font-size:27px}
.credential-benefits p{font-size:15px;line-height:1.4}.credential-benefits strong{font-size:18px;margin-bottom:2px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-right{padding:30px 32px!important;border-radius:24px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-right-head{margin-bottom:22px!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-login-title{font-size:32px;margin-bottom:8px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-login-sub{font-size:16px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-field{min-height:48px;padding:9px 13px;gap:12px;border-radius:11px;margin-bottom:12px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-field :is(input,select){font-size:15px!important;min-width:0}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-field input::placeholder{font-size:15px!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-field .fa{font-size:20px!important;width:22px;flex-basis:22px}
.scenic-login-options{font-size:14px;margin:0 0 20px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-continue{height:48px;border-radius:13px;font-size:17px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .scenic-or{margin:17px 0;font-size:14px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .scenic-social{height:48px;font-size:15px;border-radius:12px;margin-bottom:12px;gap:13px}
.google-mark{font-size:28px}.microsoft-mark{grid-template-columns:repeat(2,12px)}.microsoft-mark i{height:12px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-switch{font-size:14px;margin-top:18px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-switch button{font-size:14px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page-foot{padding:10px}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page-copy{font-size:13px;margin:0}
@media(min-width:901px) and (max-height:800px){
 html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-shell{padding:20px 0;max-width:1320px}
 html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-right{padding:24px 28px!important}
 .credential-welcome h1{font-size:48px}.credential-welcome>p{font-size:18px;margin-bottom:18px}
 .credential-benefits{gap:12px}.credential-benefits>div>i{width:48px;height:48px;font-size:23px}
 .credential-benefits p{font-size:14px}.credential-benefits strong{font-size:16px}
 html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-right-head{margin-bottom:18px!important}
 html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-login-title{font-size:28px}
 html body#scenicAuth.ig-auth:not(.is-index-tab) .scenic-or{margin:12px 0}
 html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-switch{margin-top:12px}
}
@media(max-width:1100px){.credential-nav nav{gap:14px}.credential-nav nav a{font-size:13px}}
@media(max-width:900px){
 html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-shell{width:calc(100% - 32px);max-width:430px;display:flex;flex-direction:column;gap:22px;padding:26px 0}
 html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-right{width:100%;padding:26px!important}
 .credential-welcome h1{font-size:36px}.credential-welcome>p{font-size:16px;margin-bottom:0}
 .credential-signin{padding:10px 18px;font-size:14px}.credential-brand{font-size:32px}
}
@media(max-width:400px){html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-right{padding:22px 18px!important}.credential-search{display:none}html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-switch{font-size:13px}.scenic-social{white-space:nowrap}}
/* Credential links and controls use color and focus outlines, without underlines. */
html body#scenicAuth.ig-auth:not(.is-index-tab) :is(a,button),
html body#scenicAuth.ig-auth:not(.is-index-tab) :is(a,button):is(:hover,:focus,:active){text-decoration:none!important}
/* Open image-backed header/footer with a light scrim for consistent contrast. */
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-nav,
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page-foot{
 background:rgba(255,255,255,.82)!important;
 backdrop-filter:blur(14px);
 border:0!important;
 color:#12213b!important;
}
html body#scenicAuth.ig-auth:not(.is-index-tab) :is(.credential-brand,.credential-nav nav a,.credential-search,.auth-page-copy){color:#12213b!important;text-shadow:none!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-brand span{color:#0078ed!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-signin{color:#fff!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) :is(.credential-welcome>p,.credential-benefits p){color:#344762!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-benefits strong{color:#091939!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) :is(a,button,a:hover,a:focus,a:active){text-decoration:none!important}
html:has(body#scenicAuth.ig-auth:not(.is-index-tab)),
html body#scenicAuth.ig-auth:not(.is-index-tab),
html body#scenicAuth.ig-auth:not(.is-index-tab) :is(.auth-page,.credential-nav,.auth-page-foot){border:0!important;outline:0!important;box-shadow:none!important}
/* Public About header follows a light, readable surface. */
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] .hc-top{
 background:rgba(255,255,255,.9)!important;
 background-image:none!important;
 color:#17243c!important;
 border:0!important;
 box-shadow:none!important;
}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] .hc-top :is(a,button,span,label){color:#17243c}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] .hc-top .hc-search input{
 background:#f4f7fb!important;color:#17243c!important;border-color:#cbd3df!important;
}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] .hc-top .hc-search input::placeholder{color:#5c6c83!important}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"]{background:#d9eaff url('../assets/auth-pavilion.png') center/cover fixed no-repeat!important}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] .hc-top{
 background:transparent!important;background-color:transparent!important;backdrop-filter:none!important;
 border:0!important;outline:0!important;box-shadow:none!important;
}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] .hc-top :is(.hc-menu-toggle,.hc-menu-btn){background:rgba(255,255,255,.65)!important;color:#17243c!important}
/* Transparency must continue through the header's parent surfaces. */
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] :is(.auth-page,#authLegal.help-center,#authLegal>.hc-top){
 background:transparent!important;background-color:transparent!important;background-image:none!important;
}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] #authLegal>.hc-top{border:0!important;box-shadow:none!important}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] #authLegal>.hc-top :is(.hc-brand,.hc-brand-text,.hc-brand-text b){color:#071b36!important;text-shadow:0 1px 3px #ffffffb3}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] #hcNavToggle{background:#ffffffb3!important;color:#17243c!important;border:1px solid #899ab9!important}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] .hc-menu-ico{color:#17243c!important}
/* About uses its own existing hero image; no second scenic header image. */
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"]{background:var(--hc-story-bg,#f5f7fb)!important;background-image:none!important}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] #authLegal{position:relative}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] #authLegal>.hc-top{position:absolute;top:0;left:0;right:0;z-index:20;background:transparent!important}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] .hc-body{padding-top:0}
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] .hc-story-hero-copy{padding-top:110px}
/* Login uses one image on the body, visible continuously behind its chrome. */
html body#scenicAuth.ig-auth:not(.is-index-tab){background-position:center top!important;background-size:cover!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) :is(.credential-nav,.auth-page-foot){
 background:transparent!important;background-color:transparent!important;background-image:none!important;
 backdrop-filter:none!important;border:0!important;box-shadow:none!important;
}
html body#scenicAuth.ig-auth:not(.is-index-tab) .auth-page{background:transparent!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) :is(.credential-nav a,.auth-page-copy){color:#10213b!important;text-shadow:0 1px 4px rgba(255,255,255,.9)}
/* Keep hero lettering and feature glyphs vivid under global Appearance colors. */
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-welcome h1{color:#061538!important;-webkit-text-fill-color:#061538!important;text-shadow:0 1px 4px rgba(255,255,255,.6)}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-welcome h1 span{color:#0766ff!important;-webkit-text-fill-color:#0766ff!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-benefits>div>i{color:#007bdc!important;-webkit-text-fill-color:#007bdc!important;opacity:1!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-benefits>div:nth-child(2)>i{color:#008c45!important;-webkit-text-fill-color:#008c45!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-benefits>div:nth-child(3)>i{color:#7021d5!important;-webkit-text-fill-color:#7021d5!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-benefits>div:nth-child(4)>i{color:#e96a00!important;-webkit-text-fill-color:#e96a00!important}
html body#scenicAuth.ig-auth:not(.is-index-tab) .credential-nav nav{justify-content:flex-start;text-align:left}
/* Keep the overlaid About header clear of the opened navigation contents. */
html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] #authLegal:not(.is-nav-closed) #hcNav{
 padding-top:96px!important;
 box-sizing:border-box;
 scroll-padding-top:96px;
}
@media(max-width:900px){
 html body#scenicAuth.ig-auth.is-index-tab[data-index-tab="about"] #authLegal:not(.is-nav-closed) #hcNav{padding-top:140px!important;scroll-padding-top:140px}
}
