/* ===========================================================
   brand.css — Engineered Launch / DRE global chrome
   Header, footer, and brand tokens derived from the DRE logo.
   Load AFTER site.css. Uses .el-* class names so it never
   collides with existing site.css or demo.css rules.
   =========================================================== */

:root{
  /* Palette sampled from the DRE lockup */
  --el-navy:#0B2A44;
  --el-navy-deep:#061826;
  --el-navy-mid:#123A5A;
  --el-teal:#0E6E7E;
  --el-teal-light:#3FA3B1;
  --el-gold:#C3982F;
  --el-gold-light:#E0BC63;
  --el-ink:#13212E;
  --el-slate:#5A6B7A;
  --el-slate-light:#8B9AA8;
  --el-hair:#D6DEE6;
  --el-paper:#FFFFFF;
  --el-paper-2:#F3F6F8;

  --el-sans:"Segoe UI",system-ui,-apple-system,Arial,sans-serif;
  --el-serif:Georgia,"Times New Roman",serif;

  --el-header-h:76px;
  --el-shell:1320px;
}

.el-shell{width:min(var(--el-shell),calc(100% - 48px));margin-inline:auto}

/* Neutralise the previous header/footer if any markup lingers. */
.site-header,.site-footer{display:none}

/* ===================== 1. HEADER ===================== */
.el-header{position:sticky;top:0;z-index:100;background:var(--el-paper);font-family:var(--el-sans)}
.el-header::after{content:"";display:block;height:3px;background:linear-gradient(90deg,var(--el-navy) 0%,var(--el-teal) 42%,var(--el-gold) 100%)}

/* --- utility strip --- */
.el-utility{background:var(--el-navy-deep);color:#A9BCCB}
.el-utility .el-shell{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:34px;font-size:.68rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.el-utility b{color:#fff;font-weight:800}
.el-utility .el-scope{display:inline-flex;align-items:center;gap:8px;color:var(--el-gold-light)}
.el-utility .el-scope::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--el-gold);flex:none}
.el-util-links{display:flex;align-items:center;gap:22px}
.el-util-links a{color:#A9BCCB;text-decoration:none}
.el-util-links a:hover{color:#fff}

/* --- main bar --- */
.el-bar{display:flex;align-items:center;gap:34px;min-height:var(--el-header-h)}
.el-logo{display:flex;align-items:center;gap:15px;text-decoration:none;flex:none;padding:10px 0}
.el-logo img{display:block;height:44px;width:auto;transition:height .2s ease}
.el-logo .el-logo-text{display:block;border-left:1px solid var(--el-hair);padding-left:15px}
.el-logo .el-logo-text b{display:block;font-size:.7rem;font-weight:800;letter-spacing:.11em;color:var(--el-navy);text-transform:uppercase;line-height:1.25}
.el-logo .el-logo-text span{display:block;font-size:.63rem;letter-spacing:.06em;color:var(--el-slate);margin-top:2px}

/* --- navigation --- */
.el-nav{display:flex;align-items:stretch;gap:2px;margin-left:auto;height:var(--el-header-h)}
.el-nav>li{list-style:none;display:flex;align-items:stretch;position:relative}
.el-nav>li>a,.el-nav>li>button{display:flex;align-items:center;gap:7px;padding:0 15px;border:0;background:transparent;color:var(--el-ink);font:700 .8rem/1 var(--el-sans);letter-spacing:.02em;text-decoration:none;cursor:pointer;border-bottom:3px solid transparent}
.el-nav>li>a:hover,.el-nav>li>button:hover{color:var(--el-teal);background:var(--el-paper-2)}
.el-nav>li>a[aria-current=page]{color:var(--el-navy);border-bottom-color:var(--el-gold)}
.el-nav .el-caret{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .18s ease;opacity:.6}
.el-nav>li>button[aria-expanded=true]{color:var(--el-teal);background:var(--el-paper-2);border-bottom-color:var(--el-teal)}
.el-nav>li>button[aria-expanded=true] .el-caret{transform:rotate(225deg) translateY(-2px)}

/* --- dropdown panels --- */
.el-panel{position:absolute;top:100%;left:0;min-width:640px;padding:26px 28px 22px;background:var(--el-paper);border:1px solid var(--el-hair);border-top:3px solid var(--el-teal);box-shadow:0 26px 60px rgba(6,24,38,.18);display:none}
.el-panel[data-open]{display:block;animation:el-drop .16s ease-out}
.el-nav>li:last-child .el-panel,.el-panel.el-panel-right{left:auto;right:0}
@keyframes el-drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.el-panel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 30px}
.el-panel h3{grid-column:1/-1;margin:0 0 8px;font:800 .63rem/1 var(--el-sans);letter-spacing:.15em;text-transform:uppercase;color:var(--el-teal)}
.el-panel h3+h3{margin-top:14px}
.el-panel a{display:block;padding:9px 10px;margin-left:-10px;text-decoration:none;border-radius:2px}
.el-panel a:hover{background:var(--el-paper-2)}
.el-panel a b{display:block;font:700 .84rem/1.3 var(--el-sans);color:var(--el-ink)}
.el-panel a:hover b{color:var(--el-teal)}
.el-panel a span{display:block;font-size:.76rem;line-height:1.45;color:var(--el-slate);margin-top:2px}
.el-panel a[data-planned] b::after{content:"PLANNED";margin-left:8px;padding:2px 5px;border:1px solid var(--el-hair);border-radius:2px;font-size:.55rem;letter-spacing:.1em;color:var(--el-slate-light);vertical-align:1px}
.el-panel-foot{grid-column:1/-1;margin-top:16px;padding-top:14px;border-top:1px solid var(--el-hair);font-size:.76rem;color:var(--el-slate);line-height:1.5}
.el-panel-foot b{color:var(--el-navy)}

/* --- header CTA --- */
.el-cta{flex:none;display:inline-flex;align-items:center;gap:9px;margin-left:14px;padding:13px 20px;background:var(--el-navy);color:#fff!important;text-decoration:none;font:800 .78rem/1 var(--el-sans);letter-spacing:.03em;border:1px solid var(--el-navy);transition:background .18s ease}
.el-cta::after{content:"→";font-size:.9rem;color:var(--el-gold-light)}
.el-cta:hover{background:var(--el-teal);border-color:var(--el-teal)}

/* --- mobile toggle --- */
.el-burger{display:none;flex:none;margin-left:auto;width:46px;height:42px;border:1px solid var(--el-hair);background:var(--el-paper);cursor:pointer;position:relative}
.el-burger span,.el-burger::before,.el-burger::after{content:"";position:absolute;left:12px;right:12px;height:2px;background:var(--el-navy);transition:.2s}
.el-burger::before{top:14px}.el-burger span{top:20px}.el-burger::after{top:26px}
.el-burger[aria-expanded=true]::before{top:20px;transform:rotate(45deg)}
.el-burger[aria-expanded=true] span{opacity:0}
.el-burger[aria-expanded=true]::after{top:20px;transform:rotate(-45deg)}

/* --- condensed on scroll --- */
.el-header.is-stuck{box-shadow:0 8px 26px rgba(6,24,38,.11)}
.el-header.is-stuck .el-utility{display:none}
.el-header.is-stuck .el-logo img{height:36px}
.el-header.is-stuck .el-bar,.el-header.is-stuck .el-nav{min-height:62px;height:62px}

/* ===================== 2. FOOTER ===================== */
.el-footer{background:var(--el-navy-deep);color:#9FB3C4;font-family:var(--el-sans);font-size:.87rem;line-height:1.6}
.el-footer::before{content:"";display:block;height:3px;background:linear-gradient(90deg,var(--el-gold) 0%,var(--el-teal) 55%,var(--el-navy-mid) 100%)}

.el-footer-main{display:grid;grid-template-columns:minmax(260px,1fr) repeat(4,minmax(0,.8fr));gap:44px;padding:62px 0 46px}
.el-footer-brand img{display:block;width:230px;max-width:100%;height:auto}
.el-footer-brand p{margin:20px 0 0;color:#8DA3B6;font-size:.83rem;line-height:1.65;max-width:34ch}
.el-footer-pillars{display:flex;gap:14px;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);font-size:.6rem;font-weight:800;letter-spacing:.16em;color:var(--el-gold-light);text-transform:uppercase}
.el-footer-pillars span:not(:last-child)::after{content:"";display:inline-block;width:1px;height:9px;margin-left:14px;background:rgba(224,188,99,.45);vertical-align:-1px}

.el-footer-col h3{margin:0 0 16px;font:800 .64rem/1 var(--el-sans);letter-spacing:.15em;text-transform:uppercase;color:#fff}
.el-footer-col a{display:block;margin:0 0 11px;color:#9FB3C4;text-decoration:none;font-size:.83rem;line-height:1.45}
.el-footer-col a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.el-footer-col a[data-planned]::after{content:"planned";margin-left:7px;font-size:.6rem;letter-spacing:.08em;color:#63788A}

/* --- disclosure band --- */
.el-disclosure{padding:26px 0;border-top:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.02)}
.el-disclosure .el-shell{display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:start}
.el-disclosure-tag{padding:7px 11px;border:1px solid rgba(224,188,99,.4);color:var(--el-gold-light);font:800 .6rem/1 var(--el-sans);letter-spacing:.14em;white-space:nowrap}
.el-disclosure p{margin:0 0 9px;font-size:.79rem;line-height:1.65;color:#8DA3B6;max-width:105ch}
.el-disclosure p:last-child{margin-bottom:0}
.el-disclosure b{color:#C3D3E0}

/* --- legal bar --- */
.el-legal{padding:20px 0 28px;border-top:1px solid rgba(255,255,255,.1)}
.el-legal .el-shell{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.el-legal p{margin:0;font-size:.72rem;letter-spacing:.04em;color:#7D93A6}
.el-legal nav{display:flex;flex-wrap:wrap;gap:22px}
.el-legal nav a{color:#7D93A6;text-decoration:none;font-size:.72rem}
.el-legal nav a:hover{color:#fff}

/* ===================== 3. RESPONSIVE ===================== */
@media(max-width:1180px){
  .el-nav>li>a,.el-nav>li>button{padding:0 11px;font-size:.75rem}
  .el-cta{padding:12px 15px;font-size:.72rem}
  .el-footer-main{grid-template-columns:1fr 1fr 1fr;gap:34px}
  .el-footer-brand{grid-column:1/-1}
}
@media(max-width:900px){
  .el-shell{width:min(var(--el-shell),calc(100% - 32px))}
  .el-burger{display:block}
  .el-bar{min-height:64px;flex-wrap:wrap}
  .el-nav{position:fixed;inset:0 0 0 auto;width:min(380px,88vw);height:auto;flex-direction:column;align-items:stretch;gap:0;margin:0;padding:88px 0 40px;background:var(--el-paper);border-left:1px solid var(--el-hair);box-shadow:-20px 0 60px rgba(6,24,38,.22);overflow-y:auto;transform:translateX(100%);transition:transform .24s ease;z-index:120}
  .el-nav[data-open]{transform:none}
  .el-nav>li{display:block;border-bottom:1px solid var(--el-hair)}
  .el-nav>li>a,.el-nav>li>button{width:100%;justify-content:space-between;padding:17px 24px;border-bottom:0;font-size:.9rem}
  .el-nav .el-caret{margin-left:auto}
  .el-panel{position:static;min-width:0;padding:0 24px 18px;border:0;box-shadow:none;background:var(--el-paper-2)}
  .el-panel-grid{grid-template-columns:1fr;gap:0}
  .el-panel h3{padding-top:16px}
  .el-cta{margin:20px 24px 0;justify-content:center}
  .el-scrim{position:fixed;inset:0;background:rgba(6,24,38,.5);z-index:110;opacity:0;pointer-events:none;transition:opacity .24s}
  .el-scrim[data-open]{opacity:1;pointer-events:auto}
  .el-utility .el-shell{flex-wrap:wrap;gap:6px 16px;padding:7px 0;font-size:.6rem}
  .el-util-links{gap:14px}
  .el-header.is-stuck .el-bar,.el-header.is-stuck .el-nav{height:auto;min-height:0}
  .el-footer-main{grid-template-columns:1fr 1fr;padding:44px 0 34px;gap:30px}
  .el-disclosure .el-shell{grid-template-columns:1fr;gap:14px}
  .el-disclosure-tag{justify-self:start}
}
@media(max-width:560px){
  .el-logo .el-logo-text{display:none}
  .el-footer-main{grid-template-columns:1fr}
  .el-legal .el-shell{flex-direction:column;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){
  .el-panel[data-open]{animation:none}
  .el-nav,.el-scrim,.el-logo img{transition:none}
}
@media print{
  .el-header,.el-footer .el-footer-main,.el-legal nav{display:none!important}
  .el-footer{background:#fff;color:#000}
  .el-disclosure p{color:#000}
}

/* ---------- skip link ---------- */
.el-skip{position:absolute;left:-9999px;top:0;z-index:200;padding:14px 20px;background:var(--el-navy);color:#fff;font:800 .8rem var(--el-sans);text-decoration:none}
.el-skip:focus{left:0}
:focus-visible{outline:3px solid var(--el-teal);outline-offset:2px}

/* ===========================================================
   COOKIE CONSENT
   =========================================================== */
.dre-consent{position:fixed;left:0;right:0;bottom:0;z-index:140;background:var(--el-navy-deep);color:#C6D6E3;border-top:3px solid var(--el-gold);box-shadow:0 -18px 50px rgba(6,24,38,.3);transform:translateY(100%);transition:transform .28s ease;font-family:var(--el-sans)}
.dre-consent[data-visible]{transform:none}
.dre-consent-inner{width:min(var(--el-shell),calc(100% - 48px));margin-inline:auto;display:grid;grid-template-columns:minmax(0,1.5fr) auto;gap:30px;align-items:start;padding:26px 0}
.dre-consent h2{margin:0 0 9px;font:700 1.05rem/1.3 var(--el-serif);color:#fff}
.dre-consent p{margin:0 0 9px;font-size:.83rem;line-height:1.65;max-width:78ch;color:#9FB3C4}
.dre-consent-links{display:flex;gap:20px}
.dre-consent-links a{color:var(--el-gold-light);font-size:.79rem;text-decoration:none;border-bottom:1px solid rgba(224,188,99,.35)}
.dre-consent-links a:hover{color:#fff;border-bottom-color:#fff}
.dre-consent-options{grid-column:1/-1;display:grid;gap:10px;margin-top:4px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12)}
.dre-consent-opt{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;padding:13px 15px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);cursor:pointer}
.dre-consent-opt:hover{border-color:rgba(224,188,99,.4)}
.dre-consent-opt.is-locked{opacity:.72;cursor:default}
.dre-consent-opt input{width:17px;height:17px;margin-top:2px;accent-color:var(--el-teal)}
.dre-consent-opt span{font-size:.81rem;line-height:1.6;color:#9FB3C4}
.dre-consent-opt b{display:block;color:#fff;font-size:.84rem;margin-bottom:2px}
.dre-consent-actions{display:flex;flex-direction:column;gap:9px;min-width:190px}
.dre-consent-actions button{padding:12px 18px;border:1px solid #4C687D;background:transparent;color:#D4E2EA;font:700 .79rem var(--el-sans);cursor:pointer;white-space:nowrap}
.dre-consent-actions button:hover{background:rgba(255,255,255,.07);color:#fff}
.dre-consent-actions .is-primary{background:var(--el-gold);border-color:var(--el-gold);color:#2A1F06;font-weight:800}
.dre-consent-actions .is-primary:hover{background:var(--el-gold-light);color:#2A1F06}
@media(max-width:820px){
  .dre-consent-inner{grid-template-columns:1fr;gap:18px;padding:20px 0;max-height:82vh;overflow-y:auto}
  .dre-consent-actions{flex-direction:row;flex-wrap:wrap;min-width:0}
  .dre-consent-actions button{flex:1 1 auto}
}
@media(prefers-reduced-motion:reduce){.dre-consent{transition:none}}
@media print{.dre-consent{display:none}}

/* ===========================================================
   LEGAL PAGES
   =========================================================== */
.legal-hero{background:linear-gradient(160deg,var(--el-navy-deep),var(--el-navy));color:#fff;padding:56px 0 46px}
.legal-hero .cmp-crumb{color:#8FA6B8;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:20px}
.legal-hero .cmp-crumb a{color:#8FA6B8;text-decoration:none}
.legal-hero h1{font:700 clamp(1.9rem,3.6vw,2.9rem)/1.12 var(--el-serif);margin:0 0 14px}
.legal-hero p{margin:0;max-width:70ch;color:#C6D6E3;line-height:1.65;font-size:1rem}
.legal-meta{display:flex;flex-wrap:wrap;gap:26px;margin-top:24px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14)}
.legal-meta div{font-size:.78rem;color:#9FB3C4}
.legal-meta b{display:block;color:#fff;font:800 .6rem/1 var(--el-sans);letter-spacing:.12em;text-transform:uppercase;margin-bottom:6px}
.legal-wrap{display:grid;grid-template-columns:minmax(220px,.32fr) minmax(0,1fr);gap:48px;padding:56px 0 72px;align-items:start}
.legal-nav{position:sticky;top:96px;border-left:2px solid var(--el-hair);padding-left:18px}
.legal-nav b{display:block;font:800 .6rem/1 var(--el-sans);letter-spacing:.13em;text-transform:uppercase;color:var(--el-slate);margin-bottom:13px}
.legal-nav a{display:block;padding:6px 0;color:#3A4A59;text-decoration:none;font-size:.83rem;line-height:1.45}
.legal-nav a:hover,.legal-nav a.is-active{color:var(--el-teal)}
.legal-body h2{font:700 1.35rem/1.3 var(--el-serif);color:var(--el-ink);margin:40px 0 14px;padding-top:8px}
.legal-body h2:first-child{margin-top:0}
.legal-body h3{font:700 1.02rem/1.35 var(--el-serif);color:var(--el-ink);margin:26px 0 10px}
.legal-body p,.legal-body li{font-size:.92rem;line-height:1.75;color:#3A4A59}
.legal-body p{margin:0 0 14px;max-width:76ch}
.legal-body ul,.legal-body ol{margin:0 0 16px;padding-left:22px;max-width:76ch}
.legal-body li{margin-bottom:8px}
.legal-body a{color:var(--el-teal)}
.legal-body code{font:600 .85rem ui-monospace,monospace;background:#EDF2F6;padding:1px 6px;border-radius:2px;color:var(--el-navy)}
.legal-callout{border-left:3px solid var(--el-teal);background:var(--el-paper-2);padding:18px 22px;margin:22px 0}
.legal-callout b{display:block;color:var(--el-navy);margin-bottom:5px;font-size:.85rem}
.legal-callout p{margin:0;font-size:.87rem}
.legal-callout.warn{border-left-color:var(--el-gold);background:#FFFCF4}
.legal-table{width:100%;border-collapse:collapse;margin:18px 0;font-size:.86rem;background:#fff;border:1px solid var(--el-hair)}
.legal-table th{background:var(--el-navy);color:#fff;text-align:left;padding:11px 13px;font:800 .64rem/1.3 var(--el-sans);letter-spacing:.08em;text-transform:uppercase}
.legal-table td{padding:12px 13px;border-top:1px solid var(--el-hair);vertical-align:top;line-height:1.6;color:#3A4A59}
.legal-table code{white-space:nowrap}
@media(max-width:900px){
  .legal-wrap{grid-template-columns:1fr;gap:26px;padding:34px 0 50px}
  .legal-nav{position:static;border-left:0;border-top:2px solid var(--el-hair);padding:18px 0 0}
}
