/* sexverhalennl.com — A5 deep forest, wide masthead, F4 bordered partner rows */

@font-face{
  font-family:"Archivo Narrow";
  src:url("/assets/fonts/archivo-narrow.woff2") format("woff2");
  font-weight:400 700;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Archivo Narrow";
  src:url("/assets/fonts/archivo-narrow-ext.woff2") format("woff2");
  font-weight:400 700;font-style:normal;font-display:swap;
  unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"Figtree";
  src:url("/assets/fonts/figtree-latin.woff2") format("woff2");
  font-weight:300 700;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Figtree";
  src:url("/assets/fonts/figtree-latin-ext.woff2") format("woff2");
  font-weight:300 700;font-style:normal;font-display:swap;
  unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --bg:#0f1512;
  --ink:#e8efe9;
  --copper:#c47a3d;
  --copper-strong:#d98a48;
  --copper-soft:rgba(196,122,61,.38);
  --muted:#9fae9f;
  --body:#d2ded4;
  --line:rgba(232,239,233,.16);
  --line-soft:rgba(232,239,233,.07);
  --band:#131c17;
  --panel:#151f19;
  --wrap:1180px;
  --pad:clamp(18px,4vw,32px);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font:400 17px/1.68 Figtree,"Helvetica Neue",Arial,sans-serif;
  font-feature-settings:"kern" 1;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%}
a{color:inherit}
::selection{background:var(--copper);color:#10160f}

.wrap{width:min(var(--wrap),calc(100% - 2 * var(--pad)));margin:0 auto}

.skip{
  position:absolute;left:-9999px;top:0;z-index:20;
  background:var(--copper);color:#10160f;padding:10px 16px;font-weight:600;
}
.skip:focus{left:8px;top:8px}

/* ---------- masthead: wide, copper double rule ---------- */
.mast{
  position:relative;
  border-top:3px solid var(--copper);
  background:linear-gradient(180deg,#121b16 0%,#101814 62%,#0f1512 100%);
}
.mast::before{
  content:"";position:absolute;left:0;right:0;top:7px;height:1px;
  background:var(--copper);opacity:.6;
}
.mast__top{
  display:flex;align-items:center;gap:16px;
  padding:24px 0 14px;
}
.wordmark{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0}
.mark{
  flex:0 0 auto;width:34px;height:34px;display:grid;place-items:center;
  border:1px solid var(--copper);color:var(--copper);
  font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-size:15px;font-weight:700;letter-spacing:.08em;
}
.wordmark__text{
  font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-weight:700;font-size:clamp(20px,2.3vw,29px);line-height:1;
  letter-spacing:.26em;text-transform:uppercase;white-space:nowrap;
}
.mast__kicker{
  margin:0 0 0 6px;padding-left:16px;border-left:1px solid var(--line);
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);
  white-space:nowrap;
}
.cta{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--copper);color:#10160f;text-decoration:none;
  font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-weight:700;font-size:15px;letter-spacing:.14em;text-transform:uppercase;
  padding:15px 26px;border:1px solid var(--copper);
  transition:background-color .18s ease,color .18s ease;
}
.cta:hover,.cta:focus-visible{background:var(--copper-strong);border-color:var(--copper-strong)}
.cta--head{
  margin-left:auto;padding:10px 17px;font-size:12.5px;letter-spacing:.13em;
  background:transparent;color:var(--copper);border-color:var(--copper-soft);
}
.cta--head:hover,.cta--head:focus-visible{background:var(--copper);color:#10160f;border-color:var(--copper)}

.mast__navwrap{border-top:1px solid var(--line-soft)}
.mast__nav ul{
  list-style:none;margin:0;padding:0 0 15px;
  display:flex;flex-wrap:wrap;gap:4px 30px;
}
.mast__nav a{
  display:inline-block;padding:9px 0 3px;text-decoration:none;
  font-size:12.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--muted);border-bottom:2px solid transparent;
}
.mast__nav a:hover{color:var(--ink);border-bottom-color:var(--copper-soft)}
.mast__nav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--copper)}

/* ---------- hero ---------- */
.hero{padding:28px 0 24px}
.hero__meta{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;
  padding-bottom:12px;border-bottom:1px solid var(--line-soft);
  font-size:11px;letter-spacing:.17em;text-transform:uppercase;color:var(--copper);
}
.hero h1{
  font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-weight:700;font-size:clamp(38px,4.9vw,66px);line-height:1.02;
  letter-spacing:-.005em;margin:20px 0 0;max-width:17ch;
}
.hero__foot{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px 34px;
  align-items:end;margin-top:22px;
}
.lede{margin:0;max-width:60ch;font-size:17.5px;line-height:1.62;color:var(--body)}

/* ---------- screenshot band ---------- */
.shotband{
  background:var(--band);
  border-top:1px solid var(--copper-soft);
  border-bottom:1px solid var(--line-soft);
  padding:22px 0;
}
.frame{
  max-width:1000px;margin:0 auto;padding:0;background:#0b120e;
  border:1px solid rgba(196,122,61,.42);
}
.frame__bar{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 18px;
  padding:9px 14px;border-bottom:1px solid rgba(196,122,61,.28);
  font-size:10.5px;letter-spacing:.17em;text-transform:uppercase;color:var(--copper);
}
.frame__tag{color:var(--muted)}
.frame__img{height:clamp(214px,27vw,336px);overflow:hidden;background:#0b120e}
.frame__img img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0}

/* ---------- F4 partner rows ---------- */
.partners{padding:30px 0 6px}
.partners__head{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:6px 18px;margin-bottom:12px;
}
.partners__label{
  margin:0;font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-weight:700;font-size:15px;letter-spacing:.2em;text-transform:uppercase;color:var(--copper);
}
.partners__hint{margin:0;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.plist{list-style:none;margin:0;padding:0;border-top:1px solid rgba(232,239,233,.24)}
.plist li{border-bottom:1px solid rgba(232,239,233,.2)}
.plist a{
  display:flex;align-items:center;gap:20px;min-height:76px;padding:10px 16px;
  text-decoration:none;background:transparent;
  transition:background-color .18s ease,box-shadow .18s ease;
}
.plist a:hover,.plist a:focus-visible{
  background:#17221b;box-shadow:inset 0 -2px 0 var(--copper);
}
.plogo{
  display:flex;align-items:center;flex:0 0 auto;
  width:352px;height:56px;padding:0 12px;background:#e2dac9;
}
.plogo img{display:block;height:36px;width:auto;max-width:100%}
.pidx{
  margin-left:auto;flex:0 0 auto;
  font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-size:12px;letter-spacing:.22em;color:var(--muted);
}

/* ---------- sections ---------- */
.sec{padding:48px 0 4px}
.kicker{
  margin:0 0 10px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--copper);
}
.sec h2,.prose h2{
  font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-weight:700;line-height:1.08;letter-spacing:.005em;
}
.sec h2{font-size:clamp(26px,3.3vw,40px);margin:0}
.sec__rule{position:relative;height:1px;background:var(--line);margin:18px 0 24px}
.sec__rule::before{content:"";position:absolute;left:0;top:0;width:72px;height:1px;background:var(--copper)}
.sec__intro{margin:0 0 6px;max-width:66ch;color:var(--body)}
.sec__body{margin:0 0 16px;max-width:74ch;color:var(--body)}
.sec__note{margin:20px 0 0;max-width:78ch;color:var(--body)}
.sec__note a,.sec__more a{
  color:var(--ink);text-decoration:none;border-bottom:1px solid var(--copper-soft);
}
.sec__note a:hover,.sec__more a:hover{border-bottom-color:var(--copper)}
.sec__more{margin:18px 0 0;font-size:14.5px;letter-spacing:.02em}

.twocol{
  display:grid;grid-template-columns:1fr 1fr;gap:0 56px;
  border-top:1px solid var(--line-soft);padding-top:22px;
}
.twocol p{margin:0 0 18px;color:var(--body)}
.twocol>div+div{border-left:1px solid var(--line-soft);padding-left:28px}

.catindex{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(8,auto);grid-auto-flow:column;gap:0 46px;margin-top:16px;border-top:1px solid var(--line)}
.catindex div{
  display:flex;align-items:baseline;gap:14px;
  padding:11px 0;border-bottom:1px solid var(--line-soft);
}
.catindex b{
  font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-weight:600;font-size:12px;letter-spacing:.14em;color:var(--copper);min-width:24px;
}
.catindex span{font-size:16px}
.catindex small{margin-left:auto;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

.qa{display:grid;gap:18px;margin-top:4px;max-width:78ch}
.qa h3{margin:0 0 3px;font-size:16.5px;font-weight:600;letter-spacing:.01em}
.qa p{margin:0;color:var(--body)}

/* ---------- footer ---------- */
.foot{margin-top:56px;border-top:1px solid var(--line);padding:26px 0 40px}
.foot__row{display:flex;flex-wrap:wrap;gap:16px 34px;align-items:center;justify-content:space-between}
.foot__note{margin:0;max-width:56ch;font-size:13px;line-height:1.6;color:var(--muted)}
.foot__nav{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.foot__nav a{text-decoration:none;color:var(--muted);border-bottom:1px solid transparent}
.foot__nav a:hover{color:var(--ink);border-bottom-color:var(--copper-soft)}

/* ---------- inner pages: one 920px prose column ---------- */
.page{padding:54px 0 8px}
.prose{max-width:920px;margin:0 auto;padding:0 var(--pad)}
.prose h1{
  font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-weight:700;font-size:clamp(34px,4.3vw,54px);line-height:1.04;
  letter-spacing:-.004em;margin:0 0 18px;max-width:20ch;
}
.standfirst{
  margin:0;font-size:19px;line-height:1.6;color:#c5d2c8;
  border-left:2px solid var(--copper);padding-left:18px;max-width:64ch;
}
.rule{position:relative;height:1px;background:var(--line);margin:28px 0 8px}
.rule::before{content:"";position:absolute;left:0;top:0;width:80px;height:1px;background:var(--copper)}
.prose h2{
  font-size:clamp(23px,2.6vw,30px);margin:36px 0 10px;
}
.prose p{margin:0 0 18px;color:var(--body);font-size:18px;line-height:1.74}
.prose .q{margin-top:28px;margin-bottom:6px;font-size:20px}
.prose .q + p{margin-bottom:4px}
.deflist{margin:0 0 24px;padding:0}
.deflist dt{
  font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-weight:700;font-size:17px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--copper);padding-top:12px;
}
.deflist dd{
  margin:3px 0 0;padding-bottom:12px;border-bottom:1px solid var(--line-soft);
  color:var(--body);
}
.linklist{list-style:none;margin:6px 0 0;padding:0}
.linklist li{border-bottom:1px solid var(--line-soft)}
.linklist a{
  display:block;padding:13px 0;text-decoration:none;
  font-family:"Archivo Narrow",Arial Narrow,Arial,sans-serif;
  font-size:18px;letter-spacing:.08em;text-transform:uppercase;
}
.linklist a:hover{color:var(--copper)}
.prose--404 h1{max-width:none}

/* ---------- responsive ---------- */
@media (max-width:880px){
  .mast__kicker{display:none}
  .twocol{grid-template-columns:1fr;gap:0;padding-top:16px}
  .twocol>div+div{border-left:0;padding-left:0}
  .catindex{grid-template-columns:1fr;grid-template-rows:none;grid-auto-flow:row}
  .hero__foot{grid-template-columns:1fr;align-items:start}
  .hero h1{max-width:22ch}
}
@media (max-width:640px){
  body{font-size:16.5px}
  .mast__top{padding:26px 0 12px;gap:10px}
  .mark{width:30px;height:30px;font-size:13px}
  .wordmark__text{letter-spacing:.2em;font-size:19px}
  .cta--head{padding:10px 14px;font-size:11.5px;letter-spacing:.1em}
  .mast__nav ul{display:grid;grid-template-columns:repeat(3,1fr);gap:2px 10px;padding-bottom:12px}
  .mast__nav li{min-width:0}
  .mast__nav a{font-size:11px;letter-spacing:.12em;padding:8px 0 3px}
  .hero{padding:28px 0 24px}
  .hero h1{margin-top:16px}
  .lede{font-size:16.5px}
  .shotband{padding:18px 0}
  .frame__img{height:216px}
  .frame__bar{font-size:9.5px;letter-spacing:.13em;padding:8px 10px}
  .partners{padding:34px 0 4px}
  .plist a{min-height:68px;padding:12px 10px;gap:12px}
  .plogo{width:294px;height:44px;padding:0 10px}
  .plogo img{height:28px}
  .pidx{font-size:11px;letter-spacing:.18em}
  .sec{padding:38px 0 2px}
  .page{padding:38px 0 4px}
  .prose h1{margin-bottom:14px}
  .standfirst{font-size:17px;padding-left:14px}
  .prose h2{margin-top:30px}
  .foot{margin-top:42px}
}