:root{
  --navy:#0a1f3d; --navy-2:#102d57; --gold:#c19a4b; --gold-d:#a9823a;
  --ink:#1c2b3a; --muted:#5f6f80; --line:#e3e0d6; --line-2:#e7ebf0;
  --bg:#f7f5ef; --paper:#fffdf9; --white:#fff;
  --ok:#1f7a4d; --warn:#9a6b00; --bad:#b3392f; --radius:6px;
  --shadow:0 2px 10px rgba(10,31,61,.07); --shadow-lg:0 10px 36px rgba(10,31,61,.12);
  --serif:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--bg);line-height:1.6;font-size:16px}
h1,h2,h3{font-family:var(--serif);font-weight:700;color:var(--navy);letter-spacing:.2px}
a{color:var(--gold-d);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1140px;margin:0 auto;padding:0 22px}
.muted{color:var(--muted)}
.small{font-size:13px}
code{font-family:"Source Sans 3",monospace;background:#f0ece1;padding:1px 6px;border-radius:4px;font-size:.92em}

/* Top nav */
.nav{background:var(--navy);color:#fff;border-bottom:3px solid var(--gold)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;min-height:70px;gap:16px;flex-wrap:wrap}
.brand{font-family:var(--serif);font-weight:700;font-size:22px;color:#fff;display:inline-flex;align-items:center;gap:9px}
.brand:hover{text-decoration:none}
.brand-mark{color:var(--gold)}
.nav-links{display:flex;align-items:center;gap:20px}
.nav-links a{color:#e7ecf3;font-size:15px;font-weight:600}
.nav-links a:hover{color:#fff;text-decoration:none}
.langsel select{background:#0e2748;color:#e7ecf3;border:1px solid #2b466e;border-radius:4px;padding:6px 8px;font-family:inherit;font-size:14px;cursor:pointer}

/* Buttons */
.btn{display:inline-block;padding:11px 22px;border-radius:var(--radius);font-weight:700;cursor:pointer;border:1px solid transparent;font-size:15px;font-family:var(--sans);letter-spacing:.2px;transition:.15s}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--gold);color:#26200f;border-color:var(--gold)}
.btn-primary:hover{background:var(--gold-d);color:#fff}
.btn-ghost{background:transparent;border:1px solid #3a5680;color:#e7ecf3}
.btn-ghost:hover{border-color:var(--gold);color:#fff}
.btn-block{display:block;width:100%;text-align:center}
.btn-danger{background:#fbeceb;color:var(--bad);border-color:#f0d4d2}
.btn-danger:hover{background:#f6dedc}
.btn-sm{padding:7px 14px;font-size:13px}
.btn-outline{background:#fff;border:1px solid var(--line);color:var(--ink)}
.btn-outline:hover{border-color:var(--gold);color:var(--navy)}

/* Hero */
.hero{background:linear-gradient(155deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;padding:84px 0 96px;position:relative}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.hero h1{font-size:46px;line-height:1.18;margin:0 0 18px;max-width:660px;color:#fff}
.hero p{font-size:19px;color:#cdd8e6;max-width:580px;margin:0 0 30px}
.hero .btn-primary{font-size:16px;padding:14px 30px}
.hero .hero-link{color:#e8d7ac;font-weight:600;margin-inline-start:18px}

/* Sections */
.section{padding:66px 0}
.section h2{font-size:33px;margin:0 0 10px;text-align:center}
.section .lead{text-align:center;color:var(--muted);margin:0 0 44px;font-size:18px}
.divider{width:64px;height:3px;background:var(--gold);margin:14px auto 0;border:0}
.grid{display:grid;gap:26px}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-2{grid-template-columns:1fr 1fr}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow)}
.card h3{margin:0 0 8px;font-size:21px}
.step-num{width:44px;height:44px;border-radius:50%;background:var(--navy);color:var(--gold);display:flex;align-items:center;justify-content:center;font-weight:700;font-family:var(--serif);font-size:19px;margin-bottom:16px;border:2px solid var(--gold)}
.card-dark{background:var(--navy);color:#fff}
.card-dark h3{color:var(--gold)}
.card-dark p{color:#cdd8e6}

/* Forms */
.auth{max-width:450px;margin:54px auto;background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--gold);border-radius:var(--radius);padding:38px;box-shadow:var(--shadow-lg)}
.auth h2{margin-top:0;font-size:26px}
.form-page{max-width:720px;margin:44px auto;padding:0 22px}
.form-page h1{font-size:34px;margin-bottom:6px}
.field{margin-bottom:18px}
.field label{display:block;font-weight:600;margin-bottom:7px;font-size:14px;color:var(--navy)}
.field input,.field select,.field textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);font-size:15px;font-family:inherit;background:#fff;color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 3px rgba(193,154,75,.15)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.error{background:#fbeceb;color:#8f261d;padding:11px 15px;border-radius:var(--radius);margin-bottom:16px;font-size:14px;border:1px solid #f0d4d2}
.flash{background:#eef6f0;color:#1b5e3a;padding:12px 17px;border-radius:var(--radius);margin:18px auto;max-width:1140px;border:1px solid #cfe6d8}

/* Panels & tables */
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.panel-head{padding:18px 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;background:#fbf9f3}
.panel-head strong{font-family:var(--serif);font-size:18px;color:var(--navy)}
table{width:100%;border-collapse:collapse}
th,td{text-align:start;padding:14px 24px;border-bottom:1px solid var(--line-2);font-size:14px}
th{background:#fbf9f3;color:var(--muted);font-weight:700;text-transform:uppercase;font-size:11.5px;letter-spacing:.06em}
tr:last-child td{border-bottom:0}

/* Badges */
.badge{display:inline-block;padding:4px 12px;border-radius:4px;font-size:12px;font-weight:700;letter-spacing:.02em}
.b-agreement{background:#eef1f5;color:#3d4d63}
.b-payment{background:#fbf0d8;color:#876200}
.b-shipping{background:#e4eefb;color:#1c5193}
.b-inspection{background:#ece8f7;color:#54429c}
.b-closed{background:#e6f3ea;color:#1c6e41}
.b-cancelled{background:#eef0f2;color:#6b7886}
.b-disputed{background:#fbeceb;color:#a8362c}

/* Progress tracker */
.tracker{display:flex;justify-content:space-between;margin:12px 0 28px;position:relative}
.tracker:before{content:"";position:absolute;top:19px;inset-inline:5%;height:3px;background:var(--line);z-index:0}
.tstep{position:relative;z-index:1;text-align:center;flex:1}
.tdot{width:40px;height:40px;border-radius:50%;background:#fff;border:3px solid var(--line);margin:0 auto 9px;display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--muted);font-family:var(--serif)}
.tstep.done .tdot{background:var(--gold);border-color:var(--gold);color:#fff}
.tstep.active .tdot{border-color:var(--gold);color:var(--gold-d)}
.tlabel{font-size:12px;color:var(--muted);max-width:130px;margin:0 auto}

/* Events */
.events{list-style:none;padding:0;margin:0}
.events li{padding:13px 0;border-bottom:1px solid var(--line-2);font-size:14px}
.events li:last-child{border-bottom:0}
.events .t{color:var(--muted);font-size:12px;margin-top:2px}

/* Footer */
.footer{background:var(--navy);color:#cdd8e6;margin-top:64px;padding:44px 0 26px;border-top:3px solid var(--gold)}
.footer-inner{display:flex;justify-content:space-between;flex-wrap:wrap;gap:26px;padding-bottom:22px;border-bottom:1px solid #1b355e}
.footer .brand{color:#fff;font-size:20px}
.footer-links{display:flex;flex-direction:column;gap:9px}
.footer-links a{color:#cdd8e6}

/* CTA band */
.cta-band{background:linear-gradient(155deg,#11305d,#0a1f3d);color:#fff;text-align:center;padding:56px 0;border-top:1px solid var(--gold);border-bottom:1px solid var(--gold)}
.cta-band h2{margin:0 0 10px;color:#fff}
.cta-band p{color:#cdd8e6;margin:0 0 22px}

/* RTL refinements */
html[dir="rtl"] body{font-family:"Segoe UI",Tahoma,var(--sans)}
html[dir="rtl"] .tracker:before{inset-inline:5%}
html[dir="rtl"] .hero p,html[dir="rtl"] .hero h1{margin-inline-end:auto}

@media(max-width:860px){
  .grid-3,.grid-2{grid-template-columns:1fr}
  .row{grid-template-columns:1fr}
  .hero{padding:60px 0}
  .hero h1{font-size:34px}
  .section h2{font-size:27px}
  .nav-inner{min-height:auto;padding:12px 0}
  .nav-links{gap:13px;font-size:14px;flex-wrap:wrap}
  .nav-links a:not(.btn){display:none}
  .tlabel{font-size:10px}
}