/* APNA TRAVELS B2B portal: premium travel theme (loaded after each page's own styles).
   Ivory, midnight navy and champagne gold; Fraunces for headings, Plus Jakarta Sans for everything else. */
:root{
  --bg:#F6F4EF; --surface:#FFFFFF; --sunk:#F1ECE2; --line:#E3DACB; --ink:#101826; --muted:#586174;
  --navy:#0E1B2E; --gold:#A8844A; --gold-soft:#F5EDDE; --red:#0E1B2E; --red-ink:#FFFFFF; --red-soft:#F5EDDE;
  --sea:#8C6A3A; --sea-soft:#F5EDDE; --accent:#A8844A; --brand-red:#C8102E;
  --f-display:"Fraunces",Georgia,"Times New Roman",serif; --f-body:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --r:12px; --shadow:0 1px 2px rgba(14,27,46,.06),0 12px 32px -14px rgba(14,27,46,.18);
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#0C111A; --surface:#141B27; --sunk:#1B2331; --line:#2A3445; --ink:#EEF0F4; --muted:#A3ABB9;
  --navy:#09111D; --gold:#D6B67E; --gold-soft:#2E2617; --red:#D6B67E; --red-ink:#121A26; --red-soft:#2E2617;
  --sea:#D6B67E; --sea-soft:#2E2617; --accent:#D6B67E; --shadow:0 1px 2px rgba(0,0,0,.3),0 10px 30px -12px rgba(0,0,0,.5) } }
:root[data-theme="dark"]{
  --bg:#0C111A; --surface:#141B27; --sunk:#1B2331; --line:#2A3445; --ink:#EEF0F4; --muted:#A3ABB9;
  --navy:#09111D; --gold:#D6B67E; --gold-soft:#2E2617; --red:#D6B67E; --red-ink:#121A26; --red-soft:#2E2617;
  --sea:#D6B67E; --sea-soft:#2E2617; --accent:#D6B67E; --shadow:0 1px 2px rgba(0,0,0,.3),0 10px 30px -12px rgba(0,0,0,.5) }

body{font-family:var(--f-body);font-feature-settings:"ss01","cv11";-webkit-font-smoothing:antialiased;letter-spacing:-.003em;background:var(--bg)}
h1,h2,h3{font-family:var(--f-display);font-weight:600;letter-spacing:-.015em;font-optical-sizing:auto}
h1{font-weight:600}
button,input,select,textarea{font-family:var(--f-body)}

/* buttons */
.btn{border-radius:10px;font-weight:600;transition:background-color .15s,border-color .15s,box-shadow .15s,color .15s}
.btn:hover{border-color:var(--gold)}
.btn.primary{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 6px 16px -8px rgba(14,27,46,.6)}
.btn.primary:hover{background:#1A2C47;border-color:#1A2C47}
.btn.navy{background:var(--navy);border-color:var(--navy)}
.btn.gold{background:var(--gold);border-color:var(--gold);color:#fff}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .btn.primary{background:var(--gold);border-color:var(--gold);color:#121A26} }
:root[data-theme="dark"] .btn.primary{background:var(--gold);border-color:var(--gold);color:#121A26}

/* inputs */
input,select,textarea{border-radius:10px;border-color:var(--line);transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(168,132,74,.18)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
label.f,.f>span{letter-spacing:.01em}

/* cards and sections */
.card,.step,.ticket,.bk{border-radius:16px;border-color:var(--line);box-shadow:var(--shadow)}
.step>header .n{font-family:var(--f-display);font-style:italic;font-weight:600;color:var(--gold);font-size:15px;letter-spacing:0}
.step>header h2{font-size:20px;font-weight:600}
.step h3.subh,.subh{color:var(--gold)}
.ticket .hd{background:var(--navy);color:#fff;background-image:linear-gradient(135deg,rgba(168,132,74,.22),rgba(168,132,74,0) 55%)}
.ticket .hd h3{font-size:21px}
.kv.big{font-family:var(--f-display);font-weight:600;color:var(--navy)}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .kv.big{color:var(--gold)} }
:root[data-theme="dark"] .kv.big{color:var(--gold)}
.tbl,.plist{border-radius:12px}
th{letter-spacing:.07em}
.chip{border-radius:999px}

/* tool top bar */
.top{border-bottom:1px solid var(--line)}
.brand h1{font-size:23px;font-weight:600}
.brand img{border-radius:8px}

/* portal masthead and tabs */
.mast{background:var(--navy);background-image:radial-gradient(1200px 200px at 85% -40%,rgba(168,132,74,.35),transparent 60%)}
.mast h1{font-weight:600;letter-spacing:-.01em}
.mast small{color:#E7D3AA}
.bar{backdrop-filter:saturate(1.2) blur(6px)}
.tabs button.on{background:var(--gold-soft);color:var(--ink);box-shadow:inset 0 -2px 0 var(--gold)}
.auth .hero{background:var(--navy);background-image:radial-gradient(900px 500px at 110% 110%,rgba(168,132,74,.35),transparent 60%),radial-gradient(600px 400px at -10% -10%,rgba(255,255,255,.06),transparent 60%)}
.auth .hero h1{font-weight:600;letter-spacing:-.02em}
.auth .hero h1 i{font-style:italic;color:#E7D3AA}
.dest{border-radius:18px;box-shadow:var(--shadow)}
.dest h3{font-weight:600;letter-spacing:-.01em}
.stat{border-radius:16px}
.stat .v{font-family:var(--f-display);font-weight:600}

/* about us */
.about{display:grid;gap:18px}
.about .lead{font-family:var(--f-display);font-size:22px;line-height:1.35;font-weight:500;letter-spacing:-.01em;max-width:62ch;margin:0}
.about .pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.about .pillar{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}
.about .pillar b{display:block;font-family:var(--f-display);font-size:17px;font-weight:600;margin-bottom:6px}
.about .pillar p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.55}
.about .eyebrow{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.about .band{background:var(--navy);color:#fff;border-radius:18px;padding:22px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;background-image:radial-gradient(700px 240px at 100% 0%,rgba(168,132,74,.35),transparent 60%)}
.about .band b{display:block;font-family:var(--f-display);font-size:18px;font-weight:600;color:#E7D3AA;margin-bottom:4px}
.about .band span{font-size:13px;color:#D5DAE3;line-height:1.5}
.about .contact{display:flex;gap:10px;flex-wrap:wrap}
.about ul{margin:0;padding-left:18px;color:var(--muted);font-size:13.5px;line-height:1.7}

a.btn{text-decoration:none;color:var(--ink)}
a.btn.primary{color:#fff}

/* always the bright look, also when the device is in dark mode */
html[data-theme="light"]{color-scheme:light}
.card,.step,.ticket,.bk{background:var(--surface)}

img[src$="assets/logo.png"]{background:transparent!important;padding:0!important;border-radius:0!important;box-shadow:none!important;object-fit:contain}
.mast img[src$="assets/logo.png"],.top img[src$="assets/logo.png"],header img[src$="assets/logo.png"]{height:54px!important;width:auto!important}
.auth .hero img[src$="assets/logo.png"]{height:96px!important;width:auto!important}
