/* =====================================================================
   Hero — full-background editorial hero
   File: 02-hero.css
   ===================================================================== */

/* ================= HERO (full-background editorial) ================= */
#hero{min-height:100vh; position:relative; overflow:hidden; display:flex; flex-direction:column; border-radius:0 0 40px 40px;}
.hero-bg-full{position:absolute; inset:0; z-index:0; overflow:hidden; background:linear-gradient(135deg, #2a1a12, #1b1b1b);}
.hero-bg-full.img-failed{background:linear-gradient(135deg, #3a2214, #1b1b1b);}
.hero-bg-full img{width:100%; height:100%; object-fit:cover; object-position:center 18%; transform:scale(1.1); will-change:transform;}
.hero-overlay{position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(20,17,14,.72) 0%, rgba(27,23,18,.28) 30%, rgba(30,24,17,.4) 62%, rgba(18,15,12,.92) 100%),
    radial-gradient(ellipse 70% 55% at 12% 100%, rgba(252,110,32,.5), transparent 65%),
    radial-gradient(ellipse 60% 55% at 100% 15%, rgba(255,231,208,.14), transparent 60%);
}
.hero-content{position:relative; z-index:2; flex:1; display:flex; flex-direction:column; justify-content:space-between; padding-top:150px; padding-bottom:56px;}
.hero-columns{flex:1; display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:end; padding:40px 0 70px;}
.hero-left .intro{max-width:270px; font-size:14.5px; line-height:1.6; color:rgba(255,231,208,.8); margin-bottom:22px; font-weight:400;}
.hero-left{min-width:0;}
.hero-left h1{font-family:var(--font-title); font-weight:var(--title-weight); color:var(--title-color); font-size:clamp(54px,9vw,var(--h-xl-size)); line-height:.88; letter-spacing:-.02em; text-transform:uppercase; overflow-wrap:break-word; word-break:break-word; max-width:100%;}
.hero-right{display:flex; flex-direction:column; align-items:flex-start; min-width:0;}
.hero-right h2{font-size:clamp(22px,2.5vw,32px); font-weight:400; color:var(--text); max-width:420px; margin-bottom:16px; line-height:1.25; overflow-wrap:break-word;}
.hero-right p{max-width:360px; color:rgba(255,231,208,.72); font-size:14.5px; line-height:1.7;}
.hero-services{position:relative; z-index:2; border-top:1px solid rgba(255,255,255,.18); display:grid; grid-template-columns:repeat(4,1fr);}
.hero-service{padding:26px 34px; border-right:1px solid rgba(255,255,255,.14); transition:background .3s ease;}
.hero-service:last-child{border-right:none;}
.hero-service:hover{background:rgba(255,255,255,.04);}
.hero-service .hs-num{font-size:12px; font-weight:700; letter-spacing:.05em; color:var(--orange);}
.hero-service .hs-title{font-size:14.5px; font-weight:600; color:#fff; margin-top:8px;}
@media(max-width:980px){
  #hero{border-radius:0 0 26px 26px;}
  .hero-content{padding-top:120px; padding-bottom:36px;}
  .hero-columns{grid-template-columns:1fr; align-items:start; gap:30px; padding:0 0 40px;}
  .hero-right{align-items:flex-start; text-align:left;}
  .hero-services{grid-template-columns:1fr 1fr;}
  .hero-service{padding:20px 22px; border-bottom:1px solid rgba(255,255,255,.14);}
}
@media(max-width:600px){
  .hero-left h1{font-size:clamp(30px,12vw,68px);}
}
@media(max-width:560px){.hero-services{grid-template-columns:1fr;}}