:root{
  --eco-red:#df1726;
  --eco-black:#080808;
  --eco-paper:#f3f0ea;
  --eco-line:rgba(255,255,255,.14);
}

*{box-sizing:border-box}

html,body{margin:0;background:var(--eco-black);color:#fff}

body{
  font-family:"Manrope",Arial,sans-serif;
  overflow-x:hidden;
}

a{color:inherit;text-decoration:none}

.eco-shell{
  width:min(1460px,calc(100% - 64px));
  margin:0 auto;
}

.eco-header{
  position:fixed;
  inset:0 0 auto;
  height:82px;
  z-index:100;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:0 32px;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:rgba(7,7,7,.82);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}

.eco-header__logo img{width:54px;height:54px;object-fit:contain}
.eco-header__nav{display:flex;gap:30px;font-size:13px;font-weight:700}
.eco-header__cta{justify-self:end;font-size:13px;font-weight:700}

.eco-hero{
  position:relative;
  min-height:88vh;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  padding:150px 0 88px;
  background:#0b0b0b;
}

.eco-hero__media{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 78% 30%,rgba(223,23,38,.22),transparent 32%),
    linear-gradient(90deg,rgba(0,0,0,.93) 0%,rgba(0,0,0,.64) 48%,rgba(0,0,0,.28) 100%),
    var(--hero-image,linear-gradient(135deg,#181818,#060606));
  background-size:cover;
  background-position:center;
  transform:scale(1.03);
}

.eco-hero__content{position:relative;z-index:2;max-width:1050px}

.eco-kicker{
  display:block;
  margin-bottom:20px;
  color:#ff4050;
  font-size:11px;
  line-height:1;
  font-weight:800;
  letter-spacing:.18em;
}

.eco-hero h1{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(72px,9vw,152px);
  line-height:.83;
  letter-spacing:-.07em;
}

.eco-hero p{
  max-width:650px;
  margin:32px 0 0;
  color:rgba(255,255,255,.68);
  font-size:18px;
  line-height:1.7;
}

.eco-intro{
  background:var(--eco-paper);
  color:#090909;
  padding:120px 0;
}

.eco-intro__grid{
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:90px;
  align-items:start;
}

.eco-intro h2,
.eco-media h2,
.eco-gallery h2{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(48px,6vw,92px);
  line-height:.92;
  letter-spacing:-.055em;
}

.eco-intro__copy p{
  max-width:780px;
  margin:0 0 22px;
  color:#65615b;
  font-size:17px;
  line-height:1.8;
}

.eco-media{
  padding:120px 0 135px;
  background:#090909;
}

.eco-section-head{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:70px;
  align-items:end;
  margin-bottom:52px;
}

.eco-section-head p{
  max-width:520px;
  justify-self:end;
  margin:0;
  color:rgba(255,255,255,.55);
  line-height:1.75;
}

.eco-media-placeholder{
  position:relative;
  min-height:620px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  border-radius:34px;
  background:
    radial-gradient(circle at 50% 45%,rgba(223,23,38,.18),transparent 30%),
    linear-gradient(135deg,#171717,#080808);
}

.eco-media-placeholder::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.55));
}

.eco-media-placeholder__label{
  position:relative;
  z-index:2;
  text-align:center;
}

.eco-media-placeholder__label strong{
  display:block;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(32px,4vw,62px);
  letter-spacing:-.04em;
}

.eco-media-placeholder__label span{
  display:block;
  margin-top:12px;
  color:rgba(255,255,255,.5);
  font-size:12px;
  font-weight:800;
  letter-spacing:.16em;
}

.eco-gallery{
  padding:120px 0 140px;
  background:var(--eco-paper);
  color:#090909;
}

.eco-gallery .eco-section-head p{color:#706c66}

.eco-gallery-grid{
  display:grid;
  grid-template-columns:1.35fr 1fr 1fr;
  grid-template-rows:320px 320px;
  gap:16px;
}

.eco-photo-placeholder{
  position:relative;
  display:flex;
  align-items:flex-end;
  padding:24px;
  overflow:hidden;
  border-radius:28px;
  background:linear-gradient(135deg,#d5d0c7,#a9a49a);
}

.eco-photo-placeholder:first-child{grid-row:1 / span 2}

.eco-photo-placeholder span{
  font-size:11px;
  font-weight:800;
  letter-spacing:.15em;
}

.eco-cta{
  padding:100px 0 110px;
  background:var(--eco-red);
}

.eco-cta__grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:70px;
  align-items:end;
}

.eco-cta h2{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(48px,6vw,92px);
  line-height:.9;
  letter-spacing:-.055em;
}

.eco-cta p{
  margin:0;
  line-height:1.8;
  color:rgba(255,255,255,.78);
}

.eco-footer{
  padding:28px 0;
  border-top:1px solid rgba(255,255,255,.1);
  background:#080808;
  color:rgba(255,255,255,.48);
  font-size:12px;
}

.eco-footer__grid{display:flex;justify-content:space-between;gap:30px}

.eco-reveal{opacity:0;transform:translateY(34px)}

@media(max-width:900px){
  .eco-shell{width:min(100% - 34px,1460px)}
  .eco-header{height:72px;padding:0 18px;grid-template-columns:1fr auto}
  .eco-header__nav{display:none}
  .eco-header__logo img{width:46px;height:46px}
  .eco-hero{min-height:78vh;padding:130px 0 64px}
  .eco-intro__grid,
  .eco-section-head,
  .eco-cta__grid{grid-template-columns:1fr;gap:30px}
  .eco-section-head p{justify-self:start}
  .eco-gallery-grid{grid-template-columns:1fr 1fr;grid-template-rows:420px 260px 260px}
  .eco-photo-placeholder:first-child{grid-column:1/-1;grid-row:auto}
}

@media(max-width:620px){
  .eco-header__cta{font-size:11px}
  .eco-gallery-grid{grid-template-columns:1fr;grid-template-rows:none}
  .eco-photo-placeholder{min-height:260px}
  .eco-photo-placeholder:first-child{min-height:370px}
  .eco-media-placeholder{min-height:420px}
}
/* PARGET ECOSYSTEM PERFORMANCE PASS */
.eco-header{
  -webkit-backdrop-filter:blur(10px) !important;
  backdrop-filter:blur(10px) !important;
}

@media(max-width:900px), (pointer:coarse){
  .eco-header{
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    background:rgba(7,7,7,.94) !important;
  }
}
