/* The Jet Finder Forecast — shared look for the role pages (brand: navy + gold, Cinzel / EB Garamond / Instrument Sans) */
:root{
  --navy:#021422;--navy-2:#0a2e4a;--navy-3:#0d3a5c;--navy-deep:#010d17;
  --gold:#bfa163;--gold-2:#d4a853;--gold-dim:rgba(191,161,99,.25);--gold-glow:rgba(191,161,99,.15);
  --text:#f2f3f5;--text-2:rgba(242,243,245,.82);--muted:rgba(242,243,245,.55);--line:rgba(255,255,255,.08);
  --tight:#c0392b;--loose:#2e8b57;--neutral:#1b3550;--tight-soft:rgba(192,57,43,.16);--loose-soft:rgba(46,139,87,.16);
  --font-heading:'Cinzel','EB Garamond',serif;--font-display:'EB Garamond',Georgia,serif;--font-body:'Instrument Sans',-apple-system,'Segoe UI',Roboto,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--navy);color:var(--text-2);font-family:var(--font-body);font-size:18px;line-height:1.55}
a{color:var(--gold-2)}
button,select,input{font:inherit}
:focus-visible{outline:2px solid var(--gold-2);outline-offset:2px}
h1,h2,h3{margin:0;color:var(--text)}
h2{font-family:var(--font-display);font-weight:500;font-size:1.8rem;line-height:1.2}
h3{font-family:var(--font-heading);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);font-weight:600;margin:1.4rem 0 .6rem}
.wrap{max-width:1900px;margin:0 auto;padding:0 2rem}

/* ---- unified header: title left, hamburger menu right ---- */
header.top{border-bottom:1px solid var(--gold-dim);background:linear-gradient(180deg,rgba(10,46,74,.55),rgba(2,20,34,0))}
.topbar{display:flex;align-items:center;gap:1.2rem;padding:1rem 0;min-height:4.6rem}
.topbar .ttl{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;min-width:0}
.topbar h1{font-family:var(--font-heading);font-weight:600;font-size:1.6rem;letter-spacing:.08em;color:var(--text);margin:0;white-space:nowrap}
.topbar .sub{font-family:var(--font-display);font-style:italic;font-size:1.2rem;color:var(--gold)}
.menu{margin-left:auto;position:relative;flex:none}
.menu-btn{display:flex;align-items:center;gap:.7rem;background:transparent;color:var(--text);border:1px solid var(--gold-dim);border-radius:6px;padding:.6rem .9rem;cursor:pointer;font-size:.85rem;letter-spacing:.12em;text-transform:uppercase}
.menu-btn:hover{border-color:var(--gold)}
.menu-btn .bars{display:inline-block;width:22px;height:14px;position:relative}
.menu-btn .bars::before,.menu-btn .bars::after,.menu-btn .bars i{content:'';position:absolute;left:0;right:0;height:2px;background:var(--gold);border-radius:1px}
.menu-btn .bars::before{top:0}.menu-btn .bars i{top:6px}.menu-btn .bars::after{bottom:0}
.menu-list{position:absolute;right:0;top:calc(100% + .5rem);min-width:360px;background:var(--navy-deep);border:1px solid var(--gold-dim);border-radius:8px;padding:.5rem;display:none;z-index:100;box-shadow:0 12px 40px rgba(0,0,0,.5)}
.menu.open .menu-list{display:block}
.menu-list a{display:block;color:var(--text-2);text-decoration:none;padding:.75rem .9rem;border-radius:5px;font-size:1rem}
.menu-list a small{display:block;color:var(--muted);font-size:.82rem;margin-top:.1rem}
.menu-list a:hover{background:var(--navy-2);color:var(--text)}
.menu-list a.on{background:var(--gold);color:var(--navy)}
.menu-list a.on small{color:rgba(2,20,34,.7)}
.menu-list .sep{border-top:1px solid var(--line);margin:.4rem 0}

/* intro strip */
.intro{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--line);border-bottom:1px solid var(--line)}
.intro div{background:var(--navy);padding:1rem 2rem;font-size:1rem}
.intro b{display:block;font-family:var(--font-display);font-size:1.25rem;color:var(--text);font-weight:500;margin-bottom:.15rem}
.intro b i{color:var(--gold);font-style:normal}

/* form controls */
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem 1.4rem;align-items:start;padding:1.4rem 0 .6rem}
.ctl label{display:block;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:.4rem;height:1.3rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ctl select,.ctl input{width:100%;height:3.1rem;font-size:1.1rem;color:var(--text);background:var(--navy-2);border:1px solid var(--gold-dim);border-radius:4px;padding:0 .9rem}
.ctl input[type=date]{color-scheme:dark}
.ctl.nolabel .btn{height:3.1rem;margin-top:1.7rem;width:100%}
.ctl input::placeholder{color:var(--muted)}
.ctl .hint{font-size:.85rem;color:var(--muted);margin-top:.35rem;min-height:2.6em;line-height:1.3}
.btn{background:var(--gold);color:var(--navy);border:0;border-radius:4px;padding:.7rem 1.3rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:.9rem;cursor:pointer}
.btn:hover{background:var(--gold-2)}
.btn.ghost{background:transparent;color:var(--gold);border:1px solid var(--gold-dim)}

/* layout blocks */
main.two{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(420px,1fr);gap:1.8rem;padding-bottom:3rem}
main.one{padding-bottom:3rem}
.card{background:var(--navy-deep);border:1px solid var(--line);border-radius:8px;padding:1.5rem 1.8rem;margin-bottom:1.5rem}
.card.gold{border-color:var(--gold-dim)}
.verdict{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.2rem;border-radius:6px;border:1px solid var(--line);margin:.8rem 0 1.2rem}
.verdict .dot{width:18px;height:18px;border-radius:50%;flex:none}
.verdict b{display:block;font-family:var(--font-heading);letter-spacing:.1em;font-size:.95rem;color:var(--text);margin-bottom:.15rem}
.verdict span{font-size:1.05rem}
.verdict.tight{background:var(--tight-soft);border-color:rgba(192,57,43,.45)}
.verdict.loose{background:var(--loose-soft);border-color:rgba(46,139,87,.45)}
.verdict.normal{background:var(--gold-glow);border-color:var(--gold-dim)}
.big{display:flex;align-items:baseline;gap:.6rem}
.big strong{font-family:var(--font-display);font-size:3.2rem;font-weight:500;color:var(--text);line-height:1}
.big span{color:var(--muted);font-size:1rem;line-height:1.35}
.readout{font-size:1.05rem;margin:.5rem 0 .7rem}
.readout em{color:var(--text);font-style:normal;font-weight:600}
.kv{display:grid;grid-template-columns:1fr auto;gap:.4rem 1rem;font-size:1rem}
.kv span{color:var(--muted)}.kv b{font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;text-align:right}
ul.means{margin:0;padding-left:1.2rem;font-size:1.05rem}
ul.means li{margin-bottom:.55rem}
ul.means li b{color:var(--gold-2);font-weight:600}
table.list{border-collapse:collapse;width:100%;font-size:1rem}
.list th{text-align:left;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:.4rem .5rem;border-bottom:1px solid var(--line)}
.list td{padding:.65rem .6rem;border-bottom:1px solid var(--line);vertical-align:top}
.list td.num{font-variant-numeric:tabular-nums;text-align:right;color:var(--text)}
.list tr.pick{cursor:pointer}.list tr.pick:hover td{background:rgba(255,255,255,.03)}
.pill{display:inline-block;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;padding:.15em .55em;border-radius:3px;font-weight:600}
.pill.tight{background:var(--tight-soft);color:#ff9a8a}.pill.loose{background:var(--loose-soft);color:#8fe0ad}.pill.normal{background:var(--gold-glow);color:var(--gold-2)}
.bar{height:8px;background:var(--navy-2);border-radius:4px;overflow:hidden}
.bar i{display:block;height:100%}
.spark{width:100%;height:170px;margin-top:.6rem}
.spark text{font-family:var(--font-body);font-size:7px;fill:var(--muted)}
.note{font-size:.92rem;color:var(--muted)}
.event{font-size:1rem;padding:.5rem .7rem;border-left:2px solid var(--gold);background:var(--gold-glow);margin:.4rem 0}
.talk{font-family:var(--font-display);font-size:1.3rem;color:var(--text);border-left:2px solid var(--gold);padding:.5rem 1rem;margin:.6rem 0;line-height:1.4}
.rest p{font-size:1.05rem}
.err{color:#ff9a8a;font-size:.9rem}
footer{border-top:1px solid var(--line);padding:1.2rem 0 2.5rem;font-size:.9rem;color:var(--muted)}
@media (max-width:980px){main.two{grid-template-columns:1fr}}

/* heat strips (90 days) */
.strip{display:grid;grid-template-columns:190px 1fr;gap:.8rem;align-items:center;margin:.35rem 0}
.strip-label{font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text-2);text-align:right;line-height:1.2}
.strip-months{display:flex;font-size:.75rem;color:var(--gold);letter-spacing:.06em}
.strip-months span{padding-left:2px;border-left:1px solid var(--line)}
.strip-cells{display:flex;gap:2px}
.strip-cells i{flex:1;height:26px;border-radius:2px;min-width:0}
.strip-cells i.hl{outline:2px solid var(--text);outline-offset:-1px}
.strip-cells i.rng{box-shadow:inset 0 -3px 0 var(--gold-2)}
.strip-legend{font-size:.85rem;color:var(--muted);margin:.4rem 0 0 198px}
.strip-legend b{display:inline-block;width:12px;height:12px;border-radius:2px;vertical-align:middle;margin:0 .35rem 0 .8rem}
/* progressive disclosure */
details.more{border-top:1px solid var(--line);margin-top:.6rem}
details.more summary{cursor:pointer;list-style:none;padding:.9rem 0;font-family:var(--font-heading);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:.6rem}
details.more summary::-webkit-details-marker{display:none}
details.more summary::before{content:'+';display:inline-block;width:1.2rem;height:1.2rem;line-height:1.2rem;text-align:center;border:1px solid var(--gold-dim);border-radius:3px;font-family:var(--font-body);font-size:.9rem}
details.more[open] summary::before{content:'\2013'}
details.more .more-body{padding:0 0 1rem}
/* recommendations */
.recs{background:var(--gold-glow);border:1px solid var(--gold-dim);border-radius:8px;padding:1.2rem 1.5rem;margin-top:1.2rem}
.recs ol{margin:0;padding-left:1.4rem;font-size:1.1rem;color:var(--text)}
.recs li{margin-bottom:.6rem;line-height:1.45}
.recs li b{color:var(--gold-2)}
.answer{font-family:var(--font-display);font-size:1.5rem;color:var(--text);line-height:1.35;margin:.3rem 0 .6rem}
@media (max-width:760px){.strip{grid-template-columns:1fr}.strip-label{text-align:left}.strip-legend{margin-left:0}}

/* ---- breathing room ---- */
.intro div{padding:1.5rem 2.2rem 1.6rem}
.form{padding:2.2rem 0 1.4rem;gap:1.4rem 1.8rem}
main.two{gap:2.5rem;padding-top:.8rem;padding-bottom:4rem}
main.one{padding-top:.8rem;padding-bottom:4rem}
.card{padding:2.2rem 2.4rem;margin-bottom:2.2rem}
.card h2{margin-bottom:.5rem}
h3{margin:2.6rem 0 1rem}
.card > h3:first-child,.card h3[style*="margin-top:0"]{margin-top:0}
.verdict{margin:1.6rem 0 1.8rem;padding:1.3rem 1.4rem}
.answer{margin:1.4rem 0 2.2rem;font-size:1.6rem}
.big{margin:.6rem 0 1rem}
.readout{margin:.8rem 0 1.2rem}
.strip{margin:.9rem 0}
.strip-legend{margin-top:1rem}
.recs{margin-top:2.6rem;padding:1.8rem 2rem}
.recs li{margin-bottom:.9rem}
details.more{margin-top:1.4rem}
details.more summary{padding:1.2rem 0}
details.more .more-body{padding:.4rem 0 1.6rem}
ul.means li{margin-bottom:.8rem}
.list td{padding:.85rem .7rem}
.talk{margin:1rem 0;padding:.7rem 1.2rem}
.event{margin:.9rem 0}
.kv{gap:.6rem 1.2rem}
.twin{gap:2.2rem}
footer{padding:2rem 0 3rem;margin-top:1rem}