/* === Base === */
.announcement-banner{position:relative;z-index:80;overflow:hidden;opacity:0;transition:top .3s ease-in-out}
.announcement-banner.is-positioned{opacity:1}
/* Fallback: if JS fails to position banner, show it after 1.5s */
@keyframes ab-show{to{opacity:1}}
.announcement-banner:not(.is-positioned){animation:ab-show 0s 1.5s forwards}

/* === Background colors === */
.announcement-banner .bg-electric-blue{background-color:rgba(44,60,187,1)}
.announcement-banner .bg-black{background-color:#000}
.announcement-banner .bg-white{background-color:#fff}
.announcement-banner .bg-oatmeal{background-color:#e7e4df}
.announcement-banner .bg-forged-steel{background-color:#3a352e}

/* === Text colors based on background === */
.announcement-banner .bg-white,.announcement-banner .bg-oatmeal{color:#000}
.announcement-banner .bg-white .announcement-banner__label,.announcement-banner .bg-oatmeal .announcement-banner__label{color:#5d564b}
.announcement-banner .bg-white .announcement-banner__heading,.announcement-banner .bg-oatmeal .announcement-banner__heading{color:#000}
.announcement-banner .bg-black,.announcement-banner .bg-forged-steel,.announcement-banner .bg-electric-blue{color:#fff}
.announcement-banner .bg-black .announcement-banner__label,.announcement-banner .bg-forged-steel .announcement-banner__label,.announcement-banner .bg-electric-blue .announcement-banner__label{color:#b6ada0}
.announcement-banner .bg-black .announcement-banner__heading,.announcement-banner .bg-forged-steel .announcement-banner__heading,.announcement-banner .bg-electric-blue .announcement-banner__heading{color:#fff}

/* === Custom text color overrides === */
.announcement-banner .text-color-electric-blue{color:rgba(44,60,187,1) !important}
.announcement-banner .text-color-electric-green{color:#8FFF3E !important}
.announcement-banner .text-color-black{color:#000 !important}
.announcement-banner .text-color-white{color:#fff !important}
.announcement-banner .text-color-oatmeal{color:#e7e4df !important}
.announcement-banner .text-color-forged-steel{color:#3a352e !important}

/* === Green borders === */
.announcement-banner.has-green-borders{border-top:2px solid #8FFF3E;border-bottom:2px solid #8FFF3E}

/* === Alignment === */
.announcement-banner .align-center{text-align:center}
.announcement-banner .align-center .frame{justify-content:center !important}
.announcement-banner .align-center .announcement-banner__collapsed-content{align-items:center}
.announcement-banner .align-center .announcement-banner__expanded-content{margin-left:auto;margin-right:auto;text-align:center}
.announcement-banner .align-center .announcement-banner__expanded-actions{justify-content:center}
.announcement-banner .align-left{text-align:left}
.announcement-banner .align-left .announcement-banner__collapsed-content{align-items:flex-start}
.announcement-banner .align-left .announcement-banner__expanded-content{text-align:left}
.announcement-banner .align-right{text-align:right}
.announcement-banner .align-right .announcement-banner__collapsed-content{align-items:flex-end}
.announcement-banner .align-right .announcement-banner__expanded-content{margin-left:auto;text-align:right}
.announcement-banner .align-right .announcement-banner__expanded-actions{justify-content:flex-end}

/* === Expanded bg image / video === */
.announcement-banner__bg{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:0;transition:opacity .6s ease;z-index:0}
.announcement-banner__bg::after{display:none}
.announcement-banner.is-expanded .announcement-banner__bg{opacity:1}
.announcement-banner.has-bg-image .announcement-banner__expanded{background-color:transparent !important}
.announcement-banner__bg--video video{position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;width:auto;height:auto;transform:translate(-50%,-50%);object-fit:cover}

/* === Collapsed bar === */
.announcement-banner__collapsed{position:relative;z-index:2;opacity:1;transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .25s ease,padding .4s cubic-bezier(.4,0,.2,1);overflow:hidden;max-height:150px;background-size:cover;background-position:center;background-repeat:no-repeat}
.announcement-banner.is-expanded .announcement-banner__collapsed{max-height:0;opacity:0;padding:0 !important;pointer-events:none}
.announcement-banner__collapsed .frame{display:flex;align-items:center;justify-content:center !important;gap:16px;position:relative;z-index:2}
.announcement-banner__collapsed-content{display:flex;flex-direction:column;gap:0;flex:1}
.announcement-banner__label{font-size:1rem;text-transform:uppercase;letter-spacing:1.2px;white-space:nowrap;margin-bottom:4px}
.announcement-banner__heading{font-size:2.1rem;text-transform:uppercase;letter-spacing:1.5px;white-space:nowrap;margin-bottom:2px}
.announcement-banner__collapsed-link{font-size:1.1rem;text-transform:uppercase;letter-spacing:1px;text-decoration:underline;text-underline-offset:3px;transition:opacity .2s ease}
.announcement-banner__collapsed-link:hover{opacity:.7}

/* === Collapsed video background === */
.announcement-banner__collapsed-video{position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;width:auto;height:auto;transform:translate(-50%,-50%);object-fit:cover;z-index:1}

/* === Link/button colors === */
.announcement-banner .btn-color-electric-blue{color:rgba(44,60,187,1)}
.announcement-banner .btn-color-black{color:#000}
.announcement-banner .btn-color-white{color:#fff}
.announcement-banner .btn-color-oatmeal{color:#e7e4df}
.announcement-banner .btn-color-forged-steel{color:#3a352e}

/* Expanded button overrides */
.announcement-banner__expanded-actions .btn.btn-color-electric-blue{background-color:rgba(44,60,187,1);border-color:rgba(44,60,187,1);color:#fff}
.announcement-banner__expanded-actions .btn.btn-color-black{background-color:#000;border-color:#000;color:#fff}
.announcement-banner__expanded-actions .btn.btn-color-white{background-color:#fff;border-color:#fff;color:#000}
.announcement-banner__expanded-actions .btn.btn-color-oatmeal{background-color:#e7e4df;border-color:#e7e4df;color:#000}
.announcement-banner__expanded-actions .btn.btn-color-forged-steel{background-color:#3a352e;border-color:#3a352e;color:#fff}
/* Arrow SVG visibility fix — make arrow contrast with button bg */
.announcement-banner__expanded-actions .btn.btn-color-white .button-arrow-svg path,.announcement-banner__expanded-actions .btn.btn-color-oatmeal .button-arrow-svg path{fill:#000 !important}
.announcement-banner__expanded-actions .btn.btn-color-black .button-arrow-svg path,.announcement-banner__expanded-actions .btn.btn-color-forged-steel .button-arrow-svg path,.announcement-banner__expanded-actions .btn.btn-color-electric-blue .button-arrow-svg path{fill:#fff !important}
.announcement-banner__expanded-actions .btn.secondary{background-color:transparent !important;border:2px solid currentColor}
.announcement-banner__expanded-actions .btn.secondary .button-arrow-svg path{fill:currentColor !important}
.announcement-banner__expanded-actions .btn.secondary.btn-color-electric-blue{color:rgba(44,60,187,1)}
.announcement-banner__expanded-actions .btn.secondary.btn-color-black{color:#000}
.announcement-banner__expanded-actions .btn.secondary.btn-color-white{color:#fff}
.announcement-banner__expanded-actions .btn.secondary.btn-color-oatmeal{color:#e7e4df}
.announcement-banner__expanded-actions .btn.secondary.btn-color-forged-steel{color:#3a352e}

/* === Plus/X toggle icon === */
.announcement-banner .icon-color-electric-blue{color:rgba(44,60,187,1)}
.announcement-banner .icon-color-black{color:#000}
.announcement-banner .icon-color-white{color:#fff}
.announcement-banner .icon-color-oatmeal{color:#e7e4df}
.announcement-banner .icon-color-forged-steel{color:#3a352e}

.announcement-banner .announcement-banner__toggle,.announcement-banner .announcement-banner__toggle:hover,.announcement-banner .announcement-banner__toggle:focus{display:flex;align-items:center;justify-content:center;background:none !important;background-color:transparent !important;border:none !important;cursor:pointer;padding:0 !important;min-height:0 !important;margin:0 !important;border-radius:0 !important;box-shadow:none !important;outline:none !important;position:static !important;flex-shrink:0;transition:opacity .2s ease}
.announcement-banner .announcement-banner__toggle:hover{opacity:.7}
.announcement-banner__icon-minus{display:none}
.announcement-banner__icon-plus{display:block}
.announcement-banner.is-expanded .announcement-banner__icon-minus{display:block}
.announcement-banner.is-expanded .announcement-banner__icon-plus{display:none}

/* === Expanded panel === */
.announcement-banner__expanded{position:relative;z-index:2;max-height:0;opacity:0;overflow:hidden;transition:max-height .6s cubic-bezier(.4,0,.2,1),opacity .5s ease .15s,padding .6s cubic-bezier(.4,0,.2,1);padding:0}
.announcement-banner.is-expanded .announcement-banner__expanded{max-height:600px;opacity:1;padding:60px 0 72px}
.announcement-banner__expanded .frame{position:relative}

/* === Expanded grid (1-col default) === */
.announcement-banner__expanded-grid{display:block}
.announcement-banner__expanded-content{max-width:700px}
.announcement-banner__expanded-content .announcement-banner__label{display:block;margin-bottom:24px}
.announcement-banner__expanded-heading{margin-bottom:20px;text-transform:uppercase}
.announcement-banner__expanded-desc{margin-bottom:32px;font-size:.95rem;line-height:1.6;opacity:.8}
.announcement-banner__expanded-actions{display:flex;gap:12px;flex-wrap:wrap}

/* === 2-column layout === */
.announcement-banner.layout-2col .announcement-banner__expanded-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.announcement-banner.layout-2col .announcement-banner__expanded-content{max-width:none}
.announcement-banner.layout-2col .align-center .announcement-banner__expanded-content{margin-left:0;margin-right:0}

/* === Expanded media column === */
.announcement-banner__expanded-media{position:relative;width:100%;overflow:hidden;border-radius:4px}
.announcement-banner__media-video{width:100%;height:auto;display:block;border-radius:4px}
.announcement-banner__media-image{width:100%;height:auto;display:block;border-radius:4px;object-fit:cover}

/* === Close button (X icon in expanded) === */
.announcement-banner .announcement-banner__close,.announcement-banner .announcement-banner__close:hover,.announcement-banner .announcement-banner__close:focus{position:absolute !important;top:0;right:0;background:none !important;background-color:transparent !important;border:none !important;cursor:pointer;padding:0 !important;line-height:0;min-height:0 !important;margin:0 !important;border-radius:0 !important;box-shadow:none !important;outline:none !important;flex-shrink:0;transition:opacity .2s ease;width:auto !important;display:block !important}
.announcement-banner .announcement-banner__close:hover{opacity:.7}

/* === Link position: right (button style) === */
.announcement-banner.link-position-right .announcement-banner__collapsed .frame{position:relative;padding-right:50px}
.announcement-banner.link-position-right .announcement-banner__collapsed-content{flex:none}
.announcement-banner__collapsed-link--btn{text-decoration:none !important;border:2px solid currentColor;border-radius:4px;padding:8px 20px;white-space:nowrap;flex-shrink:0;margin-left:24px;transition:opacity .2s ease,background-color .2s ease}
.announcement-banner__collapsed-link--btn:hover{opacity:.85;background-color:rgba(255,255,255,.1)}
.announcement-banner.link-position-right .announcement-banner__collapsed .announcement-banner__toggle,
.announcement-banner.link-position-right .announcement-banner__collapsed .announcement-banner__toggle:hover,
.announcement-banner.link-position-right .announcement-banner__collapsed .announcement-banner__toggle:focus{position:absolute !important;right:0 !important;top:50% !important;transform:translateY(-50%) !important}

/* === 2-col close icon fix: don't overlap right column === */
.announcement-banner.layout-2col .announcement-banner__expanded .frame{padding-top:44px}
.announcement-banner.layout-2col .announcement-banner__close{top:8px !important;right:0 !important}

/* === Responsive === */
@media (max-width:1024px){
.announcement-banner__label{font-size:.9rem}
.announcement-banner__heading{font-size:1.8rem}
.announcement-banner.is-expanded .announcement-banner__expanded{padding:48px 0 56px}
}

@media (max-width:767px){
/* Collapsed bar: keep horizontal flex, toggle stays right */
.announcement-banner .announcement-banner__collapsed .frame{display:flex !important;flex-direction:row !important;align-items:center !important;position:relative !important;gap:12px}
.announcement-banner__collapsed-content{flex:1;min-width:0}
.announcement-banner__label{white-space:normal;font-size:.75rem;letter-spacing:.8px;margin-bottom:2px}
.announcement-banner__heading{white-space:normal;font-size:1.35rem;letter-spacing:.6px;line-height:1.3;margin-bottom:2px}
.announcement-banner__collapsed-link{white-space:normal;font-size:.8rem;letter-spacing:.5px}
.announcement-banner__collapsed{max-height:400px}

/* Toggle: stay in flex flow, don't shrink */
.announcement-banner .announcement-banner__collapsed .announcement-banner__toggle,
.announcement-banner .announcement-banner__collapsed .announcement-banner__toggle:hover,
.announcement-banner .announcement-banner__collapsed .announcement-banner__toggle:focus{position:static !important;width:auto !important;display:flex !important;margin:0 !important;flex-shrink:0 !important}

/* Link-position-right: use grid on mobile for precise placement */
.announcement-banner.link-position-right .announcement-banner__collapsed .frame{display:grid !important;grid-template-columns:1fr auto;grid-template-rows:auto auto;align-items:center;gap:8px 12px;padding-right:0 !important}
.announcement-banner.link-position-right .announcement-banner__collapsed-content{grid-column:1;grid-row:1}
.announcement-banner.link-position-right .announcement-banner__collapsed .announcement-banner__toggle,
.announcement-banner.link-position-right .announcement-banner__collapsed .announcement-banner__toggle:hover,
.announcement-banner.link-position-right .announcement-banner__collapsed .announcement-banner__toggle:focus{grid-column:2;grid-row:1;position:static !important;top:auto !important;right:auto !important;transform:none !important}
/* See More button: centered under headline text, proper button size */
.announcement-banner.link-position-right .announcement-banner__collapsed-link--btn{grid-column:1;grid-row:2;justify-self:center;margin:0 !important;padding:8px 24px;font-size:.9rem;border:2px solid currentColor !important;border-radius:4px;text-decoration:none !important}

/* Toggle / close icons */
.announcement-banner .announcement-banner__toggle svg,.announcement-banner .announcement-banner__close svg{width:22px;height:22px}

/* Expanded panel */
.announcement-banner.is-expanded .announcement-banner__expanded{max-height:2000px;padding:24px 0 32px}
.announcement-banner .announcement-banner__expanded .frame{position:relative !important;padding-right:40px}
.announcement-banner__expanded-content{max-width:100%}
.announcement-banner__expanded-content .announcement-banner__label{margin-bottom:10px}
.announcement-banner__expanded-heading{font-size:2.7rem;line-height:1.2;margin-bottom:10px}
.announcement-banner__expanded-desc{font-size:.9rem;margin-bottom:16px}
.announcement-banner__expanded-actions{flex-direction:column}
.announcement-banner__expanded-actions .btn{width:100%}

/* 2-col stacks on mobile */
.announcement-banner.layout-2col .announcement-banner__expanded-grid{grid-template-columns:1fr;gap:20px}
.announcement-banner.layout-2col .announcement-banner__expanded .frame{padding-top:40px}
.announcement-banner__expanded-media{max-width:100%}

/* Close button: override global button mobile styles (width:100%, display:flex) */
.announcement-banner .announcement-banner__expanded .announcement-banner__close,
.announcement-banner .announcement-banner__expanded .announcement-banner__close:hover,
.announcement-banner .announcement-banner__expanded .announcement-banner__close:focus{position:absolute !important;top:8px !important;right:8px !important;left:auto !important;bottom:auto !important;z-index:10 !important;width:auto !important;display:block !important;margin:0 !important;padding:0 !important;min-height:0 !important;background:none !important;background-color:transparent !important;border:none !important;border-radius:0 !important;box-shadow:none !important}
}