/* Entre islas — campagnepagina. Eigen kleur en letter; kop en voet van de site kleuren mee. */
/* De clubletter wordt alleen gebruikt als die op het apparaat staat; anders Barlow Condensed. */
@font-face{font-family:"UDLasPalmas";font-weight:700;src:local("ZYXTZZ+UDLasPalmas-Bold"),local("UDLasPalmas-Bold"),local("UD Las Palmas Bold")}
html:has(.ei){--bg:#0B0A09;--fg:#F1EEE8;--dim:rgba(241,238,232,.55);--lijn:rgba(210,164,88,.22);--vlak:#211A14;--inv:1;
  --ei-zwart:#0B0A09;--ei-bruin:#211A14;--ei-brons:#A77235;--ei-goud:#D2A458;--ei-zand:#D7C4A0;--ei-wit:#F1EEE8;
  --ei-kop:"UDLasPalmas","Barlow Condensed","Arial Narrow",sans-serif;--ei-citaat:"Playfair Display",Georgia,serif;
  --aurora:linear-gradient(90deg,#A77235,#D2A458,#D7C4A0,#D2A458,#A77235)}
html:has(.ei) .thema{display:none}
.ei{background:var(--ei-zwart);color:var(--ei-wit);overflow:hidden}
.ei-rand{padding-left:var(--rand);padding-right:var(--rand)}
.ei-label{font-family:var(--label);font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--ei-brons);display:block}
.ei-label--fg{color:var(--ei-goud)}
.ei-kop{font-family:var(--ei-kop);font-weight:700;text-transform:uppercase;letter-spacing:.01em;line-height:.95;font-size:clamp(38px,5.6vw,92px);color:var(--ei-goud);margin:18px 0 28px;text-wrap:balance}
.ei-kop--xl{font-size:clamp(64px,15vw,260px);line-height:.85;margin:28px 0 0}
.ei-kop--smal{max-width:16ch}
.ei-kop--m{font-size:clamp(26px,2.6vw,40px);margin:10px 0 10px}
.ei-lees{max-width:54ch;font-size:17px;line-height:1.7;color:rgba(241,238,232,.86)}
.ei-lees p+p{margin-top:1em}
.ei-lees--kolommen{max-width:none;columns:2;column-gap:48px}
.ei-lees--kolommen p{break-inside:avoid}
.ei-sectie{padding-top:clamp(64px,9vw,140px);padding-bottom:clamp(64px,9vw,140px)}

/* taal: een eigen balk direct onder de kop van de site, die meeschuift */
.ei-taalbalk{position:sticky;top:var(--ei-balk,61px);z-index:19;display:flex;justify-content:center;padding:10px var(--rand);background:var(--ei-zwart);border-bottom:1px solid var(--lijn)}
.ei-taal{display:flex;gap:8px}
.ei-taal a{font-family:var(--label);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--ei-zand);padding:11px 22px;border:1px solid var(--lijn);transition:background .25s,color .25s,border-color .25s}
.ei-taal a:hover,.ei-taal a:focus-visible{border-color:var(--ei-goud);color:var(--ei-goud)}
.ei-taal a[aria-current]{background:var(--ei-goud);border-color:var(--ei-goud);color:var(--ei-zwart);font-weight:500}
.ei-taal__kort{display:none}
@media (max-width:520px){.ei-taal{width:100%}.ei-taal a{flex:1;text-align:center;padding:11px 0}.ei-taal__lang{display:none}.ei-taal__kort{display:inline}}

/* film */
.ei-film{position:relative;background:#000}
.ei-film__video{display:block;width:100%;aspect-ratio:16/9;max-height:calc(100vh - 124px);object-fit:cover;background:#000}
.ei-film__onder{position:absolute;left:var(--rand);right:var(--rand);bottom:24px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.ei-film__onder .ei-label{color:var(--ei-wit);text-shadow:0 1px 8px rgba(0,0,0,.5)}
.ei-knop{display:inline-block;font-family:var(--label);font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--ei-goud);border:1px solid var(--ei-goud);background:rgba(11,10,9,.35);backdrop-filter:blur(6px);padding:12px 18px;cursor:pointer;transition:background .25s,color .25s}
.ei-knop:hover,.ei-knop:focus-visible{background:var(--ei-goud);color:var(--ei-zwart)}

/* titel */
.ei-titel{padding-top:clamp(40px,6vw,88px);padding-bottom:clamp(48px,7vw,110px);border-bottom:1px solid var(--lijn)}
.ei-titel__boven{display:flex;justify-content:space-between;align-items:center;gap:16px}
.ei-motto{font-family:var(--ei-citaat);font-style:italic;font-weight:700;font-size:clamp(22px,3.4vw,52px);line-height:1.15;color:var(--ei-zand);margin-top:clamp(16px,2vw,28px)}
.ei-motto__nl{margin-top:16px}

/* tekst naast beeld */
.ei-twee{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.72fr);gap:clamp(32px,6vw,96px);align-items:center}
.ei-twee--om .ei-twee__tekst{order:2}
.ei-twee--om{grid-template-columns:minmax(0,.72fr) minmax(0,1fr)}
.ei-beeld img{width:100%;height:auto}
.ei-beeld--portret img{aspect-ratio:4/5;object-fit:cover}
.ei-breed img{width:100%;height:auto;max-height:92vh;object-fit:cover}

.ei-citaat{font-family:var(--ei-citaat);font-style:italic;font-weight:700;font-size:clamp(24px,3.6vw,56px);line-height:1.2;color:var(--ei-zand);text-align:center;padding-top:clamp(56px,8vw,120px);padding-bottom:clamp(56px,8vw,120px);text-wrap:balance}

/* lucht, land, zee */
.ei-elementen{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:clamp(40px,6vw,88px);border-top:1px solid var(--lijn)}
.ei-elementen li{padding:28px 28px 0 0}
.ei-elementen li+li{padding-left:28px;border-left:1px solid var(--lijn)}
.ei-elementen p{color:rgba(241,238,232,.78);max-width:34ch}

/* het shirt op licht */
.ei-licht{background:#F4F2EE;color:var(--ei-zwart)}
.ei-shirt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:clamp(24px,5vw,80px);align-items:center;padding-top:clamp(40px,6vw,88px);padding-bottom:clamp(40px,6vw,88px)}
.ei-shirt__beeld img{width:100%;height:auto;mix-blend-mode:multiply}
.ei-licht .ei-kop{color:var(--ei-zwart)}
.ei-licht .ei-lees{color:rgba(11,10,9,.8)}
.ei-lijst{list-style:none;margin-top:32px;border-top:1px solid rgba(11,10,9,.16)}
.ei-lijst li{display:grid;grid-template-columns:44px 1fr;padding:12px 0;border-bottom:1px solid rgba(11,10,9,.16);font-size:15px}
.ei-lijst span{font-family:var(--label);font-size:10px;letter-spacing:.2em;color:var(--ei-brons);padding-top:5px}

/* kleuren en details */
.ei-kleuren{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.ei-kleur{display:block;aspect-ratio:1/1.15;border:1px solid var(--lijn);margin-bottom:16px}
.ei-kleuren .ei-label+.ei-label{margin-top:6px}
.ei-kleuren p{font-size:13px;line-height:1.5;color:rgba(241,238,232,.7);margin-top:12px}
.ei-details{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:clamp(48px,7vw,110px)}
.ei-details img{width:100%;aspect-ratio:4/5;object-fit:cover}
.ei-details figcaption{padding-top:16px;max-width:44ch}
.ei-details p{font-size:14px;color:rgba(241,238,232,.75);margin-top:8px}

/* campagne: stroken die je opzij schuift */
.ei-strookkop{display:flex;justify-content:space-between;margin-top:clamp(48px,6vw,88px);padding-bottom:16px}
.ei-strook{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 var(--rand);scroll-padding:0 var(--rand)}
.ei-strook::-webkit-scrollbar{display:none}
.ei-strook figure{flex:0 0 min(400px,72vw);scroll-snap-align:start;overflow:hidden}
.ei-strook--breed figure{flex-basis:min(860px,84vw)}
.ei-strook img{width:100%;height:100%;object-fit:cover;aspect-ratio:9/16;transition:transform .8s cubic-bezier(.2,0,.1,1)}
.ei-strook--breed img{aspect-ratio:16/9}
.ei-strook figure:hover img{transform:scale(1.03)}

/* slot */
.ei-slot{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);border-top:1px solid var(--lijn)}
.ei-slot .ei-kop{margin-top:0}
.ei-knoppen{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.ei-sig{height:44px;width:auto;filter:invert(1) sepia(1) saturate(1.6) hue-rotate(-12deg) brightness(.82);margin-top:44px}
.ei-klein{font-size:12px;color:rgba(241,238,232,.45);max-width:52ch;margin-top:20px}

/* verschijnen */
.ei-op{opacity:0;transform:translateY(24px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,0,.1,1)}
.ei-op.is-op,.ei-zonder-js .ei-op{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.ei-op{opacity:1;transform:none;transition:none}.ei-strook img{transition:none}}

@media (max-width:900px){
  .ei-twee,.ei-twee--om,.ei-shirt,.ei-slot{grid-template-columns:1fr}
  .ei-twee--om .ei-twee__tekst{order:0}
  .ei-lees--kolommen{columns:1}
  .ei-elementen{grid-template-columns:1fr}
  .ei-elementen li,.ei-elementen li+li{padding:24px 0 0;border-left:0}
  .ei-elementen li+li{border-top:1px solid var(--lijn);margin-top:24px}
  .ei-kleuren{grid-template-columns:repeat(2,1fr)}
  .ei-details{grid-template-columns:1fr}
  .ei-film__video{aspect-ratio:16/9;max-height:none}
  .ei-film__onder{bottom:12px}
  .ei-film__onder .ei-label{display:none}
  .ei-knop{padding:10px 12px}
}