/*
Theme Name:   Hello Elementor Child — Express Trips N More
Theme URI:    https://expresstripsnmore.com
Description:  Child theme for Express Trips N More. Component CSS for the "Departures Board" design system: boarding-pass cards, departures board, fare tickets, itinerary manifests, stamps of approval from Lagos.
Author:       Toyin
Template:     hello-elementor
Version:      1.0.0
Text Domain:  hello-elementor-child-etm
*/

/* =====================================================
   ETM DESIGN TOKENS
   Mirror these in Elementor Global Colors/Fonts:
   Ink #22282C · Slate #4D5960 · Red #E83338 · Red Deep #C9252A
   Amber #F2B33D · Paper #F4F5F6 · Line #DDE1E3
   Fonts: Archivo (display+body), IBM Plex Mono (utility)
   ===================================================== */
:root{
  --etm-slate:#4D5960;
  --etm-ink:#22282C;
  --etm-ink-2:#2C3338;
  --etm-red:#E83338;
  --etm-red-deep:#C9252A;
  --etm-amber:#F2B33D;
  --etm-paper:#F4F5F6;
  --etm-line:#DDE1E3;
  --etm-mono:'IBM Plex Mono',ui-monospace,monospace;
  --etm-sans:'Archivo',system-ui,sans-serif;
}

/* Display headings: apply .etm-display to Elementor heading widgets
   (Archivo's width axis needs font-stretch, which Elementor UI lacks) */
.etm-display{font-stretch:112%;letter-spacing:-.015em;line-height:1.06}
.etm-display-wide{font-stretch:120%}

/* ---------- eyebrow (add class to a heading widget) ---------- */
.etm-eyebrow{font-family:var(--etm-mono);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--etm-red);font-weight:600;display:flex;align-items:center;gap:12px}
.etm-eyebrow::before{content:"";width:26px;height:2px;background:var(--etm-red);display:inline-block}
.etm-eyebrow.on-dark{color:var(--etm-amber)}
.etm-eyebrow.on-dark::before{background:var(--etm-amber)}

/* ---------- top strip ---------- */
.etm-strip{font-family:var(--etm-mono);font-size:11.5px;letter-spacing:.08em;color:#B9C0C5}
.etm-strip a{color:#fff}
.etm-strip a:hover{color:var(--etm-amber)}
.etm-blink{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--etm-amber);margin-right:8px;animation:etm-pulse 2.4s infinite}
@keyframes etm-pulse{0%,100%{opacity:1}50%{opacity:.25}}

/* ---------- departures board (shortcode: [etm_departures_board]) ---------- */
.etm-board{background:var(--etm-ink);border-radius:14px;padding:26px 24px 20px;box-shadow:0 30px 70px rgba(34,40,44,.35);position:relative;font-size:16px}
.etm-board::before{content:"";position:absolute;inset:0;border-radius:14px;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.015) 3px 4px);pointer-events:none}
.etm-board-head{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid #3A4247;padding-bottom:14px;margin-bottom:6px}
.etm-board-head h3{color:#fff;font-size:15px;letter-spacing:.14em;font-weight:700;text-transform:uppercase;font-stretch:105%;margin:0}
.etm-board-head span{font-family:var(--etm-mono);color:var(--etm-amber);font-size:12px}
.etm-board-cols{display:grid;grid-template-columns:88px 1fr 74px 118px;gap:10px;font-family:var(--etm-mono);font-size:10px;color:#7C868C;letter-spacing:.15em;text-transform:uppercase;padding:10px 4px 6px}
.etm-board-row{display:grid;grid-template-columns:88px 1fr 74px 118px;gap:10px;align-items:center;padding:11px 4px;border-top:1px solid #2E353A;font-family:var(--etm-mono)}
.etm-board-row .route{color:#fff;font-weight:600;font-size:14px}
.etm-board-row .route b{color:var(--etm-amber);font-weight:600}
.etm-board-row .dest{color:#C6CDD1;font-size:13px}
.etm-board-row .flt{color:#8B959B;font-size:12px}
.etm-status{font-size:11px;font-weight:600;letter-spacing:.08em;padding:5px 8px;border-radius:3px;text-align:center;white-space:nowrap}
.etm-status.ok{background:rgba(242,179,61,.14);color:var(--etm-amber)}
.etm-status.hot{background:rgba(232,51,56,.18);color:#FF8A8D}
.etm-board-foot{font-family:var(--etm-mono);font-size:10.5px;color:#6E787E;letter-spacing:.12em;text-transform:uppercase;padding-top:14px;margin-top:6px;border-top:1px solid #3A4247;display:flex;justify-content:space-between}

/* ---------- boarding-pass service card ----------
   Structure in Elementor: container.etm-pass > container.etm-pass-main + container.etm-pass-stub */
.etm-pass{background:#fff;border:1px solid var(--etm-line);border-radius:12px;overflow:hidden;transition:transform .2s,box-shadow .2s}
.etm-pass:hover{transform:translateY(-5px);box-shadow:0 22px 44px rgba(34,40,44,.12)}
.etm-pass-tag{font-family:var(--etm-mono);font-size:10.5px;letter-spacing:.2em;color:var(--etm-slate);text-transform:uppercase}
.etm-pass-tag b{color:var(--etm-red)}
.etm-pass-stub{border-left:2px dashed var(--etm-line);position:relative;background:linear-gradient(180deg,#fff,#FAFBFB)}
.etm-pass-stub::before,.etm-pass-stub::after{content:"";position:absolute;left:-9px;width:16px;height:16px;border-radius:50%;background:var(--etm-paper);border:1px solid var(--etm-line);z-index:1}
.etm-pass-stub::before{top:-9px}
.etm-pass-stub::after{bottom:-9px}
.etm-pass-stub .code{font-family:var(--etm-mono);font-size:11px;letter-spacing:.18em;color:var(--etm-slate);writing-mode:vertical-rl;text-transform:uppercase}
.etm-barcode{width:44px;height:64px;background:repeating-linear-gradient(90deg,var(--etm-ink) 0 2px,transparent 2px 4px,var(--etm-ink) 4px 7px,transparent 7px 8px,var(--etm-ink) 8px 9px,transparent 9px 12px)}
.etm-barcode.wide{width:100%;height:38px;opacity:.8}
.etm-arrow-list ul,ul.etm-arrow-list{list-style:none;margin:0;padding:0;font-size:14px}
.etm-arrow-list li{padding:5px 0 5px 24px;position:relative}
.etm-arrow-list li::before{content:"→";position:absolute;left:0;color:var(--etm-red);font-weight:700}

/* ---------- destination / package card ----------
   Elementor: container.etm-dest-card > container.etm-dest-art + container.etm-dest-body */
.etm-dest-card{background:var(--etm-ink-2);border:1px solid #394248;border-radius:12px;overflow:hidden;transition:transform .2s,border-color .2s}
.etm-dest-card:hover{transform:translateY(-5px);border-color:var(--etm-red)}
.etm-dest-art{position:relative;height:150px;overflow:hidden;background:radial-gradient(420px 200px at 15% 120%,rgba(232,51,56,.35),transparent 65%),linear-gradient(150deg,#2A3237,#1B2125)}
.etm-dest-art .etm-big-code{position:absolute;right:14px;bottom:-24px;font-family:var(--etm-sans);font-stretch:120%;font-weight:900;font-size:104px;line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.22);letter-spacing:-.02em;user-select:none;margin:0}
.etm-dest-art .etm-route-line{position:absolute;left:22px;top:26px;font-family:var(--etm-mono);font-size:12px;color:var(--etm-amber);letter-spacing:.15em}
.etm-dest-art .etm-route-line::after{content:"";display:block;width:64px;height:2px;margin-top:10px;background:repeating-linear-gradient(90deg,var(--etm-red) 0 8px,transparent 8px 14px)}
.etm-fare span{display:block;font-family:var(--etm-mono);font-size:10px;color:#8B959B;letter-spacing:.15em;text-transform:uppercase}
.etm-fare b{font-family:var(--etm-mono);font-size:17px;color:var(--etm-amber);font-weight:600}

/* ---------- stat block (border-left accent) ---------- */
.etm-stat{border-left:2px solid var(--etm-red);padding-left:20px}

/* ---------- chips ---------- */
.etm-chip{font-family:var(--etm-mono);font-size:12.5px;font-weight:500;letter-spacing:.05em;border:1px solid var(--etm-line);background:var(--etm-paper);padding:8px 14px;border-radius:100px;color:var(--etm-ink);display:inline-block}
.etm-chip b{color:var(--etm-red);font-weight:600}
.etm-chip.on-dark{border-color:#3A4247;background:rgba(255,255,255,.04);color:#DDE1E3}
.etm-chip.on-dark b{color:var(--etm-amber)}

/* ---------- honesty note ---------- */
.etm-visa-note{padding:18px 20px;border-left:3px solid var(--etm-amber);background:#FDF7EC;font-size:14px;color:#6B5B32;border-radius:0 8px 8px 0}

/* ---------- numbered steps (Elementor containers, class per item) ---------- */
.etm-steps{counter-reset:etm-step}
.etm-step{display:flex;gap:22px;padding:24px 0;border-bottom:1px solid var(--etm-line)}
.etm-step:last-child{border-bottom:none}
.etm-step-num{counter-increment:etm-step;flex:none;width:54px;height:54px;border:2px solid var(--etm-ink);border-radius:8px;display:flex;align-items:center;justify-content:center;font-family:var(--etm-mono);font-weight:600;font-size:15px}
.etm-step-num::before{content:"0" counter(etm-step)}
.etm-step:first-child .etm-step-num{background:var(--etm-red);border-color:var(--etm-red);color:#fff}

/* ---------- page hero giant code ---------- */
.etm-code-bg{position:absolute;right:-14px;bottom:-64px;font-family:var(--etm-sans);font-weight:900;font-stretch:120%;font-size:230px;line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.07);user-select:none;pointer-events:none;margin:0}
.etm-crumb{font-family:var(--etm-mono);font-size:12px;letter-spacing:.2em;color:var(--etm-amber);text-transform:uppercase}
.etm-crumb a{color:#8B959B}
.etm-crumb a:hover{color:#fff}

/* ---------- country card / contact card ---------- */
.etm-hover-card{transition:transform .2s,box-shadow .2s}
.etm-hover-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(34,40,44,.1)}
.etm-cc{font-family:var(--etm-mono);color:var(--etm-red);font-weight:600;font-size:12px;letter-spacing:.14em}
.etm-meta{font-family:var(--etm-mono);font-size:11.5px;color:var(--etm-slate);line-height:1.9}
.etm-meta b{color:var(--etm-ink);font-weight:600}

/* ---------- itinerary manifest (shortcode: [etm_itinerary]) ---------- */
.etm-itin{border:1px solid var(--etm-line);border-radius:12px;overflow:hidden;background:#fff}
.etm-itin .day{display:grid;grid-template-columns:96px 1fr;gap:20px;padding:22px 24px;border-bottom:1px solid var(--etm-line)}
.etm-itin .day:last-child{border-bottom:none}
.etm-itin .day:nth-child(odd){background:var(--etm-paper)}
.etm-itin .d-tag{font-family:var(--etm-mono);font-size:11px;letter-spacing:.16em;color:var(--etm-red);font-weight:600;text-transform:uppercase;padding-top:3px}
.etm-itin .d-tag small{display:block;color:var(--etm-slate);font-weight:400;letter-spacing:.1em;margin-top:4px;font-size:10px}
.etm-itin h3{font-size:16.5px;font-weight:800;margin:0 0 5px}
.etm-itin p{color:var(--etm-slate);font-size:14.5px;margin:0}

/* ---------- includes / excludes (shortcode: [etm_list]) ---------- */
ul.etm-inc-list{list-style:none;margin:0;padding:0;font-size:14.5px}
ul.etm-inc-list li{padding:6px 0 6px 26px;position:relative;color:var(--etm-ink)}
ul.etm-inc-list li::before{content:"✓";position:absolute;left:0;color:var(--etm-red);font-weight:700}
ul.etm-inc-list.neg li{color:var(--etm-slate)}
ul.etm-inc-list.neg li::before{content:"✕";color:var(--etm-slate)}

/* ---------- good to know (shortcode: [etm_good_to_know]) ---------- */
.etm-gtk{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.etm-gtk>div{border:1px solid var(--etm-line);border-radius:12px;padding:20px 22px;background:#fff}
.etm-gtk .k{font-family:var(--etm-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--etm-red);font-weight:600}
.etm-gtk b{display:block;font-size:16px;font-weight:800;margin-top:6px}
.etm-gtk p{color:var(--etm-slate);font-size:13px;margin:4px 0 0}
@media (max-width:980px){.etm-gtk{grid-template-columns:1fr}}

/* ---------- fare ticket (sticky sidebar) ---------- */
.etm-fare-ticket{background:#fff;border:1px solid var(--etm-line);border-radius:14px;box-shadow:0 24px 60px rgba(34,40,44,.12);overflow:hidden}
.etm-fare-head{background:var(--etm-ink);color:#fff;padding:18px 24px;display:flex;justify-content:space-between;align-items:center}
.etm-fare-head span{font-family:var(--etm-mono);font-size:10px;letter-spacing:.2em;color:#8B959B;text-transform:uppercase}
.etm-fare-head b{font-family:var(--etm-mono);font-size:13px;color:var(--etm-amber);font-weight:600}
.etm-fare-price span{font-family:var(--etm-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--etm-slate);display:block}
.etm-fare-price b{font-size:38px;font-weight:850;font-stretch:110%;color:var(--etm-red);line-height:1.1}
.etm-fare-price small{font-family:var(--etm-mono);font-size:11px;color:var(--etm-slate);display:block;margin-top:4px}
.etm-fare-rows{border-top:2px dashed var(--etm-line);border-bottom:2px dashed var(--etm-line);padding:16px 0}
.etm-fare-rows .fr{display:flex;justify-content:space-between;font-family:var(--etm-mono);font-size:12px;padding:6px 0}
.etm-fare-rows .fr span{color:var(--etm-slate);letter-spacing:.06em;text-transform:uppercase;font-size:10.5px}
.etm-fare-rows .fr b{color:var(--etm-ink);font-weight:600}
.etm-fare-note{font-family:var(--etm-mono);font-size:10.5px;color:var(--etm-slate);text-align:center;letter-spacing:.04em}
.etm-fare-foot{border-top:1px solid var(--etm-line);padding:14px 24px;background:var(--etm-paper)}

/* ---------- FAQ: style Elementor Accordion/Toggle with class .etm-faq ---------- */
.etm-faq .elementor-accordion-item,.etm-faq details{border:1px solid var(--etm-line)!important;border-radius:10px;background:#fff;margin-bottom:12px;overflow:hidden}

/* ---------- Formidable forms: wrap form in a container with class .etm-form ---------- */
.etm-form .frm_forms label,.etm-form label.frm_primary_label{font-family:var(--etm-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--etm-slate);font-weight:600}
.etm-form .frm_forms input[type=text],.etm-form .frm_forms input[type=email],.etm-form .frm_forms input[type=tel],.etm-form .frm_forms input[type=month],.etm-form .frm_forms select,.etm-form .frm_forms textarea{font-family:var(--etm-sans);font-size:15px;padding:13px 14px;border:1.5px solid var(--etm-line);border-radius:8px;background:#fff;color:var(--etm-ink);width:100%}
.etm-form .frm_forms input:focus,.etm-form .frm_forms select:focus,.etm-form .frm_forms textarea:focus{outline:none;border-color:var(--etm-red);box-shadow:0 0 0 3px rgba(232,51,56,.12)}
.etm-form .frm_forms .frm_button_submit{display:inline-flex;align-items:center;gap:10px;background:var(--etm-red);color:#fff;font-weight:700;font-size:15px;padding:13px 26px;border-radius:6px;border:none;cursor:pointer;transition:transform .18s,box-shadow .18s,background .18s;font-family:var(--etm-sans)}
.etm-form .frm_forms .frm_button_submit:hover{background:var(--etm-red-deep);transform:translateY(-2px);box-shadow:0 10px 24px rgba(232,51,56,.28)}
.etm-form-card{background:#fff;border:1px solid var(--etm-line);border-radius:14px;box-shadow:0 24px 60px rgba(34,40,44,.08)}
.etm-form-note{font-size:12.5px;color:var(--etm-slate);font-family:var(--etm-mono);letter-spacing:.02em}
.etm-form-note a{color:var(--etm-red)}

/* ---------- shortcode CTA button (non-Elementor contexts) ---------- */
.etm-btn{display:inline-flex;align-items:center;gap:10px;background:var(--etm-red);color:#fff;font-weight:700;font-size:15px;padding:13px 26px;border-radius:6px;transition:transform .18s,box-shadow .18s,background .18s;border:none;cursor:pointer;text-decoration:none}
.etm-btn:hover{background:var(--etm-red-deep);transform:translateY(-2px);box-shadow:0 10px 24px rgba(232,51,56,.28);color:#fff}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .etm-blink{animation:none}
  .etm-pass,.etm-dest-card,.etm-hover-card,.etm-btn{transition:none}
}

/* ---------- responsive board ---------- */
@media (max-width:680px){
  .etm-board{padding:20px 16px 16px}
  .etm-board-cols{grid-template-columns:78px 1fr 96px}
  .etm-board-cols div:nth-child(3){display:none}
  .etm-board-row{grid-template-columns:78px 1fr 96px}
  .etm-board-row .flt{display:none}
  .etm-itin .day{grid-template-columns:1fr;gap:8px}
}
