/* WL Móveis Corporativos — Home page styles */

/* ================= HERO ================= */
  .hero{
    position:relative; padding:0 18px 18px;
    background:var(--ink);
  }
  .hero__box{
    position:relative; width:100%; max-width:1920px; margin:0 auto;
    min-height:min(76svh, 740px);
    border:1px solid var(--line); border-radius:24px; overflow:hidden;
    box-shadow:0 30px 70px rgba(0,0,0,0.45);
    display:flex; align-items:center;
  }
  .hero__bg{ position:absolute; inset:0; z-index:0; background-image:url("{{HERO_IMG}}"); background-size:cover; background-position:center 38%; }
  .hero__scrim{
    position:absolute; inset:0; z-index:1;
    background:
      linear-gradient(90deg, rgba(25,25,27,0.94) 0%, rgba(25,25,27,0.8) 34%, rgba(25,25,27,0.42) 64%, rgba(25,25,27,0.24) 100%),
      linear-gradient(to top, rgba(25,25,27,0.75) 0%, rgba(25,25,27,0) 40%);
  }
  .hero__inner{
    position:relative; z-index:2; width:100%; max-width:var(--container); margin:0 auto;
    padding:calc(96px + clamp(24px,4vw,44px)) clamp(28px,5vw,56px) clamp(44px,6vw,72px);
  }
  .hero__eyebrow{ margin-bottom:20px; display:block; }
  .hero__title{ font-size:clamp(2.3rem, 4.6vw, 3.9rem); line-height:1.08; max-width:17ch; }
  .hero__title em{ white-space:nowrap; }
  .hero__sub{ margin-top:24px; max-width:48ch; color:var(--ivory-dim); font-size:1.02rem; }
  .hero__ctas{ margin-top:34px; display:flex; gap:14px; flex-wrap:wrap; }

  @media (max-width:900px){ .hero{ padding:0 12px 12px; } .hero__box{ border-radius:18px; min-height:min(70svh, 620px); } .hero__inner{ padding:132px 24px 40px; } }

/* ================= MARQUEE ================= */
  .marquee{
    border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    background:var(--panel); overflow:hidden; padding:20px 0;
  }
  .marquee__track{ display:flex; width:max-content; animation:marquee 42s linear infinite; }
  .marquee__group{ display:flex; align-items:center; flex-shrink:0; }
  .marquee__item{ display:flex; align-items:center; gap:22px; padding:0 22px; white-space:nowrap; }
  .marquee__item span.mono{ font-size:0.8rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--ivory-dim); }
  .marquee__item .dot{ color:var(--bronze); font-size:0.8rem; }
  .marquee:hover .marquee__track{ animation-play-state:paused; }
  @keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
  @media (prefers-reduced-motion: reduce){
    .marquee__track{ animation:none; }
    .marquee__group:nth-child(2){ display:none; }
  }

/* ================= HISTÓRIA ================= */
  .historia{ padding:64px 0 120px; }
  .historia__panel{
    display:grid; grid-template-columns:1fr 1.1fr; gap:0; align-items:stretch;
    border:1px solid var(--line); border-radius:16px; overflow:hidden;
  }
  .historia__img{ position:relative; min-height:420px; }
  .historia__img img{ width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
  .historia__copy{ position:relative; padding:clamp(32px,4vw,56px); background:var(--panel-2); display:flex; flex-direction:column; justify-content:center; }
  .historia__seal{ position:absolute; top:clamp(24px,3.2vw,40px); right:clamp(24px,3.2vw,40px); width:clamp(72px,7vw,96px); height:auto; }
  .historia__copy .eyebrow{ display:block; margin-bottom:14px; }
  .historia__copy h2{ font-size:clamp(1.8rem,3vw,2.5rem); max-width:16ch; }
  .historia__copy p{ margin-top:18px; color:var(--ivory-dim); font-size:0.96rem; max-width:48ch; }
  .historia__chips{ margin-top:30px; display:flex; gap:28px; flex-wrap:wrap; }
  .historia__chip{ font-size:0.68rem; letter-spacing:0.06em; color:var(--stone); }
  .historia__chip strong{ display:block; color:var(--bronze-br); font-size:0.8rem; margin-bottom:3px; }
  .historia__copy .btn{ margin-top:30px; align-self:flex-start; }
  @media (max-width:900px){ .historia__panel{ grid-template-columns:1fr; } .historia__img{ min-height:280px; } }

/* ================= PILARES ================= */
  .pilares{ padding:0 0 120px; }
  .pilares__grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
  .pilar{ background:var(--panel-2); border:1px solid var(--line); border-radius:14px; padding:30px 28px; transition:background-color 0.3s ease; }
  .pilar:hover{ background-color:#121215; }
  .pilar__icon{ width:40px; height:40px; border:1px solid var(--line); border-radius:10px; display:flex; align-items:center; justify-content:center; margin-bottom:20px; color:var(--bronze); font-family:'Space Mono'; font-size:0.9rem; }
  .pilar h3{ font-family:'Inter'; font-weight:600; font-size:1.05rem; color:var(--bronze-br); margin-bottom:10px; }
  .pilar p{ color:var(--ivory-dim); font-size:0.9rem; }
  @media (max-width:860px){ .pilares__grid{ grid-template-columns:1fr; } }

/* ================= PRODUTOS ================= */
  .produtos{ padding:0 0 120px; }
  .produtos__head{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:20px; margin-bottom:48px; padding-bottom:26px; border-bottom:1px solid var(--line); }
  .produtos__head h2{ font-size:clamp(1.9rem,3.2vw,2.6rem); max-width:16ch; }
  .produtos__head p{ max-width:40ch; color:var(--stone); font-size:0.94rem; }
  .produtos__grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; }
  .prod-card{
    position:relative; overflow:hidden; border-radius:14px; height:364px; display:block;
    text-decoration:none;
  }
  .prod-card img{ width:100%; height:100%; object-fit:cover; transition:transform 0.6s ease; }
  .prod-card:hover img{ transform:scale(1.06); }
  .prod-card__scrim{ position:absolute; inset:0; background:linear-gradient(to top, rgba(15,13,11,0.86) 0%, rgba(15,13,11,0.05) 55%); }
  .prod-card__label{
    position:absolute; left:16px; right:16px; bottom:14px; z-index:2;
    font-family:'Fraunces'; font-weight:480; font-size:1.05rem; color:var(--ivory);
  }
  .prod-card__arrow{
    position:absolute; top:14px; right:14px; z-index:2; width:32px; height:32px; border-radius:8px;
    background:rgba(15,13,11,0.55); border:1px solid rgba(255,255,255,0.15);
    display:flex; align-items:center; justify-content:center; color:var(--ivory);
    opacity:0; transform:translate(-4px,4px); transition:opacity 0.25s ease, transform 0.25s ease;
  }
  .prod-card:hover .prod-card__arrow{ opacity:1; transform:translate(0,0); }
  @media (max-width:980px){ .produtos__grid{ grid-template-columns:repeat(2, 1fr); } }
  @media (max-width:560px){ .produtos__grid{ grid-template-columns:1fr; } .prod-card{ height:308px; } }

/* ================= ATELIER ================= */
  .atelier{ padding:0 0 120px; }
  .atelier__panel{ display:grid; grid-template-columns:1fr 1fr; align-items:stretch; border:1px solid var(--line); border-radius:16px; overflow:hidden; }
  .atelier__img{ position:relative; min-height:340px; }
  .atelier__img img{ width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
  .atelier__copy{ padding:clamp(28px,4vw,52px); display:flex; flex-direction:column; justify-content:center; background:var(--panel-2); }
  .atelier__copy .eyebrow{ display:block; margin-bottom:12px; }
  .atelier__copy h2{ font-size:clamp(1.7rem,3vw,2.3rem); max-width:16ch; }
  .atelier__copy p{ margin-top:18px; color:var(--ivory-dim); font-size:0.96rem; max-width:42ch; }
  .atelier__copy .btn{ margin-top:26px; align-self:flex-start; }
  @media (max-width:900px){ .atelier__panel{ grid-template-columns:1fr; } .atelier__img{ min-height:240px; } }

/* ================= BLOG ================= */
  .blog{ padding:0 0 120px; }
  .blog__head{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:20px; margin-bottom:48px; padding-bottom:26px; border-bottom:1px solid var(--line); }
  .blog__head h2{ font-size:clamp(1.9rem,3.2vw,2.6rem); max-width:16ch; }
  .blog__head a{ font-family:'Space Mono'; font-size:0.78rem; letter-spacing:0.05em; text-transform:uppercase; color:var(--bronze); text-decoration:none; white-space:nowrap; }
  .blog__head a:hover{ color:var(--bronze-br); }
  .blog__grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
  .blog-card{ background:var(--panel-2); border:1px solid var(--line); border-radius:14px; padding:28px 26px; display:flex; flex-direction:column; gap:14px; transition:background-color 0.3s ease; text-decoration:none; }
  .blog-card:hover{ background-color:#121215; }
  .blog-card__meta{ display:flex; justify-content:space-between; align-items:center; }
  .blog-card__tag{ font-size:0.66rem; letter-spacing:0.06em; color:var(--bronze); }
  .blog-card__date{ font-size:0.66rem; color:var(--stone); }
  .blog-card h3{ font-family:'Fraunces'; font-weight:480; font-size:1.15rem; line-height:1.3; color:var(--ivory); }
  .blog-card p{ color:var(--ivory-dim); font-size:0.88rem; flex-grow:1; }
  .blog-card__cta{ font-family:'Space Mono'; font-size:0.72rem; letter-spacing:0.04em; text-transform:uppercase; color:var(--bronze-br); }
  @media (max-width:860px){ .blog__grid{ grid-template-columns:1fr; } }