/* ── SERVICE PAGES — PMS, Payments, Extended Modules ── */

@keyframes sp-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.3)}}
@keyframes sp-fade-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* ═══════════════════════════════════════
   SHARED: BREADCRUMB
   ═══════════════════════════════════════ */
.breadcrumb-bar{background:rgba(0,0,0,.55);backdrop-filter:blur(8px);padding:12px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.5)}
.breadcrumb a{color:rgba(255,255,255,.55);transition:color .2s}.breadcrumb a:hover{color:var(--gold2)}
.breadcrumb-sep,.bc-sep{color:rgba(255,255,255,.25)}
.breadcrumb-current{color:rgba(255,255,255,.8);font-weight:500}

/* ═══════════════════════════════════════
   PMS PAGE
   ═══════════════════════════════════════ */
.hero-pms{
  padding:80px 0 0;
  background:linear-gradient(160deg,#0e1f3d 0%,#0a1628 55%,#0d2240 100%);
  position:relative;overflow:hidden;
}
.hero-pms::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 55% at 65% 35%,rgba(47,87,64,.18) 0%,transparent 60%),
    radial-gradient(ellipse 50% 40% at 20% 75%,rgba(201,147,58,.1) 0%,transparent 50%);
  pointer-events:none;
}
.hero-pms-layout{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:flex-end}
.hero-pms-text{padding-bottom:72px}
.hero-pms h1{font-family:var(--font-display);font-size:clamp(34px,4vw,56px);font-weight:300;line-height:1.1;color:var(--white);margin-bottom:20px;letter-spacing:-.02em}
.hero-pms h1 em{font-style:italic;color:var(--gold2)}
.hero-pms-sub{font-size:16px;line-height:1.75;color:rgba(255,255,255,.62);max-width:480px;margin-bottom:36px}

/* PMS Dashboard Mockup */
.hero-pms-visual{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:flex-end}
.pms-screen{
  width:560px;background:#060e1c;
  border-radius:14px 14px 0 0;overflow:hidden;
  box-shadow:0 -16px 80px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.06);
}
.pms-topbar{background:#040a14;padding:11px 16px;display:flex;align-items:center;gap:6px;border-bottom:1px solid rgba(255,255,255,.06)}
.pms-tb-dot{width:9px;height:9px;border-radius:50%}
.pms-tb-dot.r{background:#ff5f57}.pms-tb-dot.y{background:#ffbd2e}.pms-tb-dot.g{background:#28c840}
.pms-tb-title{font-size:10px;color:rgba(255,255,255,.22);margin-left:8px;font-family:var(--font-mono);letter-spacing:.04em}
.pms-header{background:#070f1f;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06)}
.pms-hdr-title{font-size:12px;font-weight:700;color:rgba(255,255,255,.8);letter-spacing:.04em}
.pms-live-badge{display:flex;align-items:center;gap:6px;background:rgba(47,87,64,.15);border:1px solid rgba(47,87,64,.3);border-radius:100px;padding:4px 12px;font-size:10px;font-weight:700;color:#79ba8d}
.pms-live-dot{width:6px;height:6px;border-radius:50%;background:#79ba8d;animation:sp-pulse 1.5s infinite;display:inline-block}
/* KPI Row */
.pms-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.06)}
.pms-kpi{background:#08111f;padding:12px 14px;text-align:center}
.pms-kpi-val{font-size:18px;font-weight:700;color:var(--white);font-family:var(--font-mono)}
.pms-kpi-lbl{font-size:9px;text-transform:uppercase;letter-spacing:.07em;color:rgba(255,255,255,.35);margin-top:2px}
.pms-kpi-chg{font-size:9px;color:#5cab74;margin-top:1px}
/* Reservation Table */
.pms-res-table{padding:14px 18px}
.pms-res-hdr{display:grid;grid-template-columns:1.4fr 1fr 1fr 0.8fr 0.7fr;gap:8px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.06)}
.pms-res-hdr span{font-size:9px;font-weight:700;color:rgba(255,255,255,.28);text-transform:uppercase;letter-spacing:.06em}
.pms-res-row{display:grid;grid-template-columns:1.4fr 1fr 1fr 0.8fr 0.7fr;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.04)}
.pms-guest{font-size:11px;font-weight:600;color:rgba(255,255,255,.85)}
.pms-room{font-size:11px;color:rgba(255,255,255,.5)}
.pms-dates{font-size:10px;color:rgba(255,255,255,.45);font-family:var(--font-mono)}
.pms-amount{font-size:11px;font-weight:700;color:#79ba8d}
.pms-badge{display:inline-block;padding:3px 8px;border-radius:100px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.pms-badge.in{background:rgba(92,171,116,.15);color:#5cab74}
.pms-badge.out{background:rgba(248,113,113,.15);color:#f87171}
.pms-badge.conf{background:rgba(96,165,250,.15);color:#60a5fa}
.pms-badge.hk{background:rgba(201,147,58,.15);color:var(--gold2)}
/* Metrics footer */
.pms-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.06);border-top:1px solid rgba(255,255,255,.06)}
.pms-metric{background:#08111f;padding:12px 16px}
.pms-metric-val{font-size:15px;font-weight:700;color:var(--white);font-family:var(--font-mono)}
.pms-metric-lbl{font-size:9px;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.3);margin-top:2px}
.pms-metric-chg{font-size:9px;color:#5cab74;margin-top:1px}

/* PMS Features Grid */
.pms-features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.pms-feat-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:32px;transition:transform .2s,box-shadow .2s}
.pms-feat-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.pms-feat-card.featured{background:linear-gradient(135deg,#0e1f3d,#0d2a4a);color:var(--white);border-color:rgba(47,87,64,.3)}
.pms-feat-card .feat-icon{font-size:28px;margin-bottom:16px}
.pms-feat-card h3{font-family:var(--font-display);font-size:22px;font-weight:600;margin-bottom:12px;line-height:1.25}
.pms-feat-card.featured h3{color:var(--white)}
.pms-feat-card p{font-size:15px;color:var(--mid);line-height:1.65}
.pms-feat-card.featured p{color:rgba(255,255,255,.6)}
.pms-feat-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.pms-fp{background:var(--surface);color:var(--mid);border-radius:100px;padding:4px 10px;font-size:11px;font-weight:600;letter-spacing:.03em}
.pms-feat-card.featured .pms-fp{background:rgba(255,255,255,.1);color:rgba(255,255,255,.65)}

/* PMS Calendar Section */
.pms-calendar-section{background:var(--surface);padding:80px 0}
.cal-mockup{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md)}
.cal-top{background:#0e1f3d;padding:14px 20px;display:flex;align-items:center;justify-content:space-between}
.cal-top-title{font-size:13px;font-weight:700;color:var(--white);letter-spacing:.04em}
.cal-top-nav{display:flex;align-items:center;gap:8px}
.cal-nav-btn{background:rgba(255,255,255,.1);border:none;color:var(--white);border-radius:6px;width:24px;height:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px}
.cal-month-label{font-size:12px;font-weight:600;color:rgba(255,255,255,.8)}
.cal-legend{display:flex;gap:16px;align-items:center}
.cal-legend-item{display:flex;align-items:center;gap:5px;font-size:11px;color:rgba(255,255,255,.55)}
.cal-legend-dot{width:8px;height:8px;border-radius:2px}
.cal-grid-wrap{overflow-x:auto;padding:16px 20px}
.cal-grid{min-width:520px}
.cal-room-rows{}
.cal-row{display:flex;gap:0;border-bottom:1px solid var(--border)}
.cal-row:last-child{border-bottom:none}
.cal-room-label{width:110px;min-width:110px;padding:10px 12px;font-size:12px;font-weight:600;color:var(--slate);border-right:1px solid var(--border);background:var(--surface)}
.cal-room-name{font-size:11px;font-weight:700;color:var(--slate)}
.cal-room-type{font-size:10px;color:var(--muted);font-weight:400}
.cal-days{display:flex;flex:1;position:relative;height:38px;overflow:visible}
.cal-day-cell{flex:1;min-width:28px;border-right:1px solid rgba(0,0,0,.04);height:38px;position:relative}
.cal-day-header{display:flex;height:24px;border-bottom:1px solid var(--border);background:#f9fafb}
.cal-day-hdr-cell{flex:1;min-width:28px;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;border-right:1px solid rgba(0,0,0,.04)}
.cal-booking-bar{position:absolute;top:6px;height:26px;border-radius:4px;display:flex;align-items:center;padding:0 8px;font-size:10px;font-weight:600;white-space:nowrap;overflow:hidden;cursor:pointer;transition:opacity .2s}
.cal-booking-bar:hover{opacity:.85}
.cal-bar-blue{background:linear-gradient(90deg,#3b82f6,#2563eb);color:#fff}
.cal-bar-teal{background:linear-gradient(90deg,#407b52,#6fbf8b);color:#fff}
.cal-bar-gold{background:linear-gradient(90deg,#c9933a,#e8b86d);color:#fff}
.cal-bar-purple{background:linear-gradient(90deg,#7c3aed,#a78bfa);color:#fff}
.cal-bar-red{background:linear-gradient(90deg,#e84545,#f87171);color:#fff}

/* ═══════════════════════════════════════
   HOUSEKEEPING PAGE
   ═══════════════════════════════════════ */
.hero-hk{
  padding:80px 0 0;
  background:linear-gradient(155deg,#0d1f14 0%,#081a10 55%,#0d1f14 100%);
  position:relative;overflow:hidden;
}
.hero-hk::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 55% at 62% 38%,rgba(64,123,82,.2) 0%,transparent 60%),
    radial-gradient(ellipse 45% 38% at 18% 72%,rgba(201,147,58,.1) 0%,transparent 50%);
  pointer-events:none;
}
.hero-hk-layout{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:flex-end}
.hero-hk-text{padding-bottom:72px}
.hero-hk h1{font-family:var(--font-display);font-size:clamp(34px,4vw,56px);font-weight:300;line-height:1.1;color:var(--white);margin-bottom:20px;letter-spacing:-.02em}
.hero-hk h1 em{font-style:italic;color:var(--gold2)}
.hero-hk-sub{font-size:16px;line-height:1.75;color:rgba(255,255,255,.62);max-width:480px;margin-bottom:36px}

/* Housekeeping Screen Mockup */
.hero-hk-visual{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:flex-end}
.hk-screen{
  width:520px;background:#060f09;
  border-radius:14px 14px 0 0;overflow:hidden;
  box-shadow:0 -16px 80px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.07);
}
.hk-topbar{background:#040a06;padding:11px 16px;display:flex;align-items:center;gap:6px;border-bottom:1px solid rgba(255,255,255,.06)}
.hk-tb-dot{width:9px;height:9px;border-radius:50%}
.hk-tb-dot.r{background:#ff5f57}.hk-tb-dot.y{background:#ffbd2e}.hk-tb-dot.g{background:#28c840}
.hk-tb-title{font-size:10px;color:rgba(255,255,255,.22);margin-left:8px;font-family:var(--font-mono);letter-spacing:.04em}
.hk-header{background:#070d09;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06)}
.hk-hdr-title{font-size:12px;font-weight:700;color:rgba(255,255,255,.8);letter-spacing:.04em}
.hk-live-pill{display:flex;align-items:center;gap:5px;background:rgba(64,123,82,.15);border:1px solid rgba(64,123,82,.3);border-radius:100px;padding:4px 12px;font-size:10px;font-weight:700;color:#5cab74}
.hk-live-dot{width:6px;height:6px;border-radius:50%;background:#5cab74;animation:sp-pulse 1.5s infinite;display:inline-block}
.hk-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.06)}
.hk-kpi{background:#070d09;padding:12px 10px;text-align:center}
.hk-kpi-val{font-size:18px;font-weight:700;color:#5cab74;font-family:var(--font-mono)}
.hk-kpi-lbl{font-size:9px;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.3);margin-top:2px}
.hk-room-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.06);padding:0}
.hk-room{padding:11px 8px;text-align:center;cursor:default}
.hk-room.clean{background:#062010}
.hk-room.progress{background:#1a1205}
.hk-room.dirty{background:#1a0606}
.hk-room.inspect{background:#120820}
.hk-room-num{font-size:13px;font-weight:700;color:rgba(255,255,255,.85)}
.hk-room-status{font-size:9px;margin-top:3px;font-weight:600}
.hk-room.clean .hk-room-status{color:#5cab74}
.hk-room.progress .hk-room-status{color:#fbbf24}
.hk-room.dirty .hk-room-status{color:#f87171}
.hk-room.inspect .hk-room-status{color:#a78bfa}
.hk-room-staff{font-size:8px;color:rgba(255,255,255,.3);margin-top:2px}
.hk-tasks-strip{padding:10px 14px;background:rgba(0,0,0,.3);display:flex;flex-direction:column;gap:6px;border-top:1px solid rgba(255,255,255,.06)}
.hk-task{font-size:10px;color:rgba(255,255,255,.6);padding:6px 10px;border-radius:6px;background:rgba(255,255,255,.05)}
.hk-task.urgent{background:rgba(248,113,113,.12);color:#f87171;border-left:2px solid #f87171}

/* ═══════════════════════════════════════
   PAYMENTS PAGE  (kept for reference — route removed)
   ═══════════════════════════════════════ */
.hero-pay{
  padding:80px 0 0;
  background:linear-gradient(155deg,#0a1f14 0%,#062010 55%,#0a1f14 100%);
  position:relative;overflow:hidden;
}
.hero-pay::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 60% at 60% 40%,rgba(47,87,64,.2) 0%,transparent 60%),
    radial-gradient(ellipse 50% 40% at 20% 70%,rgba(201,147,58,.12) 0%,transparent 50%);
  pointer-events:none;
}
.hero-pay-layout{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:flex-end}
.hero-pay-text{padding-bottom:72px}
.hero-pay h1{font-family:var(--font-display);font-size:clamp(34px,4vw,56px);font-weight:300;line-height:1.1;color:var(--white);margin-bottom:20px;letter-spacing:-.02em}
.hero-pay h1 em{font-style:italic;color:var(--gold2)}
.hero-pay-sub{font-size:16px;line-height:1.75;color:rgba(255,255,255,.62);max-width:480px;margin-bottom:36px}

/* Payments Dashboard Mockup */
.hero-pay-visual{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:flex-end}
.pay-screen{
  width:520px;background:#060f0a;
  border-radius:14px 14px 0 0;overflow:hidden;
  box-shadow:0 -16px 80px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.07);
}
.pay-topbar{background:#040a06;padding:11px 16px;display:flex;align-items:center;gap:6px;border-bottom:1px solid rgba(255,255,255,.06)}
.pay-tb-dot{width:9px;height:9px;border-radius:50%}
.pay-tb-dot.r{background:#ff5f57}.pay-tb-dot.y{background:#ffbd2e}.pay-tb-dot.g{background:#28c840}
.pay-tb-title{font-size:10px;color:rgba(255,255,255,.22);margin-left:8px;font-family:var(--font-mono);letter-spacing:.04em}
.pay-header{background:#070d09;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06)}
.pay-hdr-title{font-size:12px;font-weight:700;color:rgba(255,255,255,.8);letter-spacing:.04em}
.pay-secure-pill{display:flex;align-items:center;gap:5px;background:rgba(92,171,116,.12);border:1px solid rgba(92,171,116,.25);border-radius:100px;padding:4px 12px;font-size:10px;font-weight:700;color:#5cab74}
.pay-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.06)}
.pay-kpi{background:#070d09;padding:13px 14px;text-align:center}
.pay-kpi-val{font-size:17px;font-weight:700;color:var(--white);font-family:var(--font-mono)}
.pay-kpi-lbl{font-size:9px;text-transform:uppercase;letter-spacing:.07em;color:rgba(255,255,255,.3);margin-top:2px}
.pay-kpi-chg{font-size:9px;color:#5cab74;margin-top:1px}
.pay-transactions{padding:14px 18px}
.pay-tx-hdr{display:grid;grid-template-columns:1.6fr 0.9fr 1fr 0.8fr 0.8fr;gap:8px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.06)}
.pay-tx-hdr span{font-size:9px;font-weight:700;color:rgba(255,255,255,.28);text-transform:uppercase;letter-spacing:.06em}
.pay-tx-row{display:grid;grid-template-columns:1.6fr 0.9fr 1fr 0.8fr 0.8fr;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.04)}
.pay-tx-name{font-size:11px;font-weight:600;color:rgba(255,255,255,.85)}
.pay-tx-method{font-size:10px;color:rgba(255,255,255,.5)}
.pay-tx-amount{font-size:11px;font-weight:700;color:#5cab74;font-family:var(--font-mono)}
.pay-tx-time{font-size:10px;color:rgba(255,255,255,.35);font-family:var(--font-mono)}
.pay-status{display:inline-block;padding:3px 8px;border-radius:100px;font-size:9px;font-weight:700;text-transform:uppercase}
.pay-status.ok{background:rgba(92,171,116,.15);color:#5cab74}
.pay-status.pend{background:rgba(251,191,36,.15);color:#fbbf24}
.pay-methods-strip{display:flex;align-items:center;gap:8px;padding:12px 18px;background:rgba(255,255,255,.03);border-top:1px solid rgba(255,255,255,.06);flex-wrap:wrap}
.pay-method-pill{display:flex;align-items:center;gap:5px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:100px;padding:5px 12px;font-size:10px;font-weight:600;color:rgba(255,255,255,.7)}

/* Payments Features */
.pay-features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.pay-feat-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:32px;transition:transform .2s,box-shadow .2s}
.pay-feat-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.pay-feat-card.featured{background:linear-gradient(135deg,#0a1f14,#0d2a1c);color:var(--white);border-color:rgba(47,87,64,.3)}
.pay-feat-card .feat-icon{font-size:28px;margin-bottom:16px}
.pay-feat-card h3{font-family:var(--font-display);font-size:22px;font-weight:600;margin-bottom:12px;line-height:1.25}
.pay-feat-card.featured h3{color:var(--white)}
.pay-feat-card p{font-size:15px;color:var(--mid);line-height:1.65}
.pay-feat-card.featured p{color:rgba(255,255,255,.6)}
.pay-feat-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.pay-fp{background:var(--surface);color:var(--mid);border-radius:100px;padding:4px 10px;font-size:11px;font-weight:600}
.pay-feat-card.featured .pay-fp{background:rgba(255,255,255,.1);color:rgba(255,255,255,.65)}

/* Gateway Grid */
.gateway-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:48px}
.gw-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:28px 20px;text-align:center;transition:transform .2s,box-shadow .2s}
.gw-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.gw-logo{font-size:32px;margin-bottom:12px}
.gw-name{font-size:16px;font-weight:700;color:var(--ink);margin-bottom:4px}
.gw-type{font-size:12px;color:var(--mid);margin-bottom:12px}
.gw-regions{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}
.gw-region{background:var(--surface);color:var(--mid);border-radius:4px;padding:2px 7px;font-size:11px;font-weight:600}

/* Security badges */
.security-strip{display:flex;gap:24px;flex-wrap:wrap;margin-top:40px;padding:28px;background:var(--surface);border-radius:var(--r-lg);border:1px solid var(--border)}
.sec-badge{display:flex;align-items:center;gap:10px}
.sec-badge-icon{font-size:24px}
.sec-badge-title{font-size:14px;font-weight:700;color:var(--ink)}
.sec-badge-sub{font-size:12px;color:var(--mid)}

/* ═══════════════════════════════════════
   EXTENDED MODULES PAGE
   ═══════════════════════════════════════ */
.hero-em{
  padding:80px 0 60px;
  background:linear-gradient(155deg,#1a0a2e 0%,#160825 55%,#1a0a2e 100%);
  position:relative;overflow:hidden;
}
.hero-em::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 65% 55% at 60% 40%,rgba(124,58,237,.2) 0%,transparent 60%),
    radial-gradient(ellipse 45% 40% at 20% 70%,rgba(201,147,58,.12) 0%,transparent 50%);
  pointer-events:none;
}
.hero-em-layout{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.hero-em-text{padding-bottom:20px}
.hero-em h1{font-family:var(--font-display);font-size:clamp(34px,4vw,56px);font-weight:300;line-height:1.1;color:var(--white);margin-bottom:20px;letter-spacing:-.02em}
.hero-em h1 em{font-style:italic;color:var(--gold2)}
.hero-em-sub{font-size:16px;line-height:1.75;color:rgba(255,255,255,.62);max-width:480px;margin-bottom:36px}

/* Module Cards Hero Visual */
.hero-em-visual{position:relative;z-index:2}
.em-modules-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.em-module-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:20px;transition:transform .2s,background .2s}
.em-module-card:hover{background:rgba(255,255,255,.09);transform:translateY(-2px)}
.em-module-card.highlight{background:rgba(124,58,237,.15);border-color:rgba(124,58,237,.35)}
.em-module-icon{font-size:24px;margin-bottom:10px}
.em-module-name{font-size:14px;font-weight:700;color:var(--white);margin-bottom:4px}
.em-module-desc{font-size:12px;color:rgba(255,255,255,.5);line-height:1.5}
.em-module-pills{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}
.em-module-pill{background:rgba(255,255,255,.08);color:rgba(255,255,255,.55);border-radius:100px;padding:2px 8px;font-size:10px;font-weight:600}

/* Module Detail Sections */
.module-section{padding:80px 0;border-bottom:1px solid var(--border)}
.module-section:last-child{border-bottom:none}
.module-section.alt{background:var(--surface)}
.module-detail-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center}
.module-detail-grid.reverse{direction:rtl}
.module-detail-grid.reverse > *{direction:ltr}
.module-text{}
.module-icon-large{font-size:48px;margin-bottom:20px}
.module-overline{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--teal);margin-bottom:12px}
.module-heading{font-family:var(--font-display);font-size:clamp(28px,3vw,42px);font-weight:300;line-height:1.15;color:var(--ink);margin-bottom:18px;letter-spacing:-.02em}
.module-heading em{font-style:italic;color:var(--gold)}
.module-body{font-size:16px;color:var(--mid);line-height:1.75;margin-bottom:24px}
.module-checklist{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.module-checklist li{display:flex;align-items:flex-start;gap:10px;font-size:15px;color:var(--slate)}
.module-check{width:20px;height:20px;min-width:20px;border-radius:50%;background:linear-gradient(135deg,var(--teal),var(--teal2));display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff;font-weight:700;flex-shrink:0;margin-top:2px}

/* Module Visual Cards */
.module-visual{position:relative}
.module-mockup{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md)}
.module-mockup-bar{background:#0e1f3d;padding:11px 16px;display:flex;align-items:center;gap:6px}
.mm-dot{width:8px;height:8px;border-radius:50%}
.mm-dot.r{background:#ff5f57}.mm-dot.y{background:#ffbd2e}.mm-dot.g{background:#28c840}
.mm-title{font-size:10px;color:rgba(255,255,255,.35);margin-left:8px;font-family:var(--font-mono)}
.module-mockup-body{padding:20px}
.mm-kpi-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}
.mm-kpi{background:var(--surface);border-radius:10px;padding:14px;text-align:center}
.mm-kpi-val{font-size:18px;font-weight:700;color:var(--ink);font-family:var(--font-mono)}
.mm-kpi-lbl{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-top:2px}
.mm-table-hdr{display:grid;gap:8px;padding-bottom:8px;border-bottom:1px solid var(--border);margin-bottom:6px}
.mm-table-hdr span{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.mm-table-row{display:grid;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid rgba(0,0,0,.04)}
.mm-table-row:last-child{border-bottom:none}
.mm-cell{font-size:12px;color:var(--slate)}
.mm-cell.bold{font-weight:700;color:var(--ink)}
.mm-cell.green{color:#356644;font-weight:700}
.mm-cell.gold{color:var(--gold);font-weight:700}
.mm-tag{display:inline-block;padding:3px 8px;border-radius:100px;font-size:10px;font-weight:700}
.mm-tag.green{background:rgba(53,102,68,.1);color:#356644}
.mm-tag.blue{background:rgba(37,99,235,.1);color:var(--accent)}
.mm-tag.gold{background:rgba(201,147,58,.12);color:var(--gold)}
.mm-tag.purple{background:rgba(124,58,237,.1);color:#7c3aed}
.mm-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.mm-bar-label{font-size:12px;color:var(--slate);min-width:90px}
.mm-bar-bg{flex:1;height:8px;background:var(--border);border-radius:100px;overflow:hidden}
.mm-bar-fill{height:100%;border-radius:100px;background:linear-gradient(90deg,var(--teal),var(--teal2))}
.mm-bar-val{font-size:12px;font-weight:700;color:var(--ink);min-width:40px;text-align:right}

/* Modules CTA strip */
.em-cta-strip{background:linear-gradient(135deg,#1a0a2e,#160825);padding:64px 0}
.em-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap}
.em-cta-text h2{font-family:var(--font-display);font-size:clamp(28px,3vw,42px);font-weight:300;color:var(--white);margin-bottom:10px;line-height:1.2}
.em-cta-text h2 em{font-style:italic;color:var(--gold2)}
.em-cta-text p{font-size:15px;color:rgba(255,255,255,.55);max-width:420px}
.em-cta-actions{display:flex;gap:14px;flex-wrap:wrap}

/* Other Services (shared) */
.other-services{padding:80px 0;background:var(--surface)}
.other-services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px}
.os-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:28px 22px;display:flex;flex-direction:column;gap:8px;transition:transform .2s,box-shadow .2s;cursor:pointer}
.os-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.os-icon{font-size:28px}
.os-name{font-size:16px;font-weight:700;color:var(--ink)}
.os-desc{font-size:13px;color:var(--mid);line-height:1.55;flex:1}
.os-link{font-size:13px;font-weight:600;color:var(--teal);margin-top:4px}

/* ═══════════════════════════════════════
   SHARED: TESTIMONIALS, FAQ, CTA STRIP
   ═══════════════════════════════════════ */
.sp-testimonials{padding:80px 0}
.sp-testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:48px}
.sp-testi-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:36px 32px;position:relative}
.sp-testi-quote{font-size:48px;font-family:var(--font-display);color:var(--gold2);line-height:.8;margin-bottom:12px;opacity:.5}
.sp-testi-text{font-size:15px;color:var(--slate);line-height:1.7;margin-bottom:24px}
.sp-testi-author{display:flex;align-items:center;gap:12px}
.sp-testi-avatar{font-size:24px;width:40px;height:40px;background:var(--surface);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.sp-testi-name{font-size:14px;font-weight:700;color:var(--ink)}
.sp-testi-hotel{font-size:12px;color:var(--mid);margin-top:1px}
.sp-testi-stars{font-size:12px;color:var(--gold);margin-top:3px}

.sp-cta-strip{padding:72px 0}
.sp-cta-inner{background:linear-gradient(135deg,var(--ink2) 0%,var(--ink) 100%);border-radius:var(--r-xl);padding:56px 64px;display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap}
.sp-cta-text h2{font-family:var(--font-display);font-size:clamp(26px,3vw,40px);font-weight:300;color:var(--white);margin-bottom:10px;line-height:1.2}
.sp-cta-text h2 em{font-style:italic;color:var(--gold2)}
.sp-cta-text p{font-size:15px;color:rgba(255,255,255,.55);max-width:400px}
.sp-cta-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.sp-cta-note{font-size:12px;color:rgba(255,255,255,.4);width:100%;text-align:center}

.sp-faq-section{background:var(--surface);padding:80px 0}
.sp-faq-grid{display:grid;grid-template-columns:320px 1fr;gap:60px;align-items:flex-start}
.sp-faq-sidebar h3{font-family:var(--font-display);font-size:32px;font-weight:300;color:var(--ink);margin-bottom:12px;line-height:1.2}
.sp-faq-sidebar h3 em{font-style:italic;color:var(--gold)}
.sp-faq-sidebar p{font-size:15px;color:var(--mid);margin-bottom:24px;line-height:1.65}
.sp-faq-list{display:flex;flex-direction:column;gap:0}
.sp-faq-item{border-bottom:1px solid var(--border)}
.sp-faq-item.open .sp-faq-answer{display:block}
.sp-faq-item.open .sp-faq-chevron{transform:rotate(180deg)}
.sp-faq-question{width:100%;display:flex;align-items:center;justify-content:space-between;padding:20px 0;background:none;border:none;cursor:pointer;font-size:16px;font-weight:600;color:var(--ink);text-align:left;gap:12px}
.sp-faq-chevron{font-size:14px;color:var(--mid);transition:transform .25s;flex-shrink:0}
.sp-faq-answer{display:none;padding-bottom:20px}
.sp-faq-answer-inner{font-size:15px;color:var(--mid);line-height:1.75}

/* ═══════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════ */
@media(max-width:900px){
  .hero-pms-layout,.hero-pay-layout,.hero-em-layout{grid-template-columns:1fr}
  .hero-pms-visual,.hero-pay-visual,.hero-em-visual{display:none}
  .pms-features-grid,.pay-features-grid{grid-template-columns:1fr 1fr}
  .gateway-grid{grid-template-columns:1fr 1fr}
  .em-modules-grid{grid-template-columns:1fr 1fr}
  .module-detail-grid,.module-detail-grid.reverse{grid-template-columns:1fr;direction:ltr}
  .sp-faq-grid{grid-template-columns:1fr}
  .sp-testimonials-grid{grid-template-columns:1fr}
  .other-services-grid{grid-template-columns:1fr 1fr}
  .sp-cta-inner{padding:36px 28px}
}
@media(max-width:600px){
  .pms-features-grid,.pay-features-grid,.gateway-grid,.em-modules-grid,.other-services-grid{grid-template-columns:1fr}
  .hero-pms-text{padding-bottom:40px}
  .hero-pay-text{padding-bottom:40px}
}
