/* HEC client portal. Navy and gold from the HEC logo, ivory ground,
   Cormorant Garamond for display and Manrope for everything else. */

@font-face{font-family:"Manrope";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/manrope-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/manrope-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/manrope-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/manrope-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/cormorant-garamond-latin-700-normal.woff2) format("woff2")}

:root{
  --night:#1B1E36; --night-2:#23274A; --navy:#323759; --navy-2:#4A4F7A; --navy-soft:#EEF0F7;
  --gold:#DBBA38; --gold-2:#C9A227; --gold-ink:#7A6210; --gold-soft:#FBF4DA; --gold-line:#EBD98F;
  --ivory:#F7F5EF; --paper:#FFFFFF; --sand:#ECE8DD;
  --line:#E7E3D8; --line-2:#EFEBE1; --line-3:#DCD7C9;
  --ink:#16182C; --ink-2:#4D5068; --ink-3:#6E7189; --ink-4:#9A9CB0;
  --ok:#0B7A55; --ok-soft:#E7F4EE; --watch:#9A5B00; --watch-soft:#FFF4E0; --bad:#A3361F; --bad-soft:#FBEAE5;
  --c-corp:#323759; --c-event:#0E8A7E; --c-expo:#C9A227;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r-sm:10px; --r:14px; --r-lg:20px; --r-xl:24px;
  --shadow-sm:0 1px 2px rgba(27,30,54,.05);
  --shadow:0 10px 30px rgba(27,30,54,.08);
  --shadow-lg:0 24px 60px rgba(27,30,54,.18);
  --ease:cubic-bezier(.2,.7,.2,1);
  --wrap:none;
  --gutter:clamp(16px,3vw,48px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ivory);color:var(--ink);font:15px/1.55 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--gold-ink);text-decoration:none}
a:hover{color:#5C4A0C}
img{max-width:100%}
[hidden]{display:none!important}
.num{font-variant-numeric:tabular-nums}
.serif{font-family:var(--serif)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid rgba(219,186,56,.55);outline-offset:2px;border-radius:6px}

/* ---------------- motion ---------------- */
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideIn{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
@keyframes rise{from{transform:translateY(100%)}to{transform:none}}
@keyframes shimmer{0%{background-position:-480px 0}100%{background-position:480px 0}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes breathe{0%,100%{opacity:.85;transform:scale(1)}50%{opacity:.45;transform:scale(.94)}}
@keyframes draw{to{stroke-dashoffset:0}}
.reveal{animation:fadeUp .6s var(--ease) both;animation-delay:calc(var(--i,0) * 70ms)}
.fade{animation:fadeIn .4s var(--ease) both}
.grow{transition:width .9s var(--ease),height .9s var(--ease)}
.spark path,.spark polyline{stroke-dasharray:600;stroke-dashoffset:600;animation:draw 1.4s var(--ease) .2s forwards}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}
  .spark path,.spark polyline{stroke-dashoffset:0}
}

/* ---------------- boot ---------------- */
.boot{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--night)}
.boot__mark{width:64px;height:64px;animation:breathe 1.6s ease-in-out infinite}

/* ---------------- buttons & fields ---------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:999px;border:1px solid var(--line-3);background:var(--paper);color:var(--night);font-weight:700;font-size:14px;cursor:pointer;white-space:nowrap;transition:transform .15s var(--ease),background .2s,border-color .2s,box-shadow .2s;text-decoration:none}
.btn:hover{border-color:var(--navy-2);color:var(--night)}
.btn:active{transform:scale(.98)}
.btn--dark{background:var(--night);border-color:var(--night);color:#fff}
.btn--dark:hover{background:var(--navy);color:#fff}
.btn--gold{background:var(--gold);border-color:var(--gold);color:var(--night)}
.btn--gold:hover{background:#E4C64F;color:var(--night);box-shadow:0 8px 22px rgba(219,186,56,.35)}
.btn--ghost{background:transparent;border-color:transparent;color:var(--ink-2)}
.btn--ghost:hover{background:rgba(27,30,54,.05);border-color:transparent}
.btn--sm{height:36px;padding:0 14px;font-size:13px}
.btn--block{width:100%;height:54px;border-radius:14px;font-size:15px}
.btn--danger{color:var(--bad)}
.btn:disabled{opacity:.55;cursor:default;transform:none}
.btn .spinner{width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
.field{display:flex;flex-direction:column;gap:8px}
.field>label,.label{font-size:13px;font-weight:600;color:#3A3D55}
.input,.select,.textarea{width:100%;height:52px;border:1px solid var(--line-3);border-radius:12px;padding:0 16px;background:var(--paper);font-weight:500;transition:border-color .2s,box-shadow .2s}
.textarea{height:auto;padding:14px 16px;resize:vertical;min-height:96px;line-height:1.5}
.select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 50%);background-position:calc(100% - 20px) 22px,calc(100% - 15px) 22px;background-size:5px 5px;background-repeat:no-repeat;padding-right:40px}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px rgba(50,55,89,.12)}
.hint{font-size:12.5px;color:var(--ink-3);margin:0}
.alert{border-radius:12px;padding:12px 14px;font-size:14px;line-height:1.5}
.alert--err{background:var(--bad-soft);color:var(--bad)}
.alert--ok{background:var(--ok-soft);color:var(--ok)}
.alert ul{margin:6px 0 0;padding-left:18px}

/* ---------------- sign in ---------------- */
.auth{min-height:100vh;display:flex;flex-wrap:wrap;background:var(--ivory)}
.auth__brand{flex:1 1 560px;min-width:0;background:radial-gradient(900px 520px at 0% 0%,#2A2E55 0%,var(--night) 60%);color:var(--ivory);position:relative;overflow:hidden;padding:56px 64px;display:flex;flex-direction:column;justify-content:space-between;gap:48px}
.auth__ring{position:absolute;right:-190px;bottom:-190px;width:660px;height:660px;opacity:.09;animation:spin 140s linear infinite}
.brandmark{display:flex;align-items:center;gap:14px;position:relative}
.brandmark img{width:46px;height:46px}
.brandmark b{display:block;font:700 24px/1 var(--serif);letter-spacing:2px}
.brandmark span{display:block;font-size:10px;letter-spacing:4px;color:#B9BCD3;margin-top:4px}
.auth__pitch{position:relative;max-width:540px;display:flex;flex-direction:column;gap:22px}
.pill-gold{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;border:1px solid rgba(219,186,56,.45);color:#E8CF6A;border-radius:999px;padding:6px 14px;font-size:12px;font-weight:600;letter-spacing:1.5px}
.auth__pitch h1{margin:0;font:600 58px/1.05 var(--serif);letter-spacing:-.4px}
.auth__pitch h1 em{font-style:normal;color:var(--gold)}
.auth__pitch p{margin:0;font-size:16px;line-height:1.7;color:#C9CBDD}
.auth__facts{position:relative;display:flex;gap:40px;flex-wrap:wrap;font-size:13px;color:#B9BCD3}
.auth__facts b{display:block;font:600 30px/1.1 var(--serif);color:var(--ivory)}
.auth__panel{flex:1 1 440px;min-width:0;display:flex;align-items:center;justify-content:center;padding:48px 28px}
.auth__card{width:100%;max-width:420px;display:flex;flex-direction:column;gap:26px}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;color:var(--gold-ink);text-transform:uppercase}
.auth__card h2{margin:6px 0 8px;font:600 42px/1.05 var(--serif);color:var(--night)}
.auth__card .lede{margin:0;color:#5A5D75;font-size:15px;line-height:1.6}
.otp{display:flex;gap:10px;justify-content:space-between}
.otp input{width:100%;max-width:56px;height:62px;text-align:center;border:1px solid var(--line-3);border-radius:12px;font:700 24px var(--sans);color:var(--night);background:var(--paper);transition:border-color .2s,box-shadow .2s,transform .15s}
.otp input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(219,186,56,.22);transform:translateY(-1px)}
.otp--shake{animation:shake .4s}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.seg{display:inline-flex;gap:4px;background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:5px}
.seg button{border:0;background:transparent;padding:9px 16px;border-radius:999px;font-weight:600;font-size:13px;color:var(--ink-2);cursor:pointer;transition:background .25s var(--ease),color .25s}
.seg button[aria-pressed="true"]{background:var(--night);color:#fff}
.auth__trust{display:flex;align-items:flex-start;gap:10px;font-size:12.5px;color:var(--ink-3);line-height:1.5}
.auth__trust svg{flex:none;margin-top:1px}
.linkbtn{border:0;background:none;padding:0;color:var(--gold-ink);font-weight:600;cursor:pointer;font-size:14px}
.linkbtn:hover{color:#5C4A0C;text-decoration:underline}

/* ---------------- shell ---------------- */
.top{background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.top__in{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);height:76px;display:flex;align-items:center;gap:24px}
.top__logo{height:36px;width:auto;display:block}
.top__sep{width:1px;height:28px;background:var(--line)}
.top__client{font:700 22px/1 var(--serif);color:var(--night);letter-spacing:.4px;white-space:nowrap;max-width:240px;overflow:hidden;text-overflow:ellipsis}
.nav{display:flex;gap:4px;margin-left:16px}
.nav a{position:relative;padding:10px 16px;border-radius:999px;color:var(--ink-2);font-weight:600;font-size:14px;transition:background .25s var(--ease),color .25s}
.nav a:hover{background:rgba(27,30,54,.05);color:var(--night)}
.nav a[aria-current="page"]{background:var(--night);color:#fff}
.nav .count{background:var(--gold);color:var(--night);border-radius:999px;padding:1px 7px;font-size:11px;margin-left:6px;font-weight:700}
.top__right{margin-left:auto;display:flex;align-items:center;gap:12px}
.avatar{width:44px;height:44px;border-radius:50%;border:0;background:var(--navy);color:var(--ivory);font-weight:700;font-size:15px;cursor:pointer;transition:transform .15s,box-shadow .2s}
.avatar:hover{box-shadow:0 0 0 4px rgba(50,55,89,.12)}
.menu{position:absolute;right:32px;top:70px;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-lg);min-width:260px;padding:8px;z-index:40;animation:fadeUp .25s var(--ease)}
.menu__who{padding:10px 12px 12px;border-bottom:1px solid var(--line-2);margin-bottom:6px}
.menu__who b{display:block}
.menu__who span{display:block;color:var(--ink-3);font-size:12.5px;word-break:break-all}
.menu a,.menu button{display:block;width:100%;text-align:left;border:0;background:none;padding:10px 12px;border-radius:10px;cursor:pointer;color:var(--ink);font-weight:500;font-size:14px}
.menu a:hover,.menu button:hover{background:var(--ivory)}
.preview{background:var(--gold-soft);color:#6B5410;text-align:center;font-size:13px;padding:8px 16px;border-bottom:1px solid var(--gold-line)}
.main{max-width:var(--wrap);margin:0 auto;padding:44px var(--gutter) 96px;min-height:70vh}
.view{animation:fadeIn .35s var(--ease) both}
.foot{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter) 40px;color:var(--ink-3);font-size:12.5px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
.tabbar{display:none}

/* ---------------- page heads ---------------- */
.head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:30px}
.head__text{display:flex;flex-direction:column;gap:10px;max-width:780px}
.head h1{margin:0;font:600 52px/1.05 var(--serif);color:var(--night);letter-spacing:-.3px}
.head .lede{margin:0;font-size:18px;line-height:1.6;color:var(--ink-2)}
.head .lede b{color:var(--night)}
.up{color:var(--bad)} .down{color:var(--ok)} .good{color:var(--ok)}
.h2{margin:0;font:600 30px/1.15 var(--serif);color:var(--night)}
.h3{margin:0;font:600 24px/1.2 var(--serif);color:var(--night)}
.section{display:flex;flex-direction:column;gap:16px;margin-bottom:32px}
.section__head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.more{font-size:14px;font-weight:600}

/* ---------------- cards ---------------- */
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}
.card--pad{padding:26px}
.card--dark{background:var(--night);border-color:var(--night);color:var(--ivory);position:relative;overflow:hidden}
.card--dark .ring{position:absolute;right:-60px;top:-60px;width:200px;height:200px;opacity:.12}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start}
.split__main{flex:999 1 620px;min-width:0}
.split__side{flex:1 1 320px;min-width:0;display:flex;flex-direction:column;gap:18px}

/* KPI */
.kpi{padding:24px;display:flex;flex-direction:column;gap:8px;min-width:0;transition:transform .25s var(--ease),box-shadow .25s}
.kpi:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.kpi__label{font-size:13px;font-weight:600;color:var(--ink-3)}
.card--dark .kpi__label{color:#B9BCD3}
.kpi__value{font:600 42px/1 var(--serif);color:var(--night);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card--dark .kpi__value{color:var(--ivory)}
.kpi__note{font-size:13px;color:var(--ink-3)}
.card--dark .kpi__note{color:#E8CF6A}
.spark{display:block;width:100%;height:40px;margin-top:4px}

/* action cards */
.action{padding:22px;display:flex;flex-direction:column;gap:10px;border-radius:18px;border:1px solid var(--line);background:var(--paper);transition:transform .25s var(--ease),box-shadow .25s}
.action:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.action--gold{background:#FFFBEA;border-color:var(--gold-line)}
.action--warn{background:#FFF8F2;border-color:#F1D2B8}
.action__k{font-size:12px;font-weight:700;letter-spacing:1.5px;color:var(--ink-3);text-transform:uppercase}
.action--gold .action__k{color:var(--gold-ink)}
.action--warn .action__k{color:var(--watch)}
.action__t{font-size:17px;font-weight:700;color:var(--night);line-height:1.4}
.action__d{font-size:14px;color:var(--ink-2);line-height:1.5}
.action .btn{align-self:flex-start;margin-top:4px}

/* list rows */
.rows{display:flex;flex-direction:column}
.trow{display:grid;grid-template-columns:76px 44px minmax(0,1fr) auto;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line-2);cursor:pointer;transition:background .2s;border-radius:12px}
.trow:last-child{border-bottom:0}
.trow:hover{background:#FBFAF6}
.trow__date{display:flex;flex-direction:column;padding-left:6px}
.trow__date span{font-size:12px;color:var(--ink-3);font-weight:600;text-transform:uppercase}
.trow__date b{font:600 26px/1 var(--serif)}
.ico{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none}
.ico svg{width:20px;height:20px}
.ico--Hotel{background:var(--gold-soft);color:var(--gold-ink)}
.ico--Flight{background:var(--navy-soft);color:var(--navy)}
.ico--Car,.ico--Bus{background:var(--ok-soft);color:var(--ok)}
.ico--Event{background:#E6F4F2;color:var(--c-event)}
.ico--Other{background:#F1F0EC;color:var(--ink-2)}
.trow__t{display:flex;flex-direction:column;gap:3px;min-width:0}
.trow__t b{font-size:15px;font-weight:700;overflow:hidden;text-overflow:ellipsis}
.trow__t span{font-size:13.5px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis}
.trow__end{display:flex;flex-direction:column;align-items:flex-end;gap:4px;padding-right:6px}
.trow__end b{font-size:15px}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;border-radius:999px;padding:5px 11px;white-space:nowrap}
.chip--ok{background:var(--ok-soft);color:var(--ok)}
.chip--gold{background:var(--gold-soft);color:var(--gold-ink)}
.chip--navy{background:var(--navy-soft);color:var(--navy)}
.chip--bad{background:var(--bad-soft);color:var(--bad)}
.chip--grey{background:#F1F0EC;color:var(--ink-2)}
.chip--watch{background:var(--watch-soft);color:var(--watch)}

/* trips page */
.toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:22px}
.search{flex:1 1 320px;display:flex;align-items:center;gap:10px;height:50px;padding:0 18px;background:var(--paper);border:1px solid var(--line);border-radius:999px;transition:border-color .2s,box-shadow .2s}
.search:focus-within{border-color:var(--navy);box-shadow:0 0 0 4px rgba(50,55,89,.1)}
.search input{border:0;flex:1;background:transparent;outline:none;font-weight:500;min-width:0}
.fchip{height:40px;border-radius:999px;border:1px solid var(--line);background:var(--paper);color:var(--ink-2);padding:0 14px;font-weight:600;font-size:13px;cursor:pointer;transition:all .2s var(--ease)}
.fchip:hover{border-color:var(--navy-2)}
.fchip[aria-pressed="true"]{border-color:var(--navy);background:var(--navy-soft);color:var(--night)}
.fchip i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px}
.select--pill{height:40px;border-radius:999px;width:auto;max-width:260px;font-size:13px;font-weight:600;padding-left:16px}
.daygroup{font-size:12px;font-weight:700;letter-spacing:2px;color:var(--ink-3);padding:16px 4px 8px;text-transform:uppercase}
.daygroup--today{color:var(--gold-ink)}
.tcard{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:16px 20px;display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:16px;align-items:center;cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s,border-color .2s;margin-bottom:10px;text-align:left;width:100%}
.tcard:hover{transform:translateY(-1px);box-shadow:var(--shadow);border-color:var(--line-3)}
.tcard--cancel{opacity:.62}
.tcard--cancel b{text-decoration:line-through}
.loadmore{display:flex;justify-content:center;padding:18px}
.sum{font-size:13.5px;color:var(--ink-3);margin-left:auto}
.sum b{color:var(--night)}

/* drawer */
.scrim{position:fixed;inset:0;background:rgba(20,22,43,.42);backdrop-filter:blur(2px);z-index:50;animation:fadeIn .25s both}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,100%);background:var(--paper);z-index:51;display:flex;flex-direction:column;box-shadow:var(--shadow-lg);animation:slideIn .35s var(--ease) both}
.drawer__hero{background:var(--night);color:var(--ivory);padding:26px 28px;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:8px}
.drawer__hero .ring{position:absolute;right:-50px;bottom:-70px;width:200px;height:200px;opacity:.12}
.drawer__hero h2{margin:0;font:600 30px/1.1 var(--serif);padding-right:40px}
.drawer__hero p{margin:0;color:#C9CBDD;font-size:14px}
.drawer__x{position:absolute;right:16px;top:16px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.1);color:#fff;font-size:22px;cursor:pointer;z-index:2}
.drawer__x:hover{background:rgba(255,255,255,.2)}
.drawer__body{padding:24px 28px;overflow:auto;flex:1;display:flex;flex-direction:column;gap:20px}
.dl{margin:0;display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px 16px;font-size:14px}
.dl dt{color:var(--ink-3)}
.dl dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.money{background:var(--ivory);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:8px;font-size:14px}
.money div{display:flex;justify-content:space-between;gap:12px}
.money span:first-child{color:var(--ink-2)}
.money .tot{border-top:1px solid var(--line-3);padding-top:8px;font-weight:700;font-size:16px}
.money .tot span:first-child{color:var(--ink)}
.acts{display:flex;gap:10px;flex-wrap:wrap}
.acts .btn{flex:1 1 160px}
.textlinks{display:flex;gap:18px;flex-wrap:wrap;font-size:14px}

/* modal */
.modal{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:16px}
.modal__card{position:relative;z-index:61;background:var(--paper);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);width:100%;max-width:460px;padding:28px;animation:fadeUp .3s var(--ease) both;display:flex;flex-direction:column;gap:16px}
.modal__card h2{margin:0;font:600 28px/1.15 var(--serif);color:var(--night)}

/* charts */
.legend{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--ink-2)}
.legend span{display:inline-flex;align-items:center;gap:8px}
.legend i{width:12px;height:12px;border-radius:3px;display:inline-block}
.cols{position:relative;height:260px;display:flex;gap:10px;align-items:stretch;padding:0 0 28px 64px}
.cols__grid{position:absolute;left:64px;right:0;top:0;bottom:28px;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}
.cols__grid div{border-top:1px solid var(--line-2);position:relative}
.cols__grid div span{position:absolute;left:-64px;top:-9px;width:56px;text-align:right;font-size:11.5px;color:var(--ink-3)}
.col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;cursor:pointer;min-width:0}
.col__stack{width:min(56px,72%);display:flex;flex-direction:column-reverse;gap:2px;height:100%;justify-content:flex-start}
.col__seg{width:100%;height:0;transition:height .9s var(--ease);transition-delay:calc(var(--i,0) * 40ms)}
.col__seg:last-child{border-radius:6px 6px 0 0}
.col__lab{position:absolute;bottom:-24px;font-size:11.5px;color:var(--ink-3);white-space:nowrap}
.col:hover .col__seg{filter:brightness(1.12)}
.col--now .col__lab{color:var(--night);font-weight:700}
.tip{position:fixed;z-index:80;pointer-events:none;background:var(--night);color:#fff;border-radius:12px;padding:10px 12px;font-size:12.5px;box-shadow:var(--shadow-lg);min-width:180px;animation:fadeIn .15s}
.tip b{display:block;font-size:14px;margin-bottom:4px}
.tip div{display:flex;justify-content:space-between;gap:16px}
.tip i{width:8px;height:8px;border-radius:2px;display:inline-block;margin-right:6px}
.share{display:flex;height:18px;border-radius:999px;overflow:hidden;gap:2px;background:var(--line-2)}
.share span{height:100%;width:0;transition:width 1s var(--ease)}
.legrid{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px 20px;font-size:14px;align-items:center}
.legrid > span:not(.note){display:flex;align-items:center;gap:10px}
.legrid i{width:10px;height:10px;border-radius:3px;display:inline-block}
.hbars{display:flex;flex-direction:column;gap:12px}
.hbar{display:grid;grid-template-columns:110px minmax(0,1fr) 92px;gap:12px;align-items:center;font-size:13.5px}
.hbar__track{height:12px;background:#F3EEE0;border-radius:6px;overflow:hidden}
.hbar__fill{display:block;height:100%;width:0;border-radius:6px;transition:width 1s var(--ease)}
.hbar b{text-align:right}
.mini{height:150px;display:flex;align-items:flex-end;gap:8px}
.mini div{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}
.mini div span:first-child{width:100%;height:0;background:#CDD0E3;border-radius:6px 6px 0 0;transition:height .9s var(--ease)}
.mini div.now span:first-child{background:var(--navy)}
.mini div span:last-child{font-size:11px;color:var(--ink-3)}
.mini div.now span:last-child{color:var(--night);font-weight:700}

/* tables */
.table{width:100%;border-collapse:collapse;font-size:14px;table-layout:fixed}
.table th{font-size:11.5px;font-weight:700;letter-spacing:1px;color:var(--ink-3);text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);text-transform:uppercase}
.table td{padding:13px 8px;border-bottom:1px solid var(--line-2);vertical-align:top;overflow-wrap:anywhere}
.table tr:last-child td{border-bottom:0}
.table .r{text-align:right}
.table tbody tr{transition:background .2s}
.table tbody tr:hover{background:#FBFAF6}
.tablewrap{overflow-x:auto}

/* insights */
.finding{padding:22px;display:flex;flex-direction:column;gap:10px;border-radius:18px;background:var(--paper);border:1px solid var(--line)}
.finding__k{font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase}
.finding--good .finding__k{color:var(--ok)}
.finding--watch .finding__k{color:var(--watch)}
.finding--info .finding__k{color:var(--gold-ink)}
.finding__t{font-size:17px;font-weight:700;line-height:1.45;color:var(--night)}
.finding__d{font-size:14px;color:var(--ink-2);line-height:1.5}
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.note{font-size:12.5px;color:var(--ink-3);margin:0}
.note--box{background:var(--paper);border:1px dashed var(--line-3);border-radius:12px;padding:10px 14px}

/* requests */
.svc{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.svc button{height:100px;border-radius:16px;border:1px solid var(--line);background:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:14px;color:var(--ink-2);cursor:pointer;transition:all .2s var(--ease)}
.svc button svg{width:26px;height:26px}
.svc button:hover{border-color:var(--navy-2);transform:translateY(-2px)}
.svc button[aria-pressed="true"]{border:2px solid var(--navy);color:var(--night);font-weight:700;background:#FCFCFE}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.form .full{grid-column:1/-1}
.tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-height:52px;border:1px solid var(--line-3);border-radius:12px;padding:6px 10px;background:var(--paper);transition:border-color .2s,box-shadow .2s}
.tags:focus-within{border-color:var(--navy);box-shadow:0 0 0 4px rgba(50,55,89,.12)}
.tags input{border:0;flex:1;min-width:180px;outline:none;font-weight:500;height:38px;background:transparent}
.tag{display:inline-flex;align-items:center;gap:6px;background:var(--navy-soft);color:var(--night);border-radius:999px;padding:6px 8px 6px 12px;font-size:13.5px;font-weight:600;animation:fadeIn .2s}
.tag button{border:0;background:rgba(27,30,54,.08);width:20px;height:20px;border-radius:50%;cursor:pointer;line-height:1;font-size:13px}
.steps{display:grid;grid-template-columns:30px minmax(0,1fr);gap:6px 14px;font-size:14px}
.steps .n{width:30px;height:30px;border-radius:50%;background:var(--navy-soft);color:var(--night);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px}
.steps .n--on{background:var(--night);color:#fff}
.steps div{display:flex;flex-direction:column;gap:3px;padding-bottom:12px}
.steps div span{color:var(--ink-3)}
.again{display:block;color:var(--ivory);background:rgba(255,255,255,.07);border-radius:14px;padding:14px 16px;margin-top:10px;transition:background .2s;text-align:left;border:0;width:100%;cursor:pointer}
.again:hover{background:rgba(255,255,255,.13);color:#fff}
.again b{display:block;font-size:14.5px}
.again span{font-size:13px;color:#B9BCD3}
.req{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;padding:18px 20px;border-bottom:1px solid var(--line-2)}
.req:last-child{border-bottom:0}
.req b{font-size:15px}
.req small{color:var(--ink-3);font-size:13px}
.done{text-align:center;padding:48px 24px;display:flex;flex-direction:column;align-items:center;gap:14px}
.done__tick{width:72px;height:72px;border-radius:50%;background:var(--ok-soft);color:var(--ok);display:flex;align-items:center;justify-content:center;animation:fadeUp .5s var(--ease)}

/* skeleton & empty */
.sk{background:linear-gradient(90deg,#EFECE4 0,#F7F5EF 40%,#EFECE4 80%);background-size:960px 100%;animation:shimmer 1.4s linear infinite;border-radius:12px}
.empty{text-align:center;padding:56px 24px;color:var(--ink-3);display:flex;flex-direction:column;align-items:center;gap:10px}
.empty b{color:var(--night);font:600 26px var(--serif)}

.toasts{position:fixed;right:24px;bottom:24px;z-index:90;display:flex;flex-direction:column;gap:8px;align-items:flex-end;max-width:min(420px,calc(100vw - 32px));pointer-events:none}
.toasts .toast{pointer-events:auto}
body.has-fab .toasts{bottom:100px}
.toast{background:var(--night);color:#fff;border-radius:12px;padding:12px 18px;font-size:14px;box-shadow:var(--shadow-lg);animation:fadeUp .3s var(--ease)}
.toast--err{background:var(--bad)}

/* ---------------- responsive ---------------- */
@media (max-width:1100px){
  .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .svc{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:860px){
  body{font-size:14.5px}
  .auth__brand{padding:28px 22px;flex-basis:100%}
  .auth__pitch h1{font-size:34px}
  .auth__facts,.auth__pitch p{display:none}
  .auth__ring{width:360px;height:360px;right:-120px;bottom:-140px}
  .top__in{padding:0 16px;height:62px;gap:12px}
  .top__logo{height:28px}
  .top__sep,.nav,.top__right .btn--gold{display:none}
  .top__client{font-size:19px}
  .menu{right:12px;top:58px}
  .main{padding:26px 16px 120px}
  .head h1{font-size:36px}
  .head .lede{font-size:16px}
  .g2,.g3,.g4{grid-template-columns:minmax(0,1fr)}
  .g4.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi{padding:16px}
  .kpi__value{font-size:28px}
  .form{grid-template-columns:minmax(0,1fr)}
  .svc{grid-template-columns:repeat(3,minmax(0,1fr))}
  .svc button{height:84px;font-size:13px}
  .trow{grid-template-columns:52px 40px minmax(0,1fr)}
  .trow__end{grid-column:3;align-items:flex-start;flex-direction:row;gap:10px}
  .tcard{grid-template-columns:40px minmax(0,1fr);padding:14px 16px}
  .tcard .trow__end{grid-column:2;flex-direction:row;align-items:center;gap:10px}
  .dl{grid-template-columns:120px minmax(0,1fr)}
  .hbar{grid-template-columns:84px minmax(0,1fr) 78px}
  .cols{padding-left:44px;gap:4px;height:220px}
  .cols__grid{left:44px}
  .cols__grid div span{left:-46px;width:40px;font-size:10px}
  .col__lab{font-size:10px}
  .tabbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;left:0;right:0;bottom:0;height:70px;padding-bottom:env(safe-area-inset-bottom);background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-top:1px solid var(--line);z-index:30}
  .tabbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;font-weight:600;color:var(--ink-3)}
  .tabbar a svg{width:21px;height:21px}
  .tabbar a[aria-current="page"]{color:var(--night)}
  .tabbar a.tabbar__req{color:var(--gold-ink)}
  .foot{padding-bottom:96px}
  .table--cards thead{display:none}
  .table--cards,.table--cards tbody,.table--cards tr,.table--cards td{display:block;width:100%}
  .table--cards tr{padding:10px 0;border-bottom:1px solid var(--line-2)}
  .table--cards td{border:0;padding:3px 0}
  .table--cards td.r{text-align:left}
}

@media print{
  .top,.tabbar,.foot,.toolbar,.btn,.filters,#toasts{display:none!important}
  body{background:#fff}
  .main{padding:0}
  .card{box-shadow:none;break-inside:avoid}
  .reveal,.view{animation:none!important}
}
/* narrow screens: segmented controls wrap instead of pushing the page sideways */
.seg{max-width:100%}
@media (max-width:560px){.seg{flex-wrap:wrap;border-radius:18px}.seg button{padding:8px 12px}}
@media (max-width:860px){
  .table--cards td[data-l]{display:inline-flex;flex-direction:column;width:auto;min-width:calc(25% - 9px);margin-right:8px;vertical-align:top}
  .table--cards td[data-l]::before{content:attr(data-l);font-size:11px;color:var(--ink-3);font-weight:500;letter-spacing:.02em}
  .table--cards td.note[data-l]{display:block;width:100%}
  .table--cards td.note[data-l]::before{content:none}
}

/* ---- tooltips everywhere ---- */
.tip p{margin:6px 0 0;color:#B9BCD3;font-size:11.5px;line-height:1.45;max-width:260px}
[data-tip]{cursor:default}
button[data-tip],a[data-tip]{cursor:pointer}
.spark--live{pointer-events:auto}
.spark rect:hover{fill:rgba(255,255,255,.06)}
.legrid > [data-tip]:hover,.hbar[data-tip]:hover,.table tr[data-tip]:hover td{background:rgba(27,30,54,.03)}

/* ---- contact button and panel ---- */
.fab{position:fixed;right:24px;bottom:24px;z-index:60;width:60px;height:60px;border-radius:50%;border:0;background:var(--night);color:#fff;
  box-shadow:0 14px 34px rgba(27,30,54,.32);cursor:pointer;display:flex;align-items:center;justify-content:center;font:700 16px var(--sans);
  transition:transform .2s var(--ease),box-shadow .2s;animation:fadeUp .5s var(--ease) .4s both}
.fab:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(27,30,54,.38)}
.fab__open{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--gold);color:var(--night)}
.fab__close{display:none;font-size:30px;line-height:1;font-weight:400}
.fab--on .fab__open{display:none}.fab--on .fab__close{display:block}
.fabpanel{position:fixed;right:24px;bottom:96px;z-index:61;width:340px;max-width:calc(100vw - 32px);max-height:calc(100vh - 140px);overflow:auto;
  background:var(--paper);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-lg);padding:18px;display:flex;flex-direction:column;gap:12px;
  animation:fabIn .22s var(--ease);transform-origin:bottom right}
.fabpanel[hidden]{display:none}
@keyframes fabIn{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
.fabpanel__head{display:flex;gap:12px;align-items:center}
.fabpanel__av{flex:none;width:46px;height:46px;border-radius:50%;background:var(--gold);color:var(--night);display:flex;align-items:center;justify-content:center;font-weight:700}
.fabpanel__head b{display:block;font-size:16px;color:var(--night);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fabpanel__k{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);font-weight:700}
.fabpanel__s{display:block;font-size:12.5px;color:var(--ink-3)}
.fabpanel__x{margin-left:auto;align-self:flex-start;border:0;background:transparent;font-size:24px;line-height:1;color:var(--ink-3);cursor:pointer;padding:2px 4px}
.fabpanel__ctx{font-size:12.5px;color:var(--ink-2);background:var(--gold-soft);border:1px solid var(--gold-line);border-radius:10px;padding:8px 10px}
.fabpanel__list{display:flex;flex-direction:column;gap:6px}
.fabrow{display:flex;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:14px;color:var(--night);text-decoration:none;transition:border-color .2s,background .2s}
.fabrow:hover{border-color:var(--navy-2);background:var(--navy-soft)}
.fabrow svg{flex:none;width:20px;height:20px;color:var(--navy)}
.fabrow--wa svg{color:#1E9E5A}
.fabrow b{display:block;font-size:14px}
.fabrow span span{display:block;font-size:12.5px;color:var(--ink-3);overflow-wrap:anywhere}
.fabpanel__note{margin:0;font-size:12px;color:var(--ink-3);line-height:1.5}
.fabpanel__req{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--gold-ink);text-decoration:none}
.fabpanel__req svg{width:16px;height:16px}

/* ---- company picker ---- */
.msel{position:relative;display:inline-block}
.msel__btn{text-align:left;cursor:pointer;max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msel__pop{position:absolute;z-index:40;top:calc(100% + 8px);left:0;width:340px;max-width:calc(100vw - 32px);background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-lg);padding:8px;animation:fadeIn .15s}
.msel__list{max-height:300px;overflow:auto;display:flex;flex-direction:column}
.msel__row{display:flex;gap:10px;align-items:flex-start;padding:9px 10px;border-radius:10px;cursor:pointer;font-size:13.5px}
.msel__row:hover{background:var(--navy-soft)}
.msel__row input{margin-top:3px;accent-color:var(--night)}
.msel__row small{display:block;color:var(--ink-3);font-size:11.5px}
.msel__foot{display:flex;justify-content:space-between;align-items:center;padding:8px 6px 4px;border-top:1px solid var(--line-2);margin-top:6px}

/* ---- multi-service request ---- */
.svc button{position:relative}
.svc__tick{position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--line-3);display:flex;align-items:center;justify-content:center;color:transparent;transition:all .2s var(--ease)}
.svc__tick svg{width:12px!important;height:12px!important}
.svc button[aria-pressed="true"] .svc__tick{background:var(--night);border-color:var(--night);color:#fff}
.rqblock{border:1px solid var(--line);border-radius:16px;padding:18px;margin-top:20px;background:#FDFCF9}
.rqblock--new{animation:fadeUp .4s var(--ease)}
.rqblock__head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.rqblock__head svg{width:22px;height:22px;color:var(--navy)}
.rqblock__head b{font-size:15px;color:var(--night)}
.rqblock__head .linkbtn{margin-left:auto;font-size:13px}

@media (max-width:860px){
  .fab{right:16px;bottom:86px;width:54px;height:54px}
  .fab__open{width:40px;height:40px}
  .fabpanel{right:16px;left:16px;width:auto;bottom:150px;max-height:calc(100vh - 200px)}
  .toasts{right:16px;bottom:86px}
  body.has-fab .toasts{bottom:152px}
  .msel__btn{max-width:100%}
}
@media print{.fab,.fabpanel{display:none!important}}
body.has-fab .foot{padding-right:calc(var(--gutter) + 84px)}
@media (max-width:860px){body.has-fab .main{padding-bottom:170px}body.has-fab .foot{padding-right:16px;padding-bottom:160px}}
/* the company picker opens over the list below it */
.toolbar,.filters{position:relative;z-index:6}
.toolbar:focus-within,.filters:focus-within{z-index:7}
/* contact button: an icon, no status dot */
.fab__open{width:auto;height:auto;background:transparent;color:#fff}
.fab__open svg{width:28px;height:28px}
.fab{background:linear-gradient(140deg,var(--night) 0%,#323759 100%);border:2px solid var(--gold)}
.fab:hover{box-shadow:0 18px 40px rgba(27,30,54,.38),0 0 0 6px rgba(219,186,56,.18)}
/* monthly board documents */
.boards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.board{display:grid;grid-template-columns:28px minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}
.board svg{width:24px;height:24px;color:var(--navy)}
.board b{display:block;font-size:14px}
.board .btn--sm svg{width:15px;height:15px}
.toggle{display:flex;gap:12px;align-items:flex-start;cursor:pointer}
.toggle input{margin-top:4px;width:18px;height:18px;accent-color:var(--night)}
.toggle b{display:block;font-size:14px;margin-bottom:2px}
/* One request form: shared trip fields, then a light section per service */
.rqpart{border-top:1px solid var(--line);margin-top:22px;padding-top:18px}
.rqpart--new{animation:fadeUp .4s var(--ease)}
.rqpart__head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.rqpart__head svg{width:22px;height:22px;color:var(--navy)}
.rqpart__head b{font-size:15px;color:var(--night)}
.rqpart__when{font-size:12.5px;color:var(--ink-3);background:var(--navy-soft);border-radius:999px;padding:3px 10px}
.rqpart__head .linkbtn{margin-left:auto;font-size:13px}
.rqcheck{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ink-2);cursor:pointer}
.rqcheck input{width:17px;height:17px;accent-color:var(--navy)}
.rqown{margin-bottom:4px}