/* ─────────────────────────────────────────────
   CONFIG: change APP_URL to point to your app
   ───────────────────────────────────────────── */
/*
  All "Start free trial" and "Sign in" buttons use plain  links.
  Set your app URL once here via the JS constant at the bottom.
  No onclick handlers = no platform can inject or break anything.
*/


/* ── EGYPTISCHE DECORATIEVE ELEMENTEN ── */

/* Hieroglief strip — subtiele verdelers */
.egyp-strip{
  display:flex;align-items:center;justify-content:center;
  gap:1.8rem;padding:0.8rem 0;margin:0;
  overflow:hidden;
}
.egyp-strip span{
  font-size:1.1rem;opacity:0.13;color:var(--gold);
  font-family:serif;line-height:1;
  user-select:none;pointer-events:none;
}
.egyp-strip::before,
.egyp-strip::after{
  content:'';flex:1;height:1px;
  background:linear-gradient(90deg,transparent,rgba(180,138,62,0.3),transparent);
}

/* Papyrus sectie achtergrond */
.papyrus-bg{
  position:relative;
}
.papyrus-bg::before{
  content:'';
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:
    radial-gradient(ellipse 60% 40% at 15% 30%,rgba(201,150,58,0.04) 0%,transparent 70%),
    radial-gradient(ellipse 50% 60% at 85% 70%,rgba(201,150,58,0.03) 0%,transparent 70%);
}
.papyrus-bg > *{position:relative;z-index:1;}

/* Ma'at veer watermerk — grote achtergrond */
.maat-watermark{
  position:absolute;
  opacity:0.028;
  pointer-events:none;
  z-index:0;
}

/* Ankh icoon accent */
.ankh-accent{
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;
  border-radius:50%;
  background:var(--gold-dim);
  border:1px solid var(--gold-border);
  color:var(--gold);
  font-size:0.75rem;
  flex-shrink:0;
}

/* Section nummer glyph stijl */
.glyph-num{
  font-family:var(--display);
  font-size:0.48rem;
  letter-spacing:0.35em;
  text-transform:uppercase;
  color:var(--gold);
  opacity:0.45;
  display:block;
  margin-bottom:0.5rem;
}

/* Border versiering — horizontale gouden lijn met middenpunt */
.egyp-divider{
  display:flex;align-items:center;gap:1rem;
  margin:0 auto;max-width:280px;
  padding:0.2rem 0;
}
.egyp-divider::before,
.egyp-divider::after{
  content:'';flex:1;height:1px;
  background:linear-gradient(90deg,transparent,rgba(180,138,62,0.4));
}
.egyp-divider::after{
  background:linear-gradient(90deg,rgba(180,138,62,0.4),transparent);
}
.egyp-divider-dot{
  width:5px;height:5px;border-radius:50%;
  background:var(--gold);opacity:0.5;
  flex-shrink:0;
}


/* ── HIEROGLIEF ACHTERGROND DECORATIE ── */
.egyp-bg-glyphs{
  position:absolute;inset:0;
  pointer-events:none;z-index:0;
  overflow:hidden;
}
.egyp-bg-glyphs span{
  position:absolute;
  font-family:serif;
  color:var(--gold);
  opacity:0.055;
  user-select:none;
  line-height:1;
  font-weight:400;
}
.egyp-float{
  position:relative;overflow:hidden;
}
.egyp-float > *:not(.egyp-bg-glyphs){
  position:relative;z-index:1;
}

/* Hero grote hieroglief achtergrond */
.hero-glyphs span{font-size:clamp(1.8rem,4vw,3.5rem);opacity:0.045;}
/* Sectie kleine glyphs */
.section-glyphs span{font-size:clamp(1.2rem,2.5vw,2.2rem);opacity:0.05;}
/* Pricing glyphs */
.pricing-glyphs span{font-size:clamp(1.5rem,3vw,2.8rem);opacity:0.04;}



/* ── PRICING GRID — 4 gelijke tiles ── */
#pricing .agents-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1rem;
  align-items:stretch;
  margin-top:3rem;
}
@media(max-width:1100px){#pricing .agents-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:580px){#pricing .agents-grid{grid-template-columns:1fr;}}
#pricing .agent-card{
  display:flex;flex-direction:column;
  padding:22px 18px;height:100%;
  box-sizing:border-box;border-width:1px!important;
}
#pricing .agent-card.featured{padding:22px 18px;}
#pricing .agent-feats{flex:1;margin:0.7rem 0;}
#pricing .agent-price{margin-top:auto;padding-top:0.7rem;}
#pricing .agent-cta{margin-top:0.7rem;display:block;text-align:center;width:100%;box-sizing:border-box;}
#pricing .agent-num{font-size:1.6rem;}
#pricing .agent-desc{font-size:0.82rem;}
#pricing .agent-name{font-size:1.15rem;}
@media(max-width:1100px){
}
@media(max-width:580px){
}

@media(max-width:1100px){
}
@media(max-width:640px){
}
#pricing .agent-card{min-height:0;border-width:1px !important;}


/* ── APP KEUZE MODAL ── */
.app-modal-overlay{
  position:fixed;inset:0;z-index:9000;
  background:rgba(14,10,6,0.72);
  backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity 0.25s ease;
  padding:1.5rem;
}
.app-modal-overlay.open{opacity:1;pointer-events:all;}
.app-modal{
  background:var(--bg);
  border:1px solid var(--gold-border);
  border-radius:16px;
  padding:2.5rem 2rem 2rem;
  max-width:560px;width:100%;
  position:relative;
  box-shadow:0 32px 80px rgba(14,10,6,0.22);
}
.app-modal-close{
  position:absolute;top:1rem;right:1rem;
  width:32px;height:32px;border-radius:50%;
  border:1px solid var(--gold-border);
  background:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  color:var(--text-muted);font-size:1.1rem;
  transition:all 0.2s;
}
.app-modal-close:hover{background:var(--gold-dim);color:var(--text);}
.app-modal-eyebrow{
  font-family:var(--display);font-size:0.50rem;
  letter-spacing:0.28em;text-transform:uppercase;
  color:var(--gold);opacity:0.65;margin-bottom:1rem;
}
.app-modal-title{
  font-family:var(--serif);font-size:clamp(1.4rem,3vw,1.9rem);
  font-weight:300;letter-spacing:-0.02em;
  color:rgba(14,10,6,0.92);margin-bottom:0.5rem;line-height:1.15;
}
.app-modal-sub{
  font-family:var(--body);font-size:0.88rem;
  color:var(--text-secondary);line-height:1.7;margin-bottom:2rem;
}
.app-choices{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
@media(max-width:480px){.app-choices{grid-template-columns:1fr;}}
.app-choice{
  display:flex;flex-direction:column;gap:0.6rem;
  padding:1.5rem;border-radius:12px;
  border:1px solid var(--card-border);
  background:var(--card-bg);
  text-decoration:none;
  transition:all 0.2s;cursor:pointer;
}
.app-choice:hover{
  border-color:var(--gold-border);
  background:var(--card-bg-hov);
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(201,150,58,0.08);
}
.app-choice-icon{
  width:40px;height:40px;border-radius:10px;
  background:var(--gold-dim);border:1px solid var(--gold-border);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);margin-bottom:0.4rem;
}
.app-choice-name{
  font-family:var(--serif);font-size:1.05rem;font-weight:300;
  color:rgba(14,10,6,0.92);letter-spacing:-0.01em;
}
.app-choice-desc{
  font-family:var(--body);font-size:0.80rem;
  color:var(--text-secondary);line-height:1.6;
}
.app-choice-tag{
  font-family:var(--display);font-size:0.48rem;
  letter-spacing:0.2em;text-transform:uppercase;
  color:var(--gold);opacity:0.65;margin-top:auto;padding-top:0.5rem;
}



/* ── PRICING SECTIE ── */
.pricing-section{padding:6rem 6vw;background:var(--bg);}
.pr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:3.5rem;align-items:start;}
@media(max-width:1080px){.pr-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.pr-grid{grid-template-columns:1fr;}}
.pr-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:28px 22px;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:border-color 0.2s,box-shadow 0.2s;}
.pr-card:hover{border-color:rgba(180,138,62,0.45);box-shadow:0 8px 32px rgba(201,150,58,0.07);}
.pr-card::after{content:'';position:absolute;top:10px;right:10px;width:13px;height:13px;border-top:1px solid rgba(180,138,62,0.28);border-right:1px solid rgba(180,138,62,0.28);}
.pr-featured{border-color:var(--gold-border);background:var(--card-bg-hov);}
.pr-addon{border-color:rgba(180,138,62,0.18);background:rgba(245,237,212,0.40);}
.pr-popular-badge{position:absolute;top:0;left:0;right:0;text-align:center;font-family:var(--display);font-size:0.46rem;letter-spacing:0.22em;text-transform:uppercase;color:rgba(14,10,6,0.88);background:var(--gold);padding:5px 0;}
.pr-badge{font-family:var(--display);font-size:0.46rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);opacity:0.65;margin-top:1.8rem;margin-bottom:0.5rem;}
.pr-featured .pr-badge{margin-top:2.2rem;}
.pr-name{font-family:var(--serif);font-size:1.4rem;font-weight:300;letter-spacing:-0.02em;color:rgba(14,10,6,0.92);margin-bottom:0.6rem;}
.pr-desc{font-family:var(--body);font-size:0.82rem;line-height:1.72;color:var(--text-secondary);margin-bottom:1.1rem;}
.pr-feats{list-style:none;display:flex;flex-direction:column;gap:0.4rem;margin-bottom:1.4rem;flex:1;}
.pr-feat{font-family:var(--body);font-size:0.80rem;color:var(--text-secondary);display:flex;align-items:center;gap:0.5rem;line-height:1.4;}
.pr-feat.yes::before{content:'';width:14px;height:14px;flex-shrink:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 14 14' fill='none' stroke='%23c9963a' stroke-width='1.4' stroke-linecap='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='2,7 5.5,10.5 12,3'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;}
.pr-feat.no{color:rgba(60,42,15,0.32);}
.pr-feat.no::before{content:'';width:14px;height:14px;flex-shrink:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 14 14' fill='none' stroke='%23b08840' stroke-width='1.2' stroke-linecap='round' opacity='.3' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='4' y1='4' x2='10' y2='10'/%3E%3Cline x1='10' y1='4' x2='4' y2='10'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;opacity:0.5;}
.pr-price{font-family:var(--serif);font-size:1.55rem;font-weight:300;letter-spacing:-0.02em;color:rgba(14,10,6,0.92);margin-bottom:0.9rem;margin-top:auto;padding-top:0.7rem;}
.pr-price span{font-family:var(--display);font-size:0.50rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--text-muted);vertical-align:middle;margin-left:3px;}
.pr-cta{display:block;text-align:center;font-family:var(--display);font-size:0.52rem;letter-spacing:0.18em;text-transform:uppercase;padding:12px 20px;border-radius:8px;border:1px solid var(--gold-border);color:var(--gold);text-decoration:none;transition:all 0.2s;}
.pr-cta:hover{background:var(--gold-dim);border-color:var(--gold);}
.pr-cta-gold{background:var(--gold);color:rgba(14,10,6,0.92);border-color:transparent;}
.pr-cta-gold:hover{background:#b07828;color:#fff;}

/* ── ABOUT SECTIE ── */
.about-section{padding:6rem 6vw;background:var(--bg2);position:relative;overflow:hidden;}
.about-inner{max-width:1200px;margin:0 auto;}
.about-content{display:grid;grid-template-columns:1fr 1fr;gap:4rem;margin-top:2.5rem;align-items:start;}
@media(max-width:820px){.about-content{grid-template-columns:1fr;gap:2.5rem;}}
.about-body{font-family:var(--body);font-size:0.92rem;line-height:1.85;color:rgba(40,28,10,0.80);margin-bottom:1.1rem;}
.about-pillars{display:flex;flex-direction:column;gap:1.2rem;}
.about-pillar{padding:1.1rem 1.3rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:10px;position:relative;}
.about-pillar::after{content:'';position:absolute;top:10px;right:10px;width:12px;height:12px;border-top:1px solid rgba(180,138,62,0.28);border-right:1px solid rgba(180,138,62,0.28);}
.about-pillar-icon{width:32px;height:32px;border-radius:8px;background:var(--gold-dim);border:1px solid var(--gold-border);display:flex;align-items:center;justify-content:center;color:var(--gold);margin-bottom:0.65rem;}
.about-pillar-title{font-family:var(--serif);font-size:0.95rem;font-weight:300;letter-spacing:-0.01em;color:rgba(14,10,6,0.90);margin-bottom:0.3rem;}
.about-pillar-desc{font-family:var(--body);font-size:0.79rem;line-height:1.65;color:var(--text-secondary);}
.about-quote{margin:3.5rem 0 0;padding:1.8rem 2.2rem;border-left:2px solid rgba(180,138,62,0.38);background:rgba(201,150,58,0.03);border-radius:0 8px 8px 0;}



/* ── PRICING SECTIE ── */
.pricing-section{padding:6rem 6vw;background:var(--bg);}
.pr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:3.5rem;align-items:start;}
@media(max-width:1080px){.pr-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.pr-grid{grid-template-columns:1fr;}}
.pr-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:28px 22px;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:border-color 0.2s,box-shadow 0.2s;}
.pr-card:hover{border-color:rgba(180,138,62,0.45);box-shadow:0 8px 32px rgba(201,150,58,0.07);}
.pr-card::after{content:'';position:absolute;top:10px;right:10px;width:13px;height:13px;border-top:1px solid rgba(180,138,62,0.28);border-right:1px solid rgba(180,138,62,0.28);}
.pr-featured{border-color:var(--gold-border);background:var(--card-bg-hov);}
.pr-addon{border-color:rgba(180,138,62,0.18);background:rgba(245,237,212,0.40);}
.pr-popular-badge{position:absolute;top:0;left:0;right:0;text-align:center;font-family:var(--display);font-size:0.46rem;letter-spacing:0.22em;text-transform:uppercase;color:rgba(14,10,6,0.88);background:var(--gold);padding:5px 0;}
.pr-badge{font-family:var(--display);font-size:0.46rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);opacity:0.65;margin-top:1.8rem;margin-bottom:0.5rem;}
.pr-featured .pr-badge{margin-top:2.2rem;}
.pr-name{font-family:var(--serif);font-size:1.4rem;font-weight:300;letter-spacing:-0.02em;color:rgba(14,10,6,0.92);margin-bottom:0.6rem;}
.pr-desc{font-family:var(--body);font-size:0.82rem;line-height:1.72;color:var(--text-secondary);margin-bottom:1.1rem;}
.pr-feats{list-style:none;display:flex;flex-direction:column;gap:0.4rem;margin-bottom:1.4rem;flex:1;}
.pr-feat{font-family:var(--body);font-size:0.80rem;color:var(--text-secondary);display:flex;align-items:center;gap:0.5rem;line-height:1.4;}
.pr-feat.yes::before{content:'';width:14px;height:14px;flex-shrink:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 14 14' fill='none' stroke='%23c9963a' stroke-width='1.4' stroke-linecap='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='2,7 5.5,10.5 12,3'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;}
.pr-feat.no{color:rgba(60,42,15,0.32);}
.pr-feat.no::before{content:'';width:14px;height:14px;flex-shrink:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 14 14' fill='none' stroke='%23b08840' stroke-width='1.2' stroke-linecap='round' opacity='.3' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='4' y1='4' x2='10' y2='10'/%3E%3Cline x1='10' y1='4' x2='4' y2='10'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;opacity:0.5;}
.pr-price{font-family:var(--serif);font-size:1.55rem;font-weight:300;letter-spacing:-0.02em;color:rgba(14,10,6,0.92);margin-bottom:0.9rem;margin-top:auto;padding-top:0.7rem;}
.pr-price span{font-family:var(--display);font-size:0.50rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--text-muted);vertical-align:middle;margin-left:3px;}
.pr-cta{display:block;text-align:center;font-family:var(--display);font-size:0.52rem;letter-spacing:0.18em;text-transform:uppercase;padding:12px 20px;border-radius:8px;border:1px solid var(--gold-border);color:var(--gold);text-decoration:none;transition:all 0.2s;}
.pr-cta:hover{background:var(--gold-dim);border-color:var(--gold);}
.pr-cta-gold{background:var(--gold);color:rgba(14,10,6,0.92);border-color:transparent;}
.pr-cta-gold:hover{background:#b07828;color:#fff;}

/* ── ABOUT SECTIE ── */
.about-section{padding:6rem 6vw;background:var(--bg2);position:relative;overflow:hidden;}
.about-inner{max-width:1200px;margin:0 auto;}
.about-content{display:grid;grid-template-columns:1fr 1fr;gap:4rem;margin-top:2.5rem;align-items:start;}
@media(max-width:820px){.about-content{grid-template-columns:1fr;gap:2.5rem;}}
.about-body{font-family:var(--body);font-size:0.92rem;line-height:1.85;color:rgba(40,28,10,0.80);margin-bottom:1.1rem;}
.about-pillars{display:flex;flex-direction:column;gap:1.2rem;}
.about-pillar{padding:1.1rem 1.3rem;background:var(--card-bg);border:1px solid var(--card-border);border-radius:10px;position:relative;}
.about-pillar::after{content:'';position:absolute;top:10px;right:10px;width:12px;height:12px;border-top:1px solid rgba(180,138,62,0.28);border-right:1px solid rgba(180,138,62,0.28);}
.about-pillar-icon{width:32px;height:32px;border-radius:8px;background:var(--gold-dim);border:1px solid var(--gold-border);display:flex;align-items:center;justify-content:center;color:var(--gold);margin-bottom:0.65rem;}
.about-pillar-title{font-family:var(--serif);font-size:0.95rem;font-weight:300;letter-spacing:-0.01em;color:rgba(14,10,6,0.90);margin-bottom:0.3rem;}
.about-pillar-desc{font-family:var(--body);font-size:0.79rem;line-height:1.65;color:var(--text-secondary);}
.about-quote{margin:3.5rem 0 0;padding:1.8rem 2.2rem;border-left:2px solid rgba(180,138,62,0.38);background:rgba(201,150,58,0.03);border-radius:0 8px 8px 0;}


/* ── DEMO SECTIE ── */
.demo-section{padding:6rem 6vw;background:var(--bg2);}
.demo-tabs-row{
  display:flex;gap:0.5rem;margin:2.5rem 0 0;
  border-bottom:1px solid var(--gold-border);
  padding-bottom:0;overflow-x:auto;
}
.demo-tab-btn{
  font-family:var(--display);font-size:0.50rem;letter-spacing:0.18em;text-transform:uppercase;
  padding:10px 18px;border:none;background:none;cursor:pointer;
  color:var(--text-muted);border-bottom:2px solid transparent;
  margin-bottom:-1px;transition:all 0.2s;white-space:nowrap;
}
.demo-tab-btn.active{color:var(--gold);border-bottom-color:var(--gold);}
.demo-tab-btn:hover{color:var(--text);}
.demo-panels{margin-top:0;}
.demo-panel{display:none;}
.demo-panel.active{display:block;}
.demo-mock{
  background:var(--bg);border:1px solid var(--card-border);
  border-radius:0 12px 12px 12px;overflow:hidden;
}
.demo-mock-bar{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 16px;background:var(--bg2);
  border-bottom:1px solid var(--gold-border);
}
.demo-mock-title{
  font-family:var(--serif);font-size:0.88rem;font-weight:300;
  color:rgba(14,10,6,0.88);font-style:italic;
}
.demo-mock-badge{
  font-family:var(--display);font-size:0.44rem;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--gold);opacity:0.65;
}
.demo-mock-body{padding:20px 24px;}
/* Business email mock */
.demo-email-mock{display:flex;flex-direction:column;gap:12px;}
.demo-email-field{display:flex;flex-direction:column;gap:4px;}
.demo-email-label{font-family:var(--display);font-size:0.44rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--text-muted);}
.demo-email-val{font-family:var(--body);font-size:0.85rem;color:var(--text);padding:8px 10px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:6px;line-height:1.5;}
.demo-email-body-text{min-height:100px;font-size:0.82rem;line-height:1.75;}
.demo-email-actions{display:flex;gap:8px;margin-top:4px;}
.demo-email-btn{font-family:var(--display);font-size:0.44rem;letter-spacing:0.15em;text-transform:uppercase;padding:8px 14px;border-radius:6px;border:1px solid var(--gold-border);color:var(--gold);cursor:default;}
.demo-email-btn.primary{background:var(--gold);color:rgba(14,10,6,0.9);border-color:transparent;}
/* LeadGen lead card mock */
.demo-lead-grid{display:flex;flex-direction:column;gap:10px;}
.demo-lead-card{padding:14px 16px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:8px;display:flex;flex-direction:column;gap:6px;}
.demo-lead-top{display:flex;align-items:center;justify-content:space-between;}
.demo-lead-name{font-family:var(--serif);font-size:1rem;font-weight:300;color:rgba(14,10,6,0.9);}
.demo-lead-score{font-family:var(--display);font-size:0.44rem;letter-spacing:0.14em;text-transform:uppercase;padding:3px 8px;border-radius:4px;}
.score-hot{background:rgba(180,60,30,0.12);color:#9b3a2a;}
.score-warm{background:rgba(201,150,58,0.15);color:#8a6010;}
.score-cold{background:rgba(60,100,140,0.12);color:#3a5870;}
.demo-lead-url{font-family:var(--display);font-size:0.48rem;color:var(--text-muted);}
.demo-lead-desc{font-family:var(--body);font-size:0.78rem;color:var(--text-secondary);line-height:1.55;}
.demo-lead-actions{display:flex;gap:6px;margin-top:2px;}
.demo-lead-act{font-family:var(--display);font-size:0.42rem;letter-spacing:0.12em;text-transform:uppercase;padding:5px 10px;border-radius:5px;border:1px solid var(--gold-border);color:var(--gold);cursor:default;}
/* BI dashboard already has styles */
/* ML mock */
.demo-ml-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
@media(max-width:600px){.demo-ml-grid{grid-template-columns:1fr;}}
.demo-ml-col{display:flex;flex-direction:column;gap:8px;}
.demo-ml-label{font-family:var(--display);font-size:0.44rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);opacity:0.65;margin-bottom:2px;}
.demo-ml-bubble{padding:10px 12px;border-radius:8px;font-family:var(--body);font-size:0.80rem;line-height:1.6;color:var(--text-secondary);}
.demo-ml-bubble.user{background:var(--card-bg);border:1px solid var(--card-border);border-radius:8px 8px 2px 8px;}
.demo-ml-bubble.agent{background:rgba(201,150,58,0.06);border:1px solid rgba(201,150,58,0.18);border-radius:2px 8px 8px 8px;}
.demo-ml-lang{font-family:var(--display);font-size:0.42rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-muted);text-align:right;margin-top:2px;}


/* ── VOORDELEN BALK ── */
.benefits-bar{
  padding:4rem 6vw;
  background:var(--bg);
  border-top:1px solid var(--gold-border);
  border-bottom:1px solid var(--gold-border);
}
.benefits-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2.5rem;
  max-width:1100px;
  margin:0 auto;
}
@media(max-width:720px){.benefits-grid{grid-template-columns:1fr;gap:2rem;}}
.benefit-item{
  display:flex;flex-direction:column;gap:0.6rem;
  padding-left:1.4rem;
  border-left:2px solid rgba(180,138,62,0.35);
}
.benefit-num{
  font-family:var(--display);font-size:0.46rem;
  letter-spacing:0.22em;text-transform:uppercase;
  color:var(--gold);opacity:0.65;
}
.benefit-title{
  font-family:var(--serif);font-size:1.15rem;font-weight:300;
  letter-spacing:-0.015em;color:rgba(14,10,6,0.92);
  line-height:1.25;
}
.benefit-desc{
  font-family:var(--body);font-size:0.83rem;
  line-height:1.72;color:var(--text-secondary);
}


/* ── HOE HET WERKT SECTIE ── */
.hoe-section{
  padding:6rem 6vw;
  background:var(--bg2);
}
.hoe-inner{max-width:1100px;margin:0 auto;}
.hoe-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.2rem;
  margin-top:3rem;
}
@media(max-width:800px){.hoe-grid{grid-template-columns:1fr;}}
.hoe-card{
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-radius:12px;
  padding:28px 28px 24px;
  position:relative;
  overflow:hidden;
  transition:border-color 0.2s;
}
.hoe-card:hover{border-color:rgba(180,138,62,0.45);}
.hoe-card::after{
  content:'';
  position:absolute;top:10px;right:10px;
  width:13px;height:13px;
  border-top:1px solid rgba(180,138,62,0.28);
  border-right:1px solid rgba(180,138,62,0.28);
}
.hoe-card-wide{grid-column:span 2;}
@media(max-width:800px){.hoe-card-wide{grid-column:span 1;}}
.hoe-label{
  font-family:var(--display);font-size:0.46rem;
  letter-spacing:0.22em;text-transform:uppercase;
  color:var(--gold);opacity:0.65;margin-bottom:1rem;
}
.hoe-icon{
  width:36px;height:36px;border-radius:9px;
  background:var(--gold-dim);border:1px solid var(--gold-border);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);margin-bottom:1rem;
}
.hoe-title{
  font-family:var(--serif);font-size:1.15rem;font-weight:300;
  letter-spacing:-0.015em;color:rgba(14,10,6,0.92);
  margin-bottom:0.55rem;line-height:1.25;
}
.hoe-desc{
  font-family:var(--body);font-size:0.83rem;
  line-height:1.75;color:var(--text-secondary);
}
.hoe-card-dark{
  background:rgba(14,10,6,0.90);
  border-color:rgba(180,138,62,0.20);
}
.hoe-card-dark .hoe-title{color:rgba(240,232,213,0.92);}
.hoe-card-dark .hoe-desc{color:rgba(240,232,213,0.60);}
.hoe-card-dark .hoe-label{color:var(--gold-lt);opacity:0.7;}
.hoe-card-dark::after{
  border-top-color:rgba(201,150,58,0.25);
  border-right-color:rgba(201,150,58,0.25);
}


/* ── DYNAMISCHE DEMO SECTIE ── */
.demo-section-v2{padding:6rem 6vw;background:var(--bg);}
.demo-inner{max-width:1100px;margin:0 auto;}
.demo-tabs-v2{
  display:flex;gap:0;margin-top:2.5rem;
  border-bottom:1px solid var(--gold-border);
  overflow-x:auto;
}
.demo-tab-v2{
  font-family:var(--display);font-size:0.50rem;letter-spacing:0.16em;
  text-transform:uppercase;padding:10px 20px;border:none;background:none;
  cursor:pointer;color:var(--text-muted);border-bottom:2px solid transparent;
  margin-bottom:-1px;transition:all 0.2s;white-space:nowrap;
}
.demo-tab-v2.active{color:var(--gold);border-bottom-color:var(--gold);}
.demo-tab-v2:hover:not(.active){color:var(--text);}

.demo-window{
  background:var(--bg2);
  border:1px solid var(--gold-border);
  border-top:none;
  border-radius:0 0 12px 12px;
  overflow:hidden;
  min-height:420px;
  display:flex;flex-direction:column;
}
.demo-win-bar{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 18px;
  background:var(--bg);
  border-bottom:1px solid var(--gold-border);
  flex-shrink:0;
}
.demo-win-dots{display:flex;gap:5px;}
.demo-win-dot{width:8px;height:8px;border-radius:50%;background:rgba(180,138,62,0.25);}
.demo-win-dot:first-child{background:rgba(201,150,58,0.5);}
.demo-win-name{
  font-family:var(--serif);font-size:0.85rem;font-weight:300;
  font-style:italic;color:rgba(14,10,6,0.75);
}
.demo-win-badge{
  font-family:var(--display);font-size:0.44rem;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--gold);opacity:0.65;
}

.demo-chat{
  flex:1;padding:20px 22px;
  display:flex;flex-direction:column;gap:14px;
  overflow-y:auto;
}
.demo-msg{display:flex;flex-direction:column;gap:4px;max-width:85%;}
.demo-msg.user{align-self:flex-end;align-items:flex-end;}
.demo-msg.agent{align-self:flex-start;align-items:flex-start;}
.demo-msg-label{
  font-family:var(--display);font-size:0.42rem;letter-spacing:0.15em;
  text-transform:uppercase;color:var(--text-muted);
}
.demo-bubble{
  padding:10px 14px;border-radius:10px;
  font-family:var(--body);font-size:0.83rem;line-height:1.65;
}
.demo-msg.user .demo-bubble{
  background:var(--gold);color:rgba(14,10,6,0.90);
  border-radius:10px 10px 2px 10px;
}
.demo-msg.agent .demo-bubble{
  background:var(--card-bg);border:1px solid var(--card-border);
  color:var(--text-secondary);border-radius:2px 10px 10px 10px;
  white-space:pre-wrap;
}
.demo-typing-indicator{
  display:flex;gap:4px;align-items:center;padding:12px 14px;
  background:var(--card-bg);border:1px solid var(--card-border);
  border-radius:2px 10px 10px 10px;
}
.demo-typing-indicator span{
  width:6px;height:6px;border-radius:50%;
  background:var(--gold);opacity:0.6;
  animation:demoTyping 1.2s ease infinite;
}
.demo-typing-indicator span:nth-child(2){animation-delay:0.2s;}
.demo-typing-indicator span:nth-child(3){animation-delay:0.4s;}
@keyframes demoTyping{0%,80%,100%{transform:scale(0.7);opacity:0.4}40%{transform:scale(1);opacity:1}}

/* Lead card in demo */
.demo-lead-card{
  margin-top:8px;padding:12px 14px;
  background:var(--bg);border:1px solid var(--card-border);
  border-radius:8px;display:flex;flex-direction:column;gap:5px;
}
.demo-lead-top{display:flex;align-items:center;justify-content:space-between;}
.demo-lead-name{font-family:var(--serif);font-size:0.95rem;font-weight:300;color:rgba(14,10,6,0.90);}
.demo-score{font-family:var(--display);font-size:0.42rem;letter-spacing:0.12em;text-transform:uppercase;padding:2px 7px;border-radius:4px;}
.score-hot{background:rgba(180,60,30,0.12);color:#9b3a2a;}
.score-warm{background:rgba(201,150,58,0.15);color:#8a6010;}
.demo-lead-url{font-family:var(--display);font-size:0.46rem;color:var(--text-muted);}
.demo-lead-desc{font-family:var(--body);font-size:0.78rem;color:var(--text-secondary);line-height:1.55;}

/* BI dashboard in demo */
.demo-bi-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:8px;}
@media(max-width:500px){.demo-bi-grid{grid-template-columns:1fr;}}
.demo-kpi{padding:10px 12px;background:var(--bg);border:1px solid var(--card-border);border-radius:8px;}
.demo-kpi-label{font-family:var(--display);font-size:0.42rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold);opacity:0.65;margin-bottom:3px;}
.demo-kpi-value{font-family:var(--serif);font-size:1.25rem;font-weight:300;color:rgba(14,10,6,0.90);letter-spacing:-0.02em;}
.demo-kpi-delta{font-family:var(--body);font-size:0.72rem;margin-top:2px;}
.delta-up{color:#4a7c59;}.delta-down{color:#9b3a2a;}.delta-neutral{color:var(--text-muted);}

.demo-win-input{
  display:flex;align-items:center;gap:10px;
  padding:12px 18px;border-top:1px solid var(--gold-border);
  background:var(--bg);flex-shrink:0;
}
.demo-win-input-field{
  flex:1;font-family:var(--body);font-size:0.83rem;
  color:var(--text-muted);font-style:italic;
}
.demo-replay-btn-v2{
  font-family:var(--display);font-size:0.46rem;letter-spacing:0.15em;
  text-transform:uppercase;padding:7px 14px;border-radius:6px;
  border:1px solid var(--gold-border);color:var(--gold);background:none;
  cursor:pointer;transition:all 0.2s;white-space:nowrap;
}
.demo-replay-btn-v2:hover{background:var(--gold-dim);}

/* ── TAALWISSELAAR ── */
.lang-switcher{
  display:flex;align-items:center;gap:0;
  border:1px solid var(--gold-border);border-radius:6px;
  overflow:hidden;margin-left:0.5rem;
}
.lang-btn{
  font-family:var(--display);font-size:0.46rem;letter-spacing:0.14em;
  text-transform:uppercase;padding:5px 9px;border:none;background:none;
  cursor:pointer;color:var(--text-muted);transition:all 0.2s;
}
.lang-btn.active{background:var(--gold);color:rgba(14,10,6,0.90);}
.lang-btn:hover:not(.active){background:var(--gold-dim);color:var(--text);}


/* ── BUREAU KNOP EFFECTEN ── */
@keyframes goldShimmer{
  0%{transform:translateX(-110%);opacity:0}
  5%{opacity:1}
  40%{transform:translateX(110%);opacity:0}
  100%{transform:translateX(110%);opacity:0}
}
@keyframes goldPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(201,150,58,0)}
  12%{box-shadow:0 0 0 3px rgba(201,150,58,0.28),0 3px 14px rgba(201,150,58,0.18)}
  35%{box-shadow:0 0 0 0 rgba(201,150,58,0)}
}

/* Primaire CTA knoppen — hero, nav, CTA sectie */
.btn-primary,
.nav-cta,
.cta-btn,
a[data-i18n="nav_cta"],
a[data-i18n="cta_btn"] {
  position:relative;overflow:hidden;
  transition:background 0.25s ease,transform 0.2s ease,box-shadow 0.25s ease !important;
  animation:goldPulse 3.5s ease-in-out infinite;
}
.btn-primary:hover,
.nav-cta:hover,
.cta-btn:hover {
  transform:translateY(-2px) !important;
}
.btn-primary::after,
.nav-cta::after,
.cta-btn::after {
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 25%,rgba(255,255,220,0.55) 50%,transparent 75%);
  transform:translateX(-110%);pointer-events:none;
  animation:goldShimmer 3.5s ease-in-out infinite;
}

/* Pricing goud knop */
.pr-cta-gold {
  position:relative;overflow:hidden;
  transition:background 0.25s ease,transform 0.2s ease,box-shadow 0.25s ease !important;
  animation:goldPulse 3.5s ease-in-out infinite;
}
.pr-cta-gold::after {
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 25%,rgba(255,255,220,0.50) 50%,transparent 75%);
  transform:translateX(-110%);pointer-events:none;
  animation:goldShimmer 3.5s ease-in-out infinite;
}
.pr-cta-gold:hover{transform:translateY(-2px) !important;}

/* Ghost knoppen — shimmer op hover */
.pr-cta:not(.pr-cta-gold),
.demo-replay-btn-v2,
.app-choice,
.hoe-card {
  position:relative;overflow:hidden;
}
.pr-cta:not(.pr-cta-gold)::after,
.demo-replay-btn-v2::after {
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 30%,rgba(255,245,200,0.22) 50%,transparent 70%);
  transform:translateX(-110%);pointer-events:none;transition:none;
}
.pr-cta:not(.pr-cta-gold):hover::after,
.demo-replay-btn-v2:hover::after {
  animation:goldShimmer 0.55s ease forwards;
}
.pr-cta:hover:not(.pr-cta-gold){transform:translateY(-1px);}

/* App choice card — shimmer op hover */
.app-choice::before {
  content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(105deg,transparent 20%,rgba(255,245,190,0.18) 50%,transparent 80%);
  transform:translateX(-110%) skewX(-8deg);pointer-events:none;transition:none;border-radius:inherit;
}
.app-choice:hover::before{animation:goldShimmer 0.65s ease forwards;}
.app-choice > *{position:relative;z-index:2;}

/* Begin hier modal knoppen */
#appChoiceModal .app-choice:hover{transform:translateY(-2px);}

/* Active state */
.btn-primary:active,.nav-cta:active,.pr-cta-gold:active{
  transform:translateY(0) scale(0.98) !important;
  animation:none;box-shadow:none !important;
}


/* ── HIEROGLIEF OVERLAY ── */



  8%  { opacity:var(--op, 0.045); }
  92% { opacity:var(--op, 0.045); }
  100%{ opacity:0; transform:translateY(-60px) rotate(var(--r,0deg)) scale(0.95); }
}


/* ── CONTACT SECTIE ── */
.contact-section{padding:6rem 6vw;background:var(--bg);}
.contact-inner{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start;}
@media(max-width:780px){.contact-inner{grid-template-columns:1fr;gap:2.5rem;}}
.contact-left p{font-family:var(--body);font-size:0.88rem;line-height:1.8;color:var(--text-secondary);margin-top:1rem;}
.contact-info{margin-top:2rem;display:flex;flex-direction:column;gap:0.8rem;}
.contact-info-item{display:flex;align-items:center;gap:0.7rem;font-family:var(--display);font-size:0.50rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--text-muted);}
.contact-info-icon{width:28px;height:28px;border-radius:7px;background:var(--gold-dim);border:1px solid var(--gold-border);display:flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0;}
.contact-form{display:flex;flex-direction:column;gap:1.1rem;}
.cf-field{display:flex;flex-direction:column;gap:0.35rem;}
.cf-label{font-family:var(--display);font-size:0.46rem;letter-spacing:0.20em;text-transform:uppercase;color:var(--text-muted);}
.cf-input,.cf-textarea{font-family:var(--body);font-size:0.88rem;color:var(--text);background:var(--card-bg);border:1px solid var(--card-border);padding:10px 14px;border-radius:0;outline:none;transition:border-color 0.2s,box-shadow 0.2s;width:100%;}
.cf-input:focus,.cf-textarea:focus{border-color:rgba(180,138,62,0.55);box-shadow:0 0 0 2px rgba(201,150,58,0.08);}
.cf-textarea{min-height:110px;resize:vertical;line-height:1.6;}
.cf-submit{font-family:var(--display);font-size:0.52rem;letter-spacing:0.18em;text-transform:uppercase;padding:13px 28px;background:var(--gold);color:rgba(14,10,6,0.92);border:none;cursor:pointer;position:relative;overflow:hidden;transition:background 0.2s,transform 0.15s;animation:goldPulse 3.5s ease-in-out infinite;}
.cf-submit::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 25%,rgba(255,255,220,0.55) 50%,transparent 75%);transform:translateX(-110%);pointer-events:none;animation:goldShimmer 3.5s ease-in-out infinite;}
.cf-submit:hover{background:var(--gold-lt);transform:translateY(-1px);}
.cf-submit:disabled{opacity:0.5;cursor:not-allowed;animation:none;}
.cf-msg{font-family:var(--display);font-size:0.46rem;letter-spacing:0.14em;text-transform:uppercase;padding:8px 12px;border-radius:4px;display:none;}
.cf-msg.ok{display:block;color:#4a7c59;background:rgba(74,124,89,0.08);border:1px solid rgba(74,124,89,0.2);}
.cf-msg.err{display:block;color:#9b3a2a;background:rgba(155,58,42,0.06);border:1px solid rgba(155,58,42,0.18);}

/* ── CHAT WIDGET ── */
#agents-chat{position:fixed;bottom:1.5rem;right:1.5rem;z-index:8000;display:flex;flex-direction:column;align-items:flex-end;gap:0.7rem;}
#agents-chat-toggle{
  display:flex;align-items:center;gap:0.5rem;
  font-family:var(--display);font-size:0.50rem;letter-spacing:0.14em;text-transform:uppercase;
  padding:0.6rem 1.1rem 0.6rem 0.85rem;
  background:var(--gold);color:rgba(14,10,6,0.92);border:none;cursor:pointer;
  position:relative;overflow:hidden;
  transition:background 0.2s,transform 0.15s;
  animation:goldPulse 3.5s ease-in-out infinite;
  border-radius:99px;
}
#agents-chat-toggle::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,240,0.55) 50%,transparent 70%);transform:translateX(-100%);animation:goldShimmer 3.5s ease-in-out infinite;pointer-events:none;}
#agents-chat-toggle:hover{background:var(--gold-lt);transform:translateY(-1px);}
#agents-chat-dot{width:7px;height:7px;border-radius:50%;background:rgba(14,10,6,0.5);animation:chatPulse 2s infinite;}
@keyframes chatPulse{0%,100%{opacity:0.5}50%{opacity:1}}
#agents-chat-window{
  width:340px;
  background:var(--bg);
  border:1px solid var(--gold-border);
  border-top:2px solid var(--gold);
  border-radius:12px 12px 0 0;
  box-shadow:0 16px 50px rgba(14,10,6,0.15);
  display:flex;flex-direction:column;
  max-height:460px;
  opacity:0;pointer-events:none;
  transform:translateY(10px) scale(0.97);
  transition:opacity 0.22s ease,transform 0.22s cubic-bezier(0.22,1,0.36,1);
}
#agents-chat-window.open{opacity:1;pointer-events:auto;transform:translateY(0) scale(1);}
#agents-chat-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:0.8rem 1rem;border-bottom:1px solid var(--gold-border);
  background:rgba(245,237,212,0.5);border-radius:12px 12px 0 0;flex-shrink:0;
}
.ach-info{display:flex;align-items:center;gap:0.6rem;}
.ach-avatar{width:30px;height:30px;border-radius:50%;background:var(--gold);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic;font-size:0.9rem;color:rgba(14,10,6,0.88);}
.ach-name{font-family:var(--serif);font-size:0.88rem;font-weight:300;color:rgba(14,10,6,0.88);}
.ach-status{font-family:var(--display);font-size:0.40rem;letter-spacing:0.14em;text-transform:uppercase;color:rgba(0,160,80,0.70);}
#agents-chat-close{background:none;border:none;font-size:1.1rem;color:var(--text-muted);cursor:pointer;padding:0.2rem;line-height:1;transition:color 0.2s;}
#agents-chat-close:hover{color:var(--text);}
#agents-chat-msgs{flex:1;overflow-y:auto;padding:0.9rem;display:flex;flex-direction:column;gap:0.6rem;scroll-behavior:smooth;}
#agents-chat-msgs::-webkit-scrollbar{width:3px;}
#agents-chat-msgs::-webkit-scrollbar-thumb{background:rgba(201,150,58,0.2);}
.acm{display:flex;max-width:88%;}
.acm-u{align-self:flex-end;}
.acm-a{align-self:flex-start;}
.acm-bubble{font-family:var(--body);font-size:0.82rem;line-height:1.58;padding:0.5rem 0.75rem;border-radius:8px;}
.acm-u .acm-bubble{background:rgba(201,150,58,0.12);border:1px solid rgba(201,150,58,0.22);color:var(--text);}
.acm-a .acm-bubble{background:var(--card-bg);border:1px solid var(--card-border);border-left:2px solid var(--gold);color:var(--text-secondary);}
.acm-typing span{display:inline-block;width:5px;height:5px;border-radius:50%;background:rgba(201,150,58,0.55);animation:demoTyping 1.2s ease infinite;margin:0 1px;}
.acm-typing span:nth-child(2){animation-delay:0.2s;}
.acm-typing span:nth-child(3){animation-delay:0.4s;}
#agents-chat-input-row{display:flex;gap:0.5rem;padding:0.7rem 0.9rem;border-top:1px solid var(--gold-border);flex-shrink:0;}
#agents-chat-input{flex:1;font-family:var(--body);font-size:0.83rem;border:1px solid var(--card-border);background:var(--card-bg);padding:0.5rem 0.75rem;outline:none;color:var(--text);transition:border-color 0.2s;border-radius:4px;}
#agents-chat-input:focus{border-color:rgba(180,138,62,0.45);}
#agents-chat-send{font-family:var(--display);font-size:0.46rem;letter-spacing:0.12em;text-transform:uppercase;background:var(--gold);color:rgba(14,10,6,0.92);border:none;padding:0.5rem 0.9rem;cursor:pointer;transition:background 0.2s;border-radius:4px;flex-shrink:0;}
#agents-chat-send:hover{background:var(--gold-lt);}
#agents-chat-footer{font-family:var(--display);font-size:0.38rem;letter-spacing:0.10em;text-align:center;color:var(--text-muted);padding:0.4rem;border-top:1px solid var(--gold-border);flex-shrink:0;}

/* ── RESET ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}

/* ── MA'AT ANALYTICS DESIGN TOKENS ── */
:root{
  /* Achtergrond — zelfde als bureau */
  --bg:           #f0e8d5;
  --bg2:          #e8dcc8;
  --surface:      rgba(245,237,212,0.60);
  --surface2:     rgba(248,242,224,0.88);

  /* Goud — primaire accentkleur */
  --gold:         #c9963a;
  --gold-lt:      #e0b86a;
  --gold-dk:      #9b6e20;
  --gold-dim:     rgba(201,150,58,0.10);
  --gold-border:  rgba(180,138,62,0.22);
  --gold-text:    rgba(120,78,12,0.85);

  /* Tekst — donker op licht, zelfde als bureau */
  --text:         rgba(14,10,6,0.90);
  --text-secondary: rgba(40,28,10,0.75);
  --text-muted:   rgba(60,42,15,0.62);

  /* Kaarten — zelfde als bureau */
  --card-bg:      rgba(245,237,212,0.60);
  --card-bg-hov:  rgba(248,242,224,0.88);
  --card-border:  rgba(180,138,62,0.22);
  --card-border-hov: rgba(180,138,62,0.55);

  /* Borders */
  --border:       rgba(201,150,58,0.10);
  --border-md:    rgba(201,150,58,0.20);
  --border-hi:    rgba(201,150,58,0.42);

  /* Typografie — zelfde als bureau */
  --serif:        'Fraunces', serif;
  --display:      'DM Mono', monospace;
  --body:         'DM Sans', sans-serif;

  /* Type scale — bureau */
  --t-micro:  0.44rem;
  --t-label:  0.54rem;
  --t-sm:     0.82rem;
  --t-body:   1.00rem;

  /* Stone aliases voor compatibiliteit */
  --stone-bg:        #f0e8d5;
  --stone-bg2:       #e8dcc8;
  --stone-surface:   rgba(245,237,212,0.60);
  --stone-surface2:  rgba(248,242,224,0.88);
  --stone-surface3:  rgba(235,225,205,0.70);
  --stone-border:    rgba(180,138,62,0.12);
  --stone-border-md: rgba(180,138,62,0.22);
  --stone-tx:        rgba(14,10,6,0.90);
  --stone-txm:       rgba(40,28,10,0.70);
  --stone-txh:       rgba(80,55,25,0.45);
  --stone-ac:        #c9963a;
  --stone-ac-dim:    rgba(201,150,58,0.10);
  --stone-ac-border: rgba(201,150,58,0.25);

  /* Signaal */
  --signal-green: #4ade80;
}

/* ── BASE ── */
body{
  font-family:var(--body);
  font-size:17px;
  background:var(--bg);
  color:var(--text);
  overflow-x:hidden;
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-optical-sizing:auto;
}

/* ── GRAIN TEXTURE ── */
/* grain texture removed for stone theme */

/* ── DECORATIVE BORDER ── */
.egyp-border{
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(180,138,62,0.4),rgba(180,138,62,0.6),rgba(180,138,62,0.4),transparent);
  margin:0;
}

/* ── NAV ── */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:14px 6vw;
  display:flex;align-items:center;justify-content:space-between;
  backdrop-filter:blur(16px);
  background:rgba(232,220,200,0.95);
  border-bottom:0.5px solid var(--gold-border);
}
.nav-brand{
  display:flex;align-items:center;gap:10px;
  font-family:var(--serif);font-size:17px;font-weight:300;color:rgba(14,10,6,0.88);letter-spacing:-0.01em;
  color:var(--stone-tx);text-decoration:none;letter-spacing:0.01em;
}
.nav-logo{
  width:30px;height:30px;border-radius:6px;
  background:var(--stone-surface3);border:1px solid var(--card-border);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{
  font-family:var(--display);font-size:0.52rem;font-weight:400;
  letter-spacing:0.18em;text-transform:uppercase;
  color:var(--text-muted);text-decoration:none;transition:color 0.2s;
}
.nav-links a:hover{color:var(--stone-tx)}
@media(max-width:700px){.nav-links{display:none}.mob-menu-btn{display:flex}}
.nav-cta{
  padding:9px 20px;
  background:#c9963a;color:#07060a;
  border-radius:2px;border:none;
  font-family:var(--display);font-size:11px;font-weight:700;
  letter-spacing:0.12em;text-transform:uppercase;
  text-decoration:none;transition:all 0.2s;
}
.nav-cta:hover{background:#b07828;transform:translateY(-1px)}

/* ── HERO ── */
.hero{
  min-height:100vh;
  display:grid;grid-template-columns:1fr 1fr;
  align-items:center;padding-top:70px;
  position:relative;overflow:hidden;
  background:var(--bg);
}
@media(max-width:860px){.hero{grid-template-columns:1fr;padding-top:80px}}
.hero::before{
  content:'';position:absolute;bottom:-10%;right:-5%;
  width:65%;height:80%;
  background:radial-gradient(ellipse,rgba(154,109,40,0.08) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.hero::after{
  content:'';position:absolute;top:10%;left:-8%;
  width:40%;height:60%;
  background:radial-gradient(ellipse,rgba(154,109,40,0.05) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.hero-left{
  padding:80px 6vw 80px calc(6vw + 12px);
  position:relative;z-index:1;
}
@media(max-width:860px){.hero-left{padding:48px 6vw 0}}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  padding:5px 13px;
  background:var(--terra-dim);border:0.5px solid var(--terra-border);
  border-radius:2px;
  font-family:var(--display);font-size:11px;font-weight:700;
  letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);
  margin-bottom:24px;animation:fadein 0.6s ease both;
}
.eyebrow-dot{width:5px;height:5px;border-radius:50%;background:var(--gold);animation:pulse 2s infinite}
.hero h1{
  color:rgba(14,10,6,0.92);
  font-family:var(--serif);
  font-size:clamp(44px,6vw,76px);
  font-weight:300;line-height:1.03;letter-spacing:-0.025em;
  margin-bottom:8px;animation:fadein 0.7s 0.1s ease both;
}
.hero h1 em{font-style:italic;color:var(--gold)}
.hero h1 .terra{color:var(--gold)}
.hero-maat{
  font-family:var(--display);
  font-size:11px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--gold);
  opacity:0.75;
  margin-bottom:20px;
  margin-top:-8px;
}
.maat-meaning{
  font-family:var(--display);
  font-size:12px;
  letter-spacing:0.04em;
  color:var(--stone-txm);
  margin-top:10px;
  margin-bottom:0;
  opacity:0.8;
}
.maat-pron{
  font-family:var(--body);
  font-style:italic;
  opacity:0.7;
  letter-spacing:0;
}
.hero-sub{
  font-family:var(--prose);
  font-size:clamp(17px,1.9vw,21px);color:var(--text-muted);
  max-width:440px;margin:18px 0 32px;line-height:1.72;
  animation:fadein 0.7s 0.2s ease both;
}
.hero-actions{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  animation:fadein 0.7s 0.3s ease both;
}
.btn-primary{
  padding:14px 28px;background:var(--gold);color:#07060a;
  border-radius:4px;border:0.5px solid rgba(255,255,255,0.08);
  font-family:var(--display);font-size:13px;font-weight:700;
  letter-spacing:0.04em;text-transform:uppercase;
  text-decoration:none;transition:all 0.2s;
  display:inline-flex;align-items:center;gap:8px;
}
.btn-primary:hover{background:var(--terra-hover);transform:translateY(-1px);box-shadow:0 8px 24px rgba(180,120,40,0.25)}
.btn-ghost{
  padding:14px 22px;background:rgba(201,151,60,0.04);
  color:var(--text-muted);border:0.5px solid var(--border-hi);
  border-radius:4px;font-family:var(--display);font-size:13px;font-weight:400;
  letter-spacing:0.04em;text-transform:uppercase;
  text-decoration:none;transition:all 0.2s;
}
.btn-ghost:hover{color:var(--text);background:rgba(201,151,60,0.08);border-color:var(--gold)}
.hero-trust{
  display:flex;align-items:center;gap:10px;margin-top:20px;
  font-size:13px;color:var(--text-hint);animation:fadein 0.7s 0.4s ease both;
}
.trust-dot{width:3px;height:3px;border-radius:50%;background:var(--gold);opacity:0.4}
.trust-item{display:inline-flex;align-items:center;gap:6px}
.hero-right{
  padding:80px 6vw 80px 4vw;
  display:flex;align-items:center;justify-content:center;
  position:relative;z-index:1;animation:fadein 0.9s 0.3s ease both;
}
@media(max-width:860px){.hero-right{padding:32px 6vw 60px}}
.hero-feather-wrap{
  position:relative;
  width:min(340px,80vw);height:min(440px,90vw);
  isolation:isolate;
}

/* ── STATS ── */
.stats-section{
  padding:48px 6vw;background:var(--stone-surface3);
  border-top:0.5px solid var(--stone-border-md);border-bottom:0.5px solid var(--stone-border-md);
}
.stats-inner{
  display:flex;align-items:center;justify-content:space-between;
  max-width:860px;margin:0 auto;flex-wrap:wrap;gap:24px;
}
.stat{text-align:center;flex:1;min-width:120px}
.stat-num{font-family:var(--serif);font-size:clamp(32px,4vw,48px);font-weight:400;color:var(--gold-heading);line-height:1}
.stat-label{font-family:var(--display);font-size:10px;font-weight:400;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-hint);margin-top:6px}
.stat-div{width:0.5px;height:48px;background:var(--border-md)}
@media(max-width:600px){.stat-div{display:none}.stats-inner{justify-content:center;gap:32px}}

/* ── SECTIONS ── */
section{padding:96px 6vw;position:relative}
.section-eyebrow{
  display:inline-block;font-family:var(--display);font-size:10px;font-weight:700;
  letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;
}
.section-title{
  font-family:var(--serif);font-size:clamp(32px,4.5vw,54px);font-weight:300;
  color:rgba(14,10,6,0.92);line-height:1.06;max-width:640px;letter-spacing:-0.025em;
}
.section-title em{font-style:italic;color:var(--gold);font-weight:300;letter-spacing:-0.02em}
.section-sub{
  font-family:var(--prose);
  font-size:clamp(16px,1.8vw,19px);color:var(--text-muted);
  max-width:500px;line-height:1.72;margin-top:14px;
}

/* ── DEMO ── */

/* ── DEMO AGENT TABS ── */
.demo-tabs{display:flex;gap:0;border-bottom:0.5px solid var(--stone-border);background:var(--stone-surface3);flex-shrink:0}
.demo-tab{padding:10px 18px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--stone-txh);cursor:pointer;border-bottom:2px solid transparent;transition:all 0.2s;background:transparent;border-top:none;border-left:none;border-right:none;white-space:nowrap;display:flex;align-items:center;gap:6px}
.demo-tab:hover{color:var(--stone-txm)}
.demo-tab.active{color:var(--stone-tx);border-bottom-color:var(--gold)}
.demo-tab-icon{font-size:13px}
@media(max-width:600px){.demo-tab{padding:9px 12px;font-size:10px}}

.demo-shell{
  background:var(--sand-dark);border:0.5px solid var(--border-md);
  border-radius:4px;margin-top:48px;overflow:hidden;
}
.demo-topbar{
  padding:12px 18px;border-bottom:0.5px solid var(--stone-border-md);
  display:flex;align-items:center;justify-content:space-between;
  background:var(--stone-surface3);
}
.demo-feather{
  width:30px;height:30px;background:var(--stone-surface3);
  border:1px solid var(--card-border);border-radius:4px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.demo-agent-info{display:flex;align-items:center;gap:10px}
.demo-agent-name{font-family:var(--display);font-size:13px;font-weight:700;letter-spacing:0.04em;color:var(--stone-tx)}
.demo-agent-sub{font-size:11px;color:var(--stone-txh);font-family:var(--display);letter-spacing:0.04em;margin-top:1px}
.demo-live-badge{
  display:flex;align-items:center;gap:5px;
  font-family:var(--display);font-size:10px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--signal-green);background:rgba(74,222,128,0.08);padding:4px 10px;border-radius:2px;border:0.5px solid rgba(74,222,128,0.2);
}
.demo-live-dot{width:5px;height:5px;border-radius:50%;background:var(--signal-green);animation:pulse 2s infinite}
.demo-body{display:grid;grid-template-columns:220px 1fr 220px;height:480px}
@media(max-width:860px){.demo-body{grid-template-columns:1fr;height:auto}}
.demo-activity{border-right:0.5px solid var(--stone-border-md);display:flex;flex-direction:column;overflow:hidden;background:var(--stone-surface2)}
@media(max-width:860px){.demo-activity{display:none}}
.demo-act-header{padding:10px 14px;border-bottom:0.5px solid var(--stone-border-md);font-family:var(--display);font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--stone-txh);background:var(--stone-surface3)}
.demo-act-list{flex:1;overflow-y:auto;padding:8px}
.demo-act-empty{font-size:12px;color:var(--stone-txh);padding:12px 6px;font-family:var(--display)}
.demo-act-item{display:flex;align-items:flex-start;gap:7px;padding:6px 7px;border-radius:2px;margin-bottom:4px;font-size:11px;line-height:1.45;animation:actIn 0.3s ease}
@keyframes actIn{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:translateX(0)}}
.demo-act-item.search{background:rgba(45,90,140,0.15);border:0.5px solid rgba(45,90,140,0.2)}
.demo-act-item.lead{background:var(--gold-dim);border:0.5px solid var(--gold-border)}
.demo-act-item.email{background:rgba(74,222,128,0.08);border:0.5px solid rgba(74,222,128,0.2)}
.demo-act-icon{font-size:11px;flex-shrink:0;margin-top:1px}
.demo-act-text{color:var(--stone-txm);flex:1}
.demo-act-text strong{color:var(--stone-tx)}
.demo-chat{display:flex;flex-direction:column;overflow:hidden;min-width:0}
.demo-task-bar{padding:9px 12px;border-bottom:0.5px solid var(--stone-border-md);display:flex;align-items:center;gap:8px;background:var(--stone-surface2);flex-shrink:0}
.demo-task-input{flex:1;background:var(--stone-surface3);border:1px solid var(--card-border);border-radius:2px;padding:7px 12px;font-size:12px;color:var(--stone-txh);font-family:var(--display);min-height:32px;transition:color 0.15s}
.demo-task-input.typing{color:var(--stone-tx)}
.demo-run-btn{padding:7px 14px;background:var(--gold);color:#07060a;border-radius:2px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;white-space:nowrap;flex-shrink:0;opacity:0.4;transition:opacity 0.3s}
.demo-run-btn.active{opacity:1}
.demo-messages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:9px;background:var(--stone-bg2)}
.demo-msg{display:flex;gap:7px;align-items:flex-start;max-width:90%;animation:msgIn 0.3s ease}
@keyframes msgIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.demo-msg.user{align-self:flex-end;flex-direction:row-reverse}
.demo-msg-av{width:24px;height:24px;border-radius:2px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px;font-family:var(--serif)}
.demo-msg.agent .demo-msg-av{background:var(--gold-dim);border:0.5px solid var(--gold-border);color:var(--gold)}
.demo-msg.user .demo-msg-av{background:var(--stone-surface3);border:1px solid var(--card-border);color:var(--stone-txm)}
.demo-bubble{padding:9px 13px;font-size:13.5px;line-height:1.65;border-radius:2px;font-family:var(--prose)}
.demo-msg.agent .demo-bubble{background:var(--stone-surface3);color:var(--stone-tx);border:1px solid var(--card-border)}
.demo-msg.user .demo-bubble{background:var(--stone-tx);color:#fff}
.demo-bubble strong{font-weight:600}
.demo-typing{display:inline-flex;gap:3px;align-items:center;padding:2px 0}
.demo-typing span{width:4px;height:4px;border-radius:50%;background:var(--text-hint);animation:db 1.2s infinite}
.demo-typing span:nth-child(2){animation-delay:0.2s}
.demo-typing span:nth-child(3){animation-delay:0.4s}
@keyframes db{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-4px)}}
.demo-lead-card{background:var(--stone-surface2);border:1px solid var(--card-border);border-radius:2px;padding:10px 12px;margin-top:6px;font-size:12px;animation:msgIn 0.3s ease}
.demo-lead-card-title{font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--stone-txm);margin-bottom:7px;display:flex;align-items:center;gap:6px}
.demo-lead-row{display:flex;justify-content:space-between;padding:3px 0;border-bottom:0.5px solid var(--stone-border-md);font-size:11px}
.demo-lead-row:last-child{border-bottom:none}
.demo-lead-key{color:var(--stone-txh)}
.demo-lead-val{color:var(--stone-tx);font-weight:500}
.demo-score-pill{display:inline-block;padding:2px 8px;border-radius:2px;font-family:var(--display);font-size:9px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase}
.sp-hot{background:rgba(248,113,113,0.15);color:var(--signal-red);border:0.5px solid rgba(248,113,113,0.3)}
.sp-warm{background:var(--gold-dim);color:var(--gold);border:0.5px solid var(--gold-border)}
.demo-input-row{padding:9px 12px;border-top:0.5px solid var(--stone-border-md);display:flex;gap:7px;align-items:center;background:var(--stone-surface2);flex-shrink:0}
.demo-input-fake{flex:1;background:var(--stone-surface3);border:1px solid var(--card-border);border-radius:2px;padding:8px 12px;font-size:12px;color:var(--stone-txh);font-family:var(--display)}
.demo-send-fake{padding:8px 14px;background:var(--gold);color:#07060a;border-radius:2px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;opacity:0.5}
.demo-crm{border-left:0.5px solid var(--stone-border-md);display:flex;flex-direction:column;overflow:hidden;background:var(--stone-surface2)}
@media(max-width:860px){.demo-crm{border-left:none;border-top:0.5px solid var(--stone-border);max-height:260px}}
.demo-crm-header{padding:10px 14px;border-bottom:0.5px solid var(--stone-border-md);display:flex;align-items:center;justify-content:space-between;font-family:var(--display);font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--stone-txh);background:var(--stone-surface3)}
.demo-crm-count{color:var(--gold)}
.demo-crm-list{flex:1;overflow-y:auto;padding:8px}
.demo-crm-empty{font-size:11px;color:var(--stone-txh);padding:12px 6px;font-family:var(--display);line-height:1.65}
.demo-crm-item{background:var(--stone-surface);border:1px solid var(--card-border);border-radius:2px;padding:9px 10px;margin-bottom:6px;font-size:11px;animation:actIn 0.3s ease}
.demo-crm-name{font-family:var(--serif);font-size:13px;font-weight:400;color:var(--stone-tx);margin-bottom:2px}
.demo-crm-meta{color:var(--stone-txh);font-family:var(--display);font-size:10px;letter-spacing:0.03em}
.demo-crm-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.demo-footer{padding:12px 18px;border-top:0.5px solid var(--stone-border-md);background:var(--stone-surface2);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.demo-replay-btn{padding:7px 16px;background:transparent;border:1px solid var(--card-border);border-radius:2px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--stone-txm);cursor:pointer;transition:all 0.2s}
.demo-replay-btn:hover{color:var(--stone-tx);border-color:var(--stone-border-str)}
.demo-cta-note{font-size:12px;color:var(--stone-txh);font-family:var(--display)}
.demo-cta-note a{color:var(--gold);text-decoration:none}

/* ── AGENTS GRID ── */
.agents-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin-top:56px}
@media(max-width:900px){.agents-grid{grid-template-columns:1fr}}
@media(min-width:900px) and (max-width:1140px){.agents-grid{grid-template-columns:1fr 1fr}}

/* Agent card — subtiele Egyptische hoekaccenten */
.agent-card::after{
  content:'';
  position:absolute;top:12px;right:12px;
  width:16px;height:16px;
  border-top:1px solid rgba(180,138,62,0.35);
  border-right:1px solid rgba(180,138,62,0.35);
  pointer-events:none;
}
.agent-card{position:relative;}

.agent-card{background:var(--card-bg);border:1px solid var(--card-border);padding:32px 28px;position:relative;overflow:hidden;transition:all 0.3s}
.agent-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:0;transition:opacity 0.3s}
.agent-card:hover{background:var(--card-hover);border-color:var(--border-md)}
.agent-card:hover::before{opacity:1}
.agent-card.featured{background:var(--card-bg-hov);border-color:var(--card-border-hov);border-color:var(--gold-border)}
.agent-card.featured::before{opacity:1}
.agent-num{font-family:var(--serif);font-size:72px;font-weight:400;font-style:italic;color:rgba(212,168,83,0.08);position:absolute;top:-8px;right:16px;line-height:1;pointer-events:none}
.agent-icon{
  width:48px;height:48px;
  border-radius:10px;
  background:var(--gold-dim);
  border:0.5px solid var(--gold-border);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:20px;
}
.agent-icon svg{display:block}
.agent-tag{display:inline-block;padding:3px 10px;background:var(--gold-dim);border:0.5px solid var(--gold-border);border-radius:2px;font-family:var(--display);font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.agent-tag.gold{background:rgba(240,201,106,0.15);border-color:rgba(240,201,106,0.4);color:var(--gold-heading)}
.agent-name{font-family:var(--serif);font-size:21px;font-weight:400;margin-bottom:10px;color:var(--text);letter-spacing:-0.01em}
.agent-desc{font-family:var(--prose);font-size:16px;color:var(--text-muted);line-height:1.72;margin-bottom:20px}
.agent-feats{list-style:none;display:flex;flex-direction:column;gap:7px;margin-bottom:24px}
.agent-feats li{font-size:14px;color:var(--stone-txm);display:flex;align-items:flex-start;gap:10px;line-height:1.5}
.feat-check{width:14px;height:14px;flex-shrink:0;margin-top:3px;display:block}
.agent-price{font-family:var(--serif);font-size:20px;font-weight:400;color:var(--text)}
.agent-price span{font-size:14px;font-weight:400;color:var(--text-hint)}
.agent-cta{display:block;text-align:center;padding:11px;background:transparent;border:0.5px solid var(--border-md);border-radius:3px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-muted);text-decoration:none;margin-top:16px;transition:all 0.2s}
.agent-cta:hover{color:var(--text);border-color:var(--border-hi)}
.agent-card.featured .agent-cta{background:var(--gold);color:#07060a;border-color:transparent}
.agent-card.featured .agent-cta:hover{background:var(--terra-hover)}

/* ── HOW IT WORKS ── */
.how-section{background:var(--stone-bg2)}
.steps-wrap{margin-top:56px;display:flex;flex-direction:column}
.step-row{display:grid;grid-template-columns:80px 1fr;gap:24px;align-items:start;padding:32px 0;border-bottom:0.5px solid var(--stone-border)}
.step-row:last-child{border-bottom:none}
.step-num{font-family:var(--serif);font-size:52px;font-weight:400;font-style:italic;color:var(--gold);opacity:0.5;line-height:1;padding-top:4px;flex-shrink:0}
.step-title{font-family:var(--serif);font-size:20px;font-weight:400;margin-bottom:8px;color:var(--stone-tx)}
.step-text{font-family:var(--prose);font-size:16px;color:var(--text-muted);line-height:1.72;max-width:520px}
.step-badge{display:inline-block;padding:2px 9px;background:var(--stone-surface3);border:1px solid var(--card-border);border-radius:2px;font-family:var(--display);font-size:10px;font-weight:700;letter-spacing:0.07em;text-transform:uppercase;color:var(--stone-txm);margin-bottom:8px}

/* ── BENTO FEATURES ── */
.bento-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:2px;margin-top:56px}
@media(max-width:860px){.bento-grid{grid-template-columns:1fr 1fr}}
@media(max-width:500px){.bento-grid{grid-template-columns:1fr}}
.bento{background:var(--sand-dark);border:1px solid var(--card-border);padding:24px 22px;transition:background 0.2s}
.bento:hover{background:var(--card-hover)}
.b1,.b2,.b3{grid-column:span 4}
.b4,.b5{grid-column:span 6}
.b6,.b7,.b8,.b9,.b10,.b11{grid-column:span 4}
@media(max-width:860px){.b1,.b2,.b3,.b4,.b5,.b6,.b7,.b8,.b9,.b10,.b11{grid-column:span 1}}
.bento-tag{display:inline-block;padding:2px 8px;background:var(--terra-dim);border:0.5px solid var(--terra-border);border-radius:2px;font-family:var(--display);font-size:9px;font-weight:700;letter-spacing:0.09em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.bento-icon{
  width:40px;height:40px;
  border-radius:8px;
  background:var(--terra-dim);
  border:0.5px solid var(--terra-border);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:14px;
}
.bento-icon svg{display:block}
.bento-title{font-family:var(--serif);font-size:17px;font-weight:400;margin-bottom:6px;color:var(--text)}
.bento-text{font-family:var(--prose);font-size:15px;color:var(--text-muted);line-height:1.72}

/* ── TESTIMONIALS ── */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:52px}
@media(max-width:860px){.testi-grid{grid-template-columns:1fr}}
@media(min-width:860px) and (max-width:1100px){.testi-grid{grid-template-columns:1fr 1fr}}
.testi{background:var(--sand-dark);border:1px solid var(--card-border);padding:28px 24px}
.testi-stars{font-size:12px;letter-spacing:3px;margin-bottom:14px;line-height:1}
.testi-stars text{fill:var(--gold-star)}
.testi-text{font-family:var(--serif);font-size:16px;font-style:italic;line-height:1.72;color:var(--text);margin-bottom:18px;letter-spacing:0.01em}
.testi-author{display:flex;align-items:center;gap:10px}
.testi-av{width:36px;height:36px;border-radius:50%;background:var(--sand-mid);border:0.5px solid var(--border-md);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:14px;font-weight:400;color:var(--gold)}
.testi-name{font-family:var(--serif);font-size:15px;font-weight:400;color:var(--text)}
.testi-role{font-size:12px;color:var(--stone-txh);font-family:var(--display);letter-spacing:0.04em}

/* ── PRICING ── */
.pricing-section{background:var(--stone-surface3)}
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:52px;max-width:920px;margin-left:auto;margin-right:auto}
@media(max-width:760px){.pricing-grid{grid-template-columns:1fr;max-width:480px}}

/* Pricing card hoekaccent */
.price-card::before{
  content:'';
  position:absolute;bottom:12px;left:12px;
  width:14px;height:14px;
  border-bottom:1px solid rgba(180,138,62,0.3);
  border-left:1px solid rgba(180,138,62,0.3);
  pointer-events:none;
}
.price-card{position:relative;}

.price-card{background:var(--sand-deep);border:1px solid var(--card-border);padding:28px 24px;position:relative}
.price-card.pop{border-color:var(--gold-border);background:var(--card-pop)}
.pop-badge{display:inline-block;padding:3px 11px;background:var(--gold-heading);color:var(--sand-deep);font-family:var(--display);font-size:9px;font-weight:800;letter-spacing:0.08em;text-transform:uppercase;margin-bottom:14px}
.price-tier{font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.price-amount{font-family:var(--serif);font-size:48px;font-weight:400;line-height:1;color:var(--gold-heading);margin-bottom:3px}
.price-amount sup{font-size:20px;vertical-align:super}
.price-period{font-family:var(--display);font-size:11px;color:var(--gold);letter-spacing:0.04em;margin-bottom:16px}
.price-desc{font-family:var(--prose);font-size:15px;color:var(--text-bright);line-height:1.72;margin-bottom:18px;padding-bottom:18px;border-bottom:0.5px solid var(--stone-border)}
.price-feats{list-style:none;display:flex;flex-direction:column;gap:9px;margin-bottom:24px}
.price-feats li{font-size:13px;color:var(--text-bright);display:flex;align-items:center;gap:8px}
.price-cta{display:block;margin-top:20px;font-family:var(--display);font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;text-decoration:none;color:var(--gold);transition:opacity 0.2s}
.price-cta:hover{opacity:0.7;text-decoration:none}
.price-cta-ghost{color:var(--gold);opacity:0.75}


.pfeat-ic{flex-shrink:0;margin-top:2px}
.price-feats li.no{opacity:0.35}
.price-feats li.no .pfeat-ic circle{fill:rgba(92,63,34,0.15)}
.price-feats li.no .pfeat-ic polyline{stroke:var(--text-hint)}
.price-btn{display:block;text-align:center;padding:12px;border-radius:3px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:0.07em;text-transform:uppercase;text-decoration:none;transition:all 0.2s}
.pb-outline{background:transparent;color:var(--text-muted);border:0.5px solid var(--border-md)}
.pb-outline:hover{color:var(--text);border-color:var(--border-hi)}
.pb-terra{background:var(--gold);color:#07060a;border:none}
.pb-terra:hover{background:var(--terra-hover)}
.payment-row{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:20px;flex-wrap:wrap}
.pm{padding:5px 13px;background:var(--sand-deep);border:1px solid var(--card-border);border-radius:3px;font-family:var(--display);font-size:10px;letter-spacing:0.05em;text-transform:uppercase;color:var(--text-hint);display:inline-flex;align-items:center;gap:5px}

/* ── FAQ ── */
#faq{background:var(--stone-bg)}
.faq-list{max-width:700px;margin:48px auto 0}
.faq-item{
  background:var(--stone-surface);
  border:1px solid var(--card-border);
  border-radius:3px;
  padding:0;
  margin-bottom:8px;
  cursor:pointer;
  transition:border-color 0.2s;
}
.faq-item:hover{border-color:var(--gold-border)}
.faq-item.open{border-color:var(--gold-border)}
.faq-q{
  font-family:var(--serif);font-size:17px;font-weight:400;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  color:var(--stone-txm);
  letter-spacing:-0.005em;
  padding:20px 24px;
}
.faq-icon{
  width:22px;height:22px;border-radius:50%;
  background:rgba(201,151,60,0.18);border:0.5px solid rgba(201,151,60,0.45);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;color:var(--gold-heading);
  transition:transform 0.25s,background 0.2s;flex-shrink:0;
  font-family:var(--display);font-weight:700;line-height:1;
}
.faq-item.open .faq-icon{transform:rotate(45deg);background:var(--gold-border)}
.faq-a{
  font-family:var(--prose);font-size:16px;
  color:var(--text-muted);
  line-height:1.72;
  max-height:0;overflow:hidden;
  transition:max-height 0.35s ease,padding 0.35s ease;
  padding:0 24px;
}
.faq-item.open .faq-a{max-height:300px;padding:0 24px 20px}

/* ── CTA ── */
.cta-section{text-align:center;padding:120px 6vw;position:relative;overflow:hidden;background:var(--stone-tx)}
.cta-section::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:400px;background:radial-gradient(ellipse,rgba(192,82,42,0.08) 0%,transparent 65%);pointer-events:none}
.cta-section h2{font-family:var(--serif);font-size:clamp(36px,5.5vw,66px);font-weight:300;line-height:1.08;margin-bottom:16px;max-width:600px;margin-left:auto;margin-right:auto;letter-spacing:-0.015em;color:#f5ede0}
.cta-section h2 em{font-style:italic;color:#ffffff}
.cta-section p{font-family:var(--body);font-size:1rem;color:rgba(240,232,213,0.70);max-width:44ch;margin:0 auto 2.5rem;line-height:1.80}
.cta-note{font-family:var(--display);font-size:0.50rem;color:rgba(240,232,213,0.42);letter-spacing:0.22em;text-transform:uppercase;margin-top:1.2rem}

/* ── FOOTER ── */
footer{padding:48px 6vw 32px;border-top:0.5px solid var(--stone-border-md);background:var(--stone-surface3);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;background:var(--stone-surface3)}
.footer-brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:16px;font-weight:400;color:var(--stone-tx)}
.footer-links{display:flex;gap:24px;flex-wrap:wrap}
.footer-links a{font-family:var(--display);font-size:11px;font-weight:400;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-hint);text-decoration:none;transition:color 0.2s}
.footer-links a:hover{color:var(--text-muted)}
.powered-by-strip{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:16px;font-family:var(--display);font-size:10px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-hint);opacity:0.7}
.pb-label{color:var(--gold);font-weight:700;opacity:1}
.pb-item{color:var(--text-muted)}
.pb-dot{width:3px;height:3px;border-radius:50%;background:var(--text-hint);opacity:0.4}
.footer-powered{font-family:var(--display);font-size:10px;color:var(--text-hint);letter-spacing:0.05em;text-transform:uppercase;width:100%;text-align:center;margin-top:8px;opacity:0.6}
.footer-copy{font-family:var(--display);font-size:10px;color:var(--text-hint);letter-spacing:0.05em;text-transform:uppercase}

/* ── SCROLL REVEAL ── */
.reveal{opacity:0;transform:translateY(22px);transition:opacity 0.65s ease,transform 0.65s ease}.no-js .reveal,.reveal.visible{opacity:1;transform:translateY(0)}
.reveal.visible{opacity:1;transform:translateY(0)}
.d1{transition-delay:0.1s}.d2{transition-delay:0.2s}.d3{transition-delay:0.3s}.d4{transition-delay:0.4s}

/* ── REDUCED MOTION — respect user preference ── */
@media(prefers-reduced-motion:reduce){
  .feather-float{animation:none}
  .hero-feather-glow{animation:none}
  .feather-particles{display:none}
  .hero-feather-wrap::before,.hero-feather-wrap::after{animation:none}
  line[style*="barbIn"]{stroke-dashoffset:0!important}
  polygon[style*="fadein"]{opacity:0.9!important;animation:none}
}

/* ── ANIMATIONS ── */
@keyframes fadein{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.3}}
@keyframes rotateSlow{to{transform:rotate(360deg)}}
@keyframes ringPulse{
  0%,100%{border-color:rgba(212,168,83,0.16)}
  50%{border-color:rgba(212,168,83,0.35)}
}

/* ── FEATHER ANIMATIONS ── */
/* 1. Gentle float — the whole feather drifts up/down */
@keyframes featherFloat{
  0%,100%{transform:translateY(0) rotate(-1deg)}
  40%{transform:translateY(-18px) rotate(0.5deg)}
  70%{transform:translateY(-8px) rotate(-0.8deg)}
}
/* 2. Glow pulse — the radial glow breathes */
@keyframes glowPulse{
  0%,100%{opacity:0.7;transform:scale(1)}
  50%{opacity:1;transform:scale(1.12)}
}
/* 3. Barb draw-in — individual barbs stroke in */
@keyframes barbIn{
  to{stroke-dashoffset:0}
}
/* 4. Shaft shimmer — the central shaft glistens */
@keyframes shaftShimmer{
  0%,100%{opacity:1;filter:brightness(1)}
  50%{opacity:0.85;filter:brightness(1.3)}
}
/* 5. Floating particle rise */
@keyframes particleRise{
  0%{transform:translateY(0) translateX(0);opacity:0.6}
  60%{opacity:0.4}
  100%{transform:translateY(-120px) translateX(var(--px,8px));opacity:0}
}

/* ── FEATHER CONTAINER ── */
/* Float the whole feather */
.feather-float{
  animation:featherFloat 8s ease-in-out infinite;
  transform-origin:center bottom;
  position:relative;z-index:1;
  display:block;
}

/* ── RINGS ── */

/* Outer ring — always-visible base ring + sweeping gold light arc */
.hero-feather-wrap::before{
  content:'';
  position:absolute;
  inset:-32px;
  border-radius:50%;
  /* Always-visible base ring */
  border:1px solid rgba(212,168,83,0.35);
  /* Sweeping bright spot — conic gradient masked to ring shape */
  background:conic-gradient(
    from 0deg,
    transparent 0%,
    transparent 28%,
    rgba(240,200,117,0.75) 48%,
    rgba(212,168,83,0.2) 56%,
    transparent 72%,
    transparent 100%
  );
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#fff calc(100% - 2px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#fff calc(100% - 2px));
  animation:rotateSlow 6s linear infinite, ringPulse 4s ease-in-out infinite;
  z-index:0;
}

/* Inner ring — counter-rotating with terra accent */
.hero-feather-wrap::after{
  content:'';
  position:absolute;
  inset:12px;
  border-radius:50%;
  /* Always-visible base ring */
  border:0.5px solid rgba(212,168,83,0.22);
  /* Counter-sweeping arc */
  background:conic-gradient(
    from 60deg,
    transparent 0%,
    transparent 38%,
    rgba(212,168,83,0.55) 52%,
    rgba(192,82,42,0.25) 58%,
    transparent 72%,
    transparent 100%
  );
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 1.5px),#fff calc(100% - 1.5px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 1.5px),#fff calc(100% - 1.5px));
  animation:rotateSlow 10s linear infinite reverse;
  z-index:0;
}

/* Glow breathes — larger, richer radial behind the feather */
.hero-feather-glow{
  position:absolute;inset:-10%;
  background:radial-gradient(
    ellipse 60% 55% at 50% 50%,
    rgba(240,200,117,0.38) 0%,
    rgba(212,168,83,0.18) 40%,
    transparent 70%
  );
  border-radius:50%;
  animation:glowPulse 6s ease-in-out infinite;
  transform-origin:center;
  pointer-events:none;
  z-index:0;
}

/* Particle container */
.feather-particles{
  position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden;
}
.fp{
  position:absolute;
  width:2px;height:2px;border-radius:50%;
  background:var(--gold-heading);
  animation:particleRise var(--pd,6s) var(--delay,0s) ease-out infinite;
  opacity:0;
}


.about-section{
  padding:96px 6vw;
  background:var(--stone-surface3);
  position:relative;
}
.about-section::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 40% at 50% 20%,rgba(122,112,96,0.06) 0%,transparent 65%);
  pointer-events:none;
}
.about-intro{
  max-width:680px;
  margin-bottom:48px;
}
.about-lead{
  font-family:var(--prose);
  font-size:clamp(17px,1.9vw,20px);
  color:var(--stone-txm);
  line-height:1.8;
  margin-top:18px;
}
.about-lead strong{
  color:var(--stone-tx);
  font-weight:500;
}


/* founder quote */
.founder-quote{
  max-width:720px;
  margin:0 auto;
  text-align:center;
  padding:48px 0 0;
  border-top:0.5px solid var(--stone-border);
}
.fq-text{
  font-family:var(--serif);
  font-size:clamp(18px,2.2vw,24px);
  font-style:italic;
  font-weight:400;
  color:var(--stone-tx);
  line-height:1.72;
  letter-spacing:0.01em;
}
.fq-attr{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-top:24px;
}
.fq-line{
  width:32px;height:0.5px;
  background:var(--gold);
  opacity:0.5;
}
.fq-name{
  font-family:var(--display);
  font-size:11px;font-weight:400;
  letter-spacing:0.08em;text-transform:uppercase;
  color:var(--stone-txh);
}

/* ── ONTBREKENDE CSS VARIABELEN (compatibiliteit) ── */
:root {
  --text-hint:        rgba(60,42,15,0.45);
  --text-bright:      rgba(14,10,6,0.85);
  --gold-heading:     #b07828;
  --gold-star:        #c9963a;
  --prose:            'DM Sans', sans-serif;
  --terra-dim:        rgba(201,150,58,0.08);
  --terra-border:     rgba(180,138,62,0.20);
  --terra-hover:      #b07828;
  --sand-dark:        rgba(245,237,212,0.50);
  --sand-mid:         rgba(235,225,205,0.70);
  --sand-deep:        rgba(230,218,195,0.60);
  --card-hover:       rgba(248,242,224,0.88);
  --card-pop:         rgba(250,244,228,0.95);
  --signal-red:       #c0362a;
  --stone-border-str: rgba(180,138,62,0.40);
}

/* ── ABOUT-TEXT ── */
.about-text {
  font-family: var(--body);
  font-size: 0.95rem;
  line-height: 1.80;
  color: var(--text-secondary);
}

/* ── CONTACT-RIGHT ── */
.contact-right {
  width: 100%;
}