/* =========================================================
   FESTIVAL — 1980 x 5393
   hero 0-1020 | why 1020-2100 | mission 2100-3060
   more 3060-4020 | argentina 4020-4969 | footer 4969-5393
   ========================================================= */

body{ background:#010101 url("img2/festival-bg.png") top center / 100% 539.3rem no-repeat; }

/* ---------------------------------------------------------
   1. HERO   0 – 1020
   --------------------------------------------------------- */

.hero{ height:102rem; overflow:hidden; }

.hero__bg{
  position:absolute; inset:0;
  background:url("img2/Group%203.png") 0 0 / 197.8rem 102rem no-repeat;
}
.hero__wm{
  position:absolute; left:83.2rem; top:18rem; width:35rem; height:24rem;
  background:url("img2/34.png") center / contain no-repeat;
  opacity:.10;
}
.hero__veil{
  position:absolute; inset:0;
  background:linear-gradient(to bottom, rgba(10,10,9,0) 74%, rgba(10,10,9,.5) 90%, #0a0a09 100%);
}

.hero__eyebrow{
  position:absolute; left:0; right:0; top:40.24rem;
  text-align:center;
  font-size:1.5rem; font-weight:500; letter-spacing:.2em; line-height:1;
  color:var(--gold);
  z-index:3;
}
.hero__title{
  position:absolute; left:0; right:0; top:43.98rem;
  text-align:center;
  font-family:var(--serif);
  font-optical-sizing:none;
  font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 1;
  font-weight:700;
  font-size:12.5rem; line-height:15.9rem; letter-spacing:-.0145em; word-spacing:-.076em;
  color:#efebe3;
  z-index:3;
}
.hero__c1,.hero__c2{
  position:absolute; top:85.5rem;
  font-size:2.03rem; font-weight:300; line-height:2.74rem;
  color:#8d8b86;
  z-index:3;
}
.hero__c1{ left:36.8rem; }
.hero__c2{ left:109.6rem; }

.hero__scroll{
  position:absolute; left:186.5rem; top:49.2rem;
  font-size:1.1rem; letter-spacing:.28em; font-weight:400;
  color:rgba(239,235,227,.30);
  z-index:3;
}
.hero__scroll::before{
  content:""; position:absolute; left:50%; top:-3.4rem;
  width:1px; height:2.6rem; background:rgba(239,235,227,.22);
}

/* ---------------------------------------------------------
   2. WHY PARALELO 34   1020 – 2100
   --------------------------------------------------------- */

.s-why{ height:108rem; }
.s-why__wm{
  position:absolute; left:102.4rem; top:21.4rem; width:88.7rem; height:60.7rem;
  background:url("img2/34.png") center / 100% 100% no-repeat;
  opacity:.042;
  pointer-events:none;
}
.s-why__lbl{ left:4.1rem; top:20.25rem; font-size:1.056rem; letter-spacing:.2em; }

.s-why__coord{
  position:absolute; left:4.1rem; top:28.2rem;
  font-size:.93rem; font-weight:400; letter-spacing:.2em; line-height:1;
  color:var(--gold);
}
.s-why__places{
  position:absolute;
  font-size:.9rem; font-weight:400; letter-spacing:.2em; line-height:1;
  color:rgba(239,235,227,.30);
  white-space:nowrap;
}
.s-why__places--a{ left:112.1rem; top:28.1rem; }
.s-why__places--b{ left:108.2rem; top:71.7rem; }

.s-why__rule{ position:absolute; height:1px; }
.s-why__rule--a{
  left:12.3rem; width:96.2rem; top:28.5rem;
  background:linear-gradient(to right,
    rgba(199,168,110,.45) 0%,  rgba(199,168,110,.40) 12%,
    rgba(199,168,110,.30) 25%, rgba(199,168,110,.21) 37%,
    rgba(199,168,110,.11) 50%, rgba(199,168,110,.08) 62%,
    rgba(199,168,110,.06) 74%, rgba(199,168,110,.037) 87%,
    rgba(199,168,110,0)   100%);
}
.s-why__rule--b{ display:none; }
.s-why__rule--c{
  left:30rem; width:76.5rem; top:71.5rem;
  background:linear-gradient(to right, rgba(239,235,227,0) 0%, rgba(239,235,227,.09) 70%, rgba(239,235,227,.11) 100%);
}
.s-why__rule--d{ display:none; }

.s-why__h2{
  position:absolute; left:8rem; top:36.45rem;
  font-family:var(--serif);
  font-optical-sizing:none;
  font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 1;
  font-weight:700;
  font-size:15.6rem; line-height:13.4rem; letter-spacing:-.012em;
  color:var(--cream);
}
.s-why__h2 span{ color:var(--gold); }

.s-why__p1,.s-why__p2,.s-why__p3{
  position:absolute; left:80.1rem;
  font-size:1.623rem; font-weight:300; line-height:2.78rem;
  color:#8d8b86;
}
.s-why__p1{ top:37.2rem; }
.s-why__p2{ top:45.3rem; }
.s-why__p3{ top:50.5rem; }

/* ---------------------------------------------------------
   3. OUR MISSION   2100 – 3060
   --------------------------------------------------------- */

.s-mis{ height:96rem; }
.s-mis__lbl{ left:4.1rem; top:10rem; font-size:1.045rem; letter-spacing:.2em; }

.s-mis__bar{
  position:absolute; left:4.1rem; top:17.5rem;
  width:.3rem; height:26.9rem;
  background:rgba(199,168,110,.55);
}
.s-mis__quote{
  position:absolute; left:8.4rem; top:17.4rem;
  font-family:var(--serif);
  font-optical-sizing:none;
  font-variation-settings:"opsz" 64,"SOFT" 0,"WONK" 1;
  font-style:italic; font-weight:300;
  font-size:5.87rem; line-height:6.8rem; letter-spacing:0;
  color:var(--cream);
}
.s-mis__p{
  position:absolute; left:4.1rem; top:50.7rem;
  font-size:1.62rem; font-weight:300; line-height:2.75rem;
  color:#8d8b86;
}
.s-mis__list{ position:absolute; left:55.3rem; top:51.1rem; }
.s-mis__list li{
  position:relative;
  height:3.7rem;
  font-size:1.6rem; font-weight:300; line-height:1;
  color:var(--cream);
  white-space:nowrap;
}
.s-mis__list i{
  display:inline-block; width:2.5rem;
  font-style:normal;
  font-size:1.05rem; letter-spacing:.1em;
  color:var(--gold);
  vertical-align:.25rem;
}
.s-mis__img{
  position:absolute; left:118.3rem; top:10.8rem;
  width:75.6rem; height:77.7rem;
  background:url("img2/Group%2048.png") center / 100% 100% no-repeat;
}

/* ---------------------------------------------------------
   4. MORE THAN AN ANNUAL EVENT   3060 – 4020
   --------------------------------------------------------- */

.s-more{ height:96rem; }
.s-more__lbl{ left:4.1rem; top:12.82rem; font-size:1.043rem; letter-spacing:.2em; }

.s-more__h2{
  position:absolute; left:4.2rem; top:16.82rem;
  font-family:var(--serif);
  font-optical-sizing:none;
  font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 1;
  font-weight:700;
  font-size:8.6rem; line-height:7.8rem; letter-spacing:-.0095em;
  color:var(--cream);
}
.s-more__c1,.s-more__c2{
  position:absolute; top:21.46rem;
  font-size:1.626rem; font-weight:300; line-height:2.8rem;
  color:#8d8b86;
}
.s-more__c1{ left:74.1rem; }
.s-more__c2{ left:146.4rem; }

.tl{ position:absolute; left:0; top:0; width:100%; }
.tl__row{
  position:absolute; left:4.1rem; width:135.9rem;
  border-top:1px solid rgba(239,235,227,.075);
}
.tl__row--1{ top:42.5rem; height:12.5rem; }
.tl__row--2{ top:55rem;   height:12.5rem; }
.tl__row--3{ top:67.5rem; height:12.5rem; border-bottom:1px solid rgba(239,235,227,.075); }

.tl__n{
  position:absolute; left:0; top:5.75rem;
  font-style:normal; font-size:1.02rem; font-weight:400; letter-spacing:.08em; line-height:1;
  color:rgba(239,235,227,.17);
}
.tl__k{
  position:absolute; left:12rem; top:5.75rem;
  font-style:normal; font-size:1.02rem; font-weight:400; letter-spacing:.2em; line-height:1;
  color:var(--gold);
}
.tl__name{
  position:absolute; left:30.9rem; top:4.65rem;
  font-family:var(--serif);
  font-optical-sizing:none;
  font-variation-settings:"opsz" 88,"SOFT" 0,"WONK" 1;
  font-style:italic; font-weight:400;
  font-size:3.5rem; line-height:1;
  color:var(--cream);
}
.tl__desc{
  position:absolute; right:0; top:4.15rem;
  text-align:right;
  font-size:1.317rem; font-weight:300; line-height:2.2rem;
  color:#7b7975;
}

/* ---------------------------------------------------------
   5. ARGENTINA → THE WORLD   4020 – 4969
   --------------------------------------------------------- */

.s-arg{ height:94.9rem; }
.s-arg__bg{
  position:absolute; left:0; top:4.1rem; width:198rem; height:89.5rem;
  background:url("img2/Container.png") center top / 198rem 89.5rem no-repeat;
}
.s-arg__bg::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to bottom,
    rgba(10,10,9,.542) 0%,  rgba(10,10,9,.456) 22%, rgba(10,10,9,.405) 39%,
    rgba(10,10,9,.531) 50%, rgba(10,10,9,.698) 62%, rgba(10,10,9,.763) 67%,
    rgba(10,10,9,.838) 73%, rgba(10,10,9,.882) 78%, rgba(10,10,9,.904) 85%,
    rgba(10,10,9,.925) 90%, rgba(10,10,9,.952) 100%);
}
.s-arg__lbl{ left:7.1rem; top:19.75rem; font-size:1.05rem; letter-spacing:.2em; color:var(--gold); }

.s-arg__p{
  position:absolute; left:7.1rem; top:25.9rem;
  font-size:1.519rem; font-weight:300; line-height:2.75rem;
  color:rgba(239,235,227,.72);
}
.s-arg__h2{
  position:absolute; left:7.2rem; top:37.9rem;
  font-family:var(--serif);
  font-optical-sizing:none;
  font-variation-settings:"opsz" 88,"SOFT" 0,"WONK" 1;
  font-weight:700;
  font-size:11.55rem; line-height:12.8rem; letter-spacing:0;
  color:#efebe3;
}
.s-arg__arrow{
  position:absolute; left:79.2rem; top:44.75rem;
  width:8.1rem; height:2.6rem;
  background:
    linear-gradient(to right, var(--gold), var(--gold)) left 50% / 100% 1px no-repeat,
    linear-gradient(to right, var(--gold), var(--gold)) right 50% / 1.6rem 1px no-repeat;
}
.s-arg__arrow::after{
  content:""; position:absolute; right:0; top:50%;
  width:1.3rem; height:1.3rem;
  border-top:1px solid var(--gold); border-right:1px solid var(--gold);
  transform:translateY(-50%) rotate(45deg); transform-origin:60% 40%;
}
.s-arg__rule{
  position:absolute; left:7rem; width:76.3rem; top:67.3rem;
  height:1px; background:rgba(239,235,227,.30);
}
.s-arg__tag{
  position:absolute; left:7.2rem; top:72.85rem;
  font-family:var(--serif);
  font-optical-sizing:none;
  font-variation-settings:"opsz" 64,"SOFT" 0,"WONK" 1;
  font-style:italic; font-weight:300;
  font-size:5.2rem; line-height:1;
  color:rgba(239,235,227,.86);
}
