/* =====================================================================
   BUILDR v2 — home.css (front page only; loads after app.css)
   ===================================================================== */

/* ---- HERO: navy platform masthead ------------------------------------ */
.br-hero{background:var(--navy);color:#fff;position:relative;padding-block:clamp(30px,4.5vw,54px) clamp(38px,5vw,62px)}
.br-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:var(--hazard)}
.br-hero-grid{display:grid;grid-template-columns:1.75fr 1fr;gap:clamp(26px,3.5vw,44px);align-items:start}

/* Lead story card */
.br-lead .wp-block-post-template{list-style:none;margin:0;padding:0}
.br-lead .wp-block-post-template>li{margin:0}
.br-lead-img{margin:0 0 18px;overflow:hidden;border-radius:var(--r)}
.br-lead-img img{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--navy-2);transition:transform .35s}
.br-lead .wp-block-post-template>li:hover .br-lead-img img{transform:scale(1.03)}
.br-lead .br-chips a{background:rgba(255,255,255,.12);color:#fff}
.br-lead .wp-block-post-title{font-family:var(--ff-d);font-weight:900;letter-spacing:-.025em;line-height:1.08;margin:.1em 0 .3em;color:#fff}
.br-lead .wp-block-post-title a{color:#fff}
.br-lead .wp-block-post-title a:hover{color:var(--orange)}
.br-lead .wp-block-post-excerpt{font-size:16px;line-height:1.6;color:rgba(255,255,255,.75);max-width:58ch;margin:0 0 10px}
.br-lead .wp-block-post-excerpt__more-text{display:none}
.br-lead .br-meta{color:rgba(255,255,255,.5)}

/* Rail */
.br-rail-label{font-family:var(--ff-d);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--orange);margin:0 0 6px}
.br-rail .wp-block-post-template{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.br-rail .wp-block-post-template>li{margin:0;padding:15px 0;border-top:1px solid var(--navy-3)}
.br-rail .wp-block-post-template>li:first-child{border-top:0;padding-top:4px}
.br-rail .wp-block-post-title{font-family:var(--ff-d);font-weight:700;font-size:16px;line-height:1.32;letter-spacing:-.01em;margin:0 0 6px;color:#fff}
.br-rail .wp-block-post-title a{color:#fff}
.br-rail .wp-block-post-title a:hover{color:var(--orange)}
.br-rail .br-meta{color:rgba(255,255,255,.45)}

@media(max-width:900px){
  .br-hero-grid{grid-template-columns:1fr;gap:30px}
}

/* ---- SECTION RAILS on surface ----------------------------------------- */
.br-home-sections{background:var(--paper)}

/* ---- KONTRAKTOR SPOTLIGHT band (navy) ---------------------------------- */
.br-spot{background:var(--navy-2);color:#fff;padding-block:clamp(44px,6vw,80px);position:relative}
.br-spot::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--hazard)}
.br-spot .br-sec-title{color:#fff}
.br-spot .br-sec-link a{color:var(--orange)}
.br-spot .br-sec-link a:hover{color:#fff}
.br-spot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:26px}
.br-spot .br-kgrid .wp-block-post-template{grid-template-columns:repeat(2,1fr)}
.br-spot .br-kgrid .wp-block-post-template>li{background:var(--navy-3);box-shadow:none}
.br-spot .br-kgrid .wp-block-post-title,.br-spot .br-kgrid .wp-block-post-title a{color:#fff}
.br-spot .br-kgrid .wp-block-post-excerpt{color:#9AA6BD}

/* Superstar promo card */
.br-promo{background:linear-gradient(135deg,var(--orange) 0%,var(--orange-dark) 100%);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;justify-content:center}
.br-promo .br-kicker{color:#fff;opacity:.9}
.br-promo h3{font-family:var(--ff-d);font-weight:900;font-style:italic;text-transform:uppercase;font-size:clamp(20px,2.4vw,26px);letter-spacing:-.01em;line-height:1.1;margin:.1em 0 .4em;color:#fff}
.br-promo p{font-size:14px;line-height:1.6;color:rgba(255,255,255,.92);margin:0 0 18px}
.br-promo a.br-promo-btn{align-self:flex-start;font-family:var(--ff-d);font-weight:800;font-size:14px;background:#fff;color:var(--orange-dark);padding:12px 20px;border-radius:10px;transition:transform .15s}
.br-promo a.br-promo-btn:hover{transform:translateY(-2px)}
.br-spot-cards{display:grid;grid-template-columns:2fr 1fr;gap:22px;align-items:stretch}
@media(max-width:900px){
  .br-spot-cards{grid-template-columns:1fr}
  .br-spot .br-kgrid .wp-block-post-template{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){.br-spot .br-kgrid .wp-block-post-template{grid-template-columns:1fr}}

/* ---- VIDEO band (deep navy) -------------------------------------------- */
.br-video{background:var(--navy);color:#fff;padding-block:clamp(44px,6vw,80px)}
.br-video .br-sec-title{color:#fff}
.br-video .br-sec-link a{color:var(--orange)}
.br-video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:26px}
.br-vcard{background:var(--navy-2);border-radius:var(--r);overflow:hidden}
.br-vcard .thumb{position:relative;aspect-ratio:16/9;background:var(--navy-3);display:flex;align-items:center;justify-content:center}
.br-vcard .thumb svg{width:52px;height:52px;color:var(--orange)}
.br-vcard h3{font-family:var(--ff-d);font-weight:700;font-size:15.5px;line-height:1.35;margin:0;padding:14px 16px 16px;color:#fff}
@media(max-width:900px){.br-video-grid{grid-template-columns:1fr;gap:14px}}

/* ---- INTEL / SUMBER teaser --------------------------------------------- */
.br-intel{background:var(--surface);padding-block:clamp(44px,6vw,72px)}
.br-intel-in{display:grid;grid-template-columns:1.4fr 1fr;gap:36px;align-items:center}
.br-intel h2{font-family:var(--ff-d);font-weight:900;font-style:italic;text-transform:uppercase;font-size:clamp(23px,3vw,32px);letter-spacing:-.01em;margin:.15em 0 .35em}
.br-intel p{color:var(--muted);font-size:15.5px;max-width:52ch;margin:0}
.br-intel-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:24px;box-shadow:var(--shadow)}
.br-intel-card .tag{font-family:var(--ff-d);font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:var(--navy);color:#fff;display:inline-block;padding:5px 10px;border-radius:999px;margin-bottom:12px}
.br-intel-card h3{font-family:var(--ff-d);font-weight:800;font-size:18px;margin:0 0 6px}
.br-intel-card p{font-size:13.5px;margin:0 0 16px}
@media(max-width:860px){.br-intel-in{grid-template-columns:1fr;gap:24px}}