/* Extracted from page-future-projects.php so it is cached once instead of being re-sent
   inside the HTML on every page view. Enqueued by
   lumoria_enqueue_template_styles() in functions.php. */

    #lumFpPage, #lumFpPage * { box-sizing: border-box; }
    #lumFpPage {
      --lum-gold: #44BDA1;
      --lum-gold-dark: #04272F;
      --lum-ink: #1D1235;
      --lum-sub: var(--text-muted);
      --lum-line: rgba(29,18,53,.09);
      --lum-danger: #d9534f;
      font-family: var(--font-primary);
      max-width: var(--container-w);
      margin: 0 auto;
      padding: clamp(28px,4vw,52px) clamp(16px,4vw,48px) clamp(64px,8vw,104px);
    }

    /* ---------------- PAGE HERO ---------------- */
    #lumFpPage .lum-fp-hero {
      position: relative;
      display: grid;
      grid-template-columns: minmax(0,1.05fr) minmax(360px,.95fr);
      min-height: 490px;
      margin-block-end: clamp(40px,5vw,68px);
      overflow: hidden;
      border-radius: var(--radius-lg);
      background: var(--lum-gold-dark);
      box-shadow: 0 30px 70px -36px rgba(4,39,47,.65);
      isolation: isolate;
    }
    #lumFpPage .lum-fp-hero.is-image-free { grid-template-columns: minmax(0,1fr); }
    #lumFpPage .lum-fp-hero-copy {
      position: relative;
      z-index: 2;
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-width: 0;
      padding: clamp(42px,6vw,84px);
    }
    #lumFpPage .lum-fp-hero-copy::before {
      content: "";
      position: absolute;
      inset-block-start: clamp(28px,4vw,52px);
      inset-inline-start: clamp(42px,6vw,84px);
      width: 54px;
      height: 3px;
      border-radius: 999px;
      background: var(--lum-gold);
    }
    #lumFpPage .lum-fp-head { max-width: 720px; margin: 0 0 clamp(32px,4vw,48px); text-align: start; }
    /* The hero carries its own spacing. */
    #lumFpPage .lum-fp-hero .lum-fp-head { margin: 0; }
    #lumFpPage .lum-fp-eyebrow {
      display: inline-flex; align-items: center; gap: 10px;
      margin-bottom: 16px; padding: 8px 20px;
      border: 1px solid rgba(68,189,161,.4); border-radius: 999px;
      font-size: 13px; font-weight: var(--fw-semibold);
      letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--lum-gold);
    }
    #lumFpPage .lum-fp-hero .lum-fp-eyebrow { border-color: rgba(255,255,255,.24); color: #fff; }
    #lumFpPage .lum-fp-title {
      margin: 0 0 14px; font-size: var(--text-h2); font-weight: var(--fw-heading);
      line-height: 1.15; letter-spacing: var(--ls-h2); color: var(--lum-ink);
    }
    #lumFpPage .lum-fp-intro { margin: 0; font-size: var(--text-base); line-height: var(--lh-prose); color: var(--lum-sub); }
    #lumFpPage .lum-fp-hero .lum-fp-title { color: #fff; font-size: clamp(36px,4.2vw,62px); }
    #lumFpPage .lum-fp-hero .lum-fp-intro { max-width: 58ch; color: rgba(255,255,255,.76); }
    #lumFpPage .lum-fp-hero-meta {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      width: fit-content;
      margin-block-start: 22px;
      font-size: var(--text-sm);
      font-weight: var(--fw-medium);
      color: rgba(255,255,255,.82);
    }
    #lumFpPage .lum-fp-hero-meta i { color: var(--lum-gold); }
    #lumFpPage .lum-fp-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-block-start: 30px; }
    #lumFpPage .lum-fp-hero-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      min-height: 48px;
      padding-inline: 22px;
      border: 1px solid rgba(255,255,255,.3);
      border-radius: var(--radius-pill);
      color: #fff;
      font-size: var(--text-sm);
      font-weight: var(--fw-semibold);
      text-decoration: none;
      transition: transform var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast);
    }
    #lumFpPage .lum-fp-hero-btn.is-primary { border-color: var(--lum-gold); background: var(--lum-gold); }
    #lumFpPage .lum-fp-hero-btn:hover { transform: translateY(-2px); border-color: #fff; background: rgba(255,255,255,.1); }
    #lumFpPage .lum-fp-hero-btn.is-primary:hover { border-color: #fff; background: #fff; color: var(--lum-gold-dark); }
    #lumFpPage .lum-fp-hero-media { position: relative; min-width: 0; overflow: hidden; }
    #lumFpPage .lum-fp-hero-media::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, var(--lum-gold-dark) 0%, rgba(4,39,47,0) 32%);
      pointer-events: none;
    }
    html[dir="rtl"] #lumFpPage .lum-fp-hero-media::after { transform: scaleX(-1); }
    #lumFpPage .lum-fp-hero-media img { display: block; width: 100%; height: 100%; object-fit: cover; }

    /* ---------------- PROJECT CARDS ---------------- */
    #lumFpPage .lum-fp-grid {
      display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 24px;
      margin-bottom: clamp(48px,6vw,72px);
    }
    /* One or two cards keep a sensible width but line up under the heading
       (inline-start), not centred on the page. */
    #lumFpPage .lum-fp-grid.is-single { grid-template-columns: minmax(0,500px); justify-content: start; }
    #lumFpPage .lum-fp-grid.is-pair { grid-template-columns: repeat(2, minmax(0,1fr)); max-width: 1040px; }
    #lumFpPage .lum-fp-card {
      display: flex; flex-direction: column; overflow: hidden;
      background: #fff; border: 1px solid var(--lum-line); border-radius: 18px;
      box-shadow: 0 2px 6px rgba(29,18,53,.05);
      transition: transform .3s ease, box-shadow .3s ease;
    }
    #lumFpPage .lum-fp-card:hover { transform: translateY(-3px); box-shadow: 0 22px 44px -20px rgba(29,18,53,.22); }
    #lumFpPage .lum-fp-media { position: relative; display: block; aspect-ratio: 16/11; overflow: hidden; }
    #lumFpPage .lum-fp-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
    #lumFpPage .lum-fp-card:hover .lum-fp-media img { transform: scale(1.05); }
    #lumFpPage .lum-fp-badge {
      position: absolute; top: 14px; inset-inline-start: 14px;
      padding: 6px 14px; border-radius: 999px;
      background: rgba(4,39,47,.82); color: #fff;
      font-size: var(--text-xs); font-weight: var(--fw-semibold); letter-spacing: .02em;
      backdrop-filter: blur(2px);
    }
    #lumFpPage .lum-fp-body { display: flex; flex-direction: column; flex-grow: 1; padding: 22px 24px 24px; }
    #lumFpPage .lum-fp-name { margin: 0 0 8px; font-size: var(--text-xl); font-weight: var(--fw-semibold); line-height: var(--lh-snug); color: var(--lum-ink); }
    #lumFpPage .lum-fp-name a { color: inherit; text-decoration: none; }
    #lumFpPage .lum-fp-name a:hover { color: var(--lum-gold-dark); }
    #lumFpPage .lum-fp-loc { display: flex; align-items: center; gap: 7px; margin: 0 0 14px; font-size: 13.5px; color: var(--lum-sub); }
    #lumFpPage .lum-fp-loc i { color: var(--lum-gold); font-size: 13px; }
    #lumFpPage .lum-fp-desc {
      margin: 0 0 20px; flex-grow: 1; font-size: 15px; line-height: 1.6; color: var(--lum-sub);
      display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
    }
    #lumFpPage .lum-fp-actions { display: flex; gap: 10px; flex-wrap: wrap; padding-top: 16px; border-top: 1px solid var(--lum-line); }
    #lumFpPage .lum-fp-btn {
      display: inline-flex; align-items: center; gap: 7px;
      padding: 11px 18px; border-radius: 999px; border: 1px solid var(--lum-line);
      font-size: 13.5px; font-weight: var(--fw-semibold); color: var(--lum-ink);
      background: #fff; text-decoration: none; transition: border-color .2s ease, color .2s ease, background .2s ease;
    }
    #lumFpPage .lum-fp-btn:hover { border-color: var(--lum-gold); color: var(--lum-gold-dark); }
    #lumFpPage .lum-fp-btn.is-primary { background: var(--lum-gold); border-color: var(--lum-gold); color: #fff; }
    #lumFpPage .lum-fp-btn.is-primary:hover { background: var(--lum-gold-dark); border-color: var(--lum-gold-dark); color: #fff; }
    #lumFpPage .lum-fp-btn i { font-size: 11px; transition: transform var(--transition-fast); }
    #lumFpPage .lum-fp-btn:hover i { transform: translateX(3px); }
    html[dir="rtl"] #lumFpPage .lum-fp-btn i { transform: scaleX(-1); }
    html[dir="rtl"] #lumFpPage .lum-fp-btn:hover i { transform: scaleX(-1) translateX(3px); }
    #lumFpPage .lum-fp-media-placeholder {
      display: grid;
      width: 100%;
      height: 100%;
      place-items: center;
      background: linear-gradient(135deg, rgba(68,189,161,.16), rgba(4,39,47,.12));
      color: var(--lum-gold-dark);
      font-size: var(--text-5xl);
    }
    #lumFpPage .lum-fp-empty { padding: 48px 24px; text-align: center; border: 1px dashed var(--lum-line); border-radius: 18px; color: var(--lum-sub); }

    @media (max-width: 1100px) {
      #lumFpPage .lum-fp-hero { grid-template-columns: minmax(0,1fr) minmax(300px,.8fr); }
      #lumFpPage .lum-fp-grid:not(.is-single) { grid-template-columns: repeat(2, minmax(0,1fr)); }
    }
    @media (max-width: 900px) {
      #lumFpPage .lum-fp-hero { grid-template-columns: minmax(0,1fr); }
      #lumFpPage .lum-fp-hero-media { min-height: 320px; }
      #lumFpPage .lum-fp-hero-media::after { background: linear-gradient(180deg, var(--lum-gold-dark) 0%, rgba(4,39,47,0) 34%); }
      html[dir="rtl"] #lumFpPage .lum-fp-hero-media::after { transform: none; }
    }
    @media (max-width: 780px) {
      #lumFpPage .lum-fp-grid { grid-template-columns: minmax(0,1fr); }
    }
    @media (max-width: 640px) {
      #lumFpPage { padding-block-start: 18px; }
      #lumFpPage .lum-fp-hero { min-height: 0; border-radius: 22px; }
      #lumFpPage .lum-fp-hero-copy { padding: 56px 24px 36px; }
      #lumFpPage .lum-fp-hero-copy::before { inset-block-start: 32px; inset-inline-start: 24px; }
      #lumFpPage .lum-fp-hero .lum-fp-title { font-size: var(--text-h2); }
      #lumFpPage .lum-fp-hero-actions { align-items: stretch; flex-direction: column; }
      #lumFpPage .lum-fp-hero-btn { width: 100%; }
      #lumFpPage .lum-fp-hero-media { min-height: 240px; }
      #lumFpPage .lum-fp-card { border-radius: 16px; }
      #lumFpPage .lum-fp-body { padding: 20px; }
      #lumFpPage .lum-fp-actions { align-items: stretch; flex-direction: column; }
      #lumFpPage .lum-fp-btn { justify-content: center; width: 100%; }
    }