/* ═══ The Rock & The Eagle — nieuwe huisstijl (voorstel) ═══ */
:root {
  --bg:#2b2724; --bg2:#231f1c; --kaart:#38332f; --rand:#57504a;
  --tekst:#e3dcd3; --dim:#a89d90; --goud:#cca062; --goud2:#e6b877;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--bg); color:var(--tekst);
       font-family:'Cormorant Garamond',serif; font-size:19px; line-height:1.8; }
h1,h2,h3 { font-family:'Cinzel',serif; font-weight:500; letter-spacing:1.5px; }
.smal { max-width:660px; margin:0 auto; padding:0 24px; }

/* NAV */
nav { position:fixed; top:0; left:0; right:0; z-index:100;
      display:flex; justify-content:space-between; align-items:center;
      padding:18px 46px; background:rgba(43,39,36,.92);
      border-bottom:1px solid rgba(87,80,74,.5); backdrop-filter:blur(6px); }
nav .logo { font-family:'Cinzel',serif; color:var(--goud); font-size:1.1rem;
            letter-spacing:2.5px; text-transform:uppercase; text-decoration:none; }
nav .links { display:flex; gap:26px; }
nav .links a { color:var(--tekst); text-decoration:none; font-family:'Jost',sans-serif;
               font-size:.82rem; text-transform:uppercase; letter-spacing:1.4px;
               transition:color .3s; }
nav .links a:hover { color:var(--goud2); }
@media (max-width:760px){ nav { padding:14px 20px; } nav .links { gap:14px; }
  nav .links a { font-size:.7rem; } nav .links a.weg { display:none; } }

/* PAGINAKOP */
.paginakop { padding:170px 0 80px; text-align:center; }
.paginakop .eyebrow { font-family:'Jost',sans-serif; text-transform:uppercase;
  letter-spacing:5px; font-size:.78rem; color:var(--goud); }
.paginakop h1 { font-size:clamp(1.9rem,4.6vw,3rem); margin:16px 0 4px; color:#f4ecdf; }
.paginakop .zin { font-size:1.25rem; font-style:italic; color:var(--dim);
  max-width:600px; margin:16px auto 0; }

/* SECTIES */
section { padding:90px 0; }
.sectie-donker { background:var(--bg2); border-top:1px solid var(--rand);
                 border-bottom:1px solid var(--rand); }
.kop { text-align:center; margin-bottom:50px; }
.kop .boven { font-family:'Jost',sans-serif; color:var(--goud); font-size:.78rem;
              letter-spacing:4px; text-transform:uppercase; }
.kop h2 { font-size:1.8rem; margin-top:14px; color:#f1e9dc; }
.divider { width:64px; height:1px; background:var(--goud); margin:22px auto 0;
           position:relative; }
.divider::after { content:'✦'; position:absolute; top:-11px; left:50%;
  transform:translateX(-50%); color:var(--goud); font-size:12px; padding:0 8px; }

/* KNOPPEN */
.btn { display:inline-block; font-family:'Jost',sans-serif; text-transform:uppercase;
  letter-spacing:2.5px; font-size:.85rem; padding:17px 42px; text-decoration:none;
  color:#1d1916; background:linear-gradient(135deg,var(--goud2),var(--goud));
  border:none; box-shadow:0 6px 34px rgba(204,160,98,.45); cursor:pointer;
  transition:transform .25s, box-shadow .25s; }
.btn:hover { transform:translateY(-2px); box-shadow:0 10px 44px rgba(230,184,119,.6); }
.link { font-family:'Jost',sans-serif; font-size:.82rem; letter-spacing:2px;
  text-transform:uppercase; color:var(--goud); text-decoration:none;
  border-bottom:1px solid var(--goud); padding-bottom:3px; }
.link:hover { color:var(--goud2); }

/* KAARTEN / BLOKKEN */
.blok { background:var(--kaart); border:1px solid var(--rand);
  padding:44px 40px; box-shadow:0 22px 60px rgba(0,0,0,.4); }
.blok p { margin-bottom:1em; }
@media (max-width:640px){ .blok { padding:34px 24px; } }
.citaten { text-align:center; font-style:italic;
  font-size:clamp(1.4rem,3.2vw,1.9rem); line-height:1.8; color:#f4ecdf; }
.toel { color:var(--dim); max-width:560px; margin:26px auto 0;
  font-size:1.05rem; text-align:center; }

/* RASTER */
.raster { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:26px; }
.rkaart { background:var(--kaart); border:1px solid var(--rand); padding:30px 26px;
  transition:border-color .3s, transform .3s; }
.rkaart:hover { border-color:var(--goud); transform:translateY(-3px); }
.rkaart .rn { font-family:'Cinzel',serif; color:var(--goud); font-size:1.2rem; }
.rkaart h3 { font-size:1rem; margin:10px 0 8px; color:#f1e9dc; letter-spacing:1px; }
.rkaart p { color:var(--dim); font-size:.98rem; line-height:1.7; }
.rkaart img { width:100%; height:auto; filter:sepia(.3) brightness(.9);
  margin-bottom:14px; }

/* FORMULIER */
form { display:grid; gap:20px; }
label { display:block; font-family:'Jost',sans-serif; font-size:.72rem;
  letter-spacing:2px; text-transform:uppercase; color:var(--dim); margin-bottom:8px; }
input, textarea, select { width:100%; background:var(--bg); border:1px solid var(--rand);
  color:var(--tekst); padding:14px 15px; font-family:'Cormorant Garamond',serif;
  font-size:1.05rem; transition:border-color .3s; }
input:focus, textarea:focus { outline:none; border-color:var(--goud); }
.verzend { text-align:center; margin-top:10px; }

footer { padding:64px 0 46px; text-align:center; color:var(--dim);
  font-family:'Jost',sans-serif; font-size:.82rem; letter-spacing:1px;
  border-top:1px solid var(--rand); }
footer .verdieping a { color:var(--dim); text-decoration:none; margin:0 11px;
  text-transform:uppercase; font-size:.75rem; letter-spacing:2px; }
footer .verdieping a:hover { color:var(--goud2); }
footer .motto { margin-top:22px; font-family:'Cormorant Garamond',serif;
  font-style:italic; font-size:1.05rem; color:var(--goud); }