/* ================================================================
   VALORA DESIGN SYSTEM v2.0
   myvalora.eu — Shared stylesheet
   Fonts: DM Serif Display · DM Sans · DM Mono
================================================================ */
:root {
  --bg:          #F5F4F1;
  --surface:     #FFFFFF;
  --border:      #E4E2DD;
  --text:        #1A1916;
  --text-sub:    #6B6860;
  --text-muted:  #A09E99;
  --dark-bg:     #0E0E18;
  --dark-surf:   #16161F;
  --dark-border: rgba(255,255,255,0.08);
  --gold:        #C9A84C;
  --gold-light:  #E2C87A;
  --gold-dim:    rgba(201,168,76,0.12);
  --success:     #16a34a;
  --danger:      #dc2626;
  --sofia:       #db2777;
  --clara:       #16a34a;
  --hugo:        #2563eb;
  --matteo:      #d97706;
  --elena:       #7c3aed;
  --r-btn:       8px;
  --r-input:     10px;
  --r-card:      14px;
  --r-panel:     16px;
  --r-pill:      999px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }

/* CONTAINER */
.container    { max-width: 1140px; margin: 0 auto; padding: 0 24px; }
.container-sm { max-width: 760px;  margin: 0 auto; padding: 0 24px; }
.container-xs { max-width: 600px;  margin: 0 auto; padding: 0 24px; }

/* TYPOGRAPHY */
.mono { font-family:'DM Mono',monospace;font-size:10px;font-weight:700;letter-spacing:0.15em;text-transform:uppercase; }
.mono-gold  { font-family:'DM Mono',monospace;font-size:10px;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;color:var(--gold); }
.mono-muted { font-family:'DM Mono',monospace;font-size:10px;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;color:var(--text-muted); }

h1 { font-family:'DM Serif Display',serif;font-size:clamp(36px,5vw,68px);font-weight:400;line-height:1.08;letter-spacing:-0.02em; }
h2 { font-family:'DM Serif Display',serif;font-size:clamp(26px,3.5vw,46px);font-weight:400;line-height:1.1;letter-spacing:-0.015em; }
h3 { font-family:'DM Serif Display',serif;font-size:clamp(20px,2.5vw,30px);font-weight:400;line-height:1.15; }
h4 { font-family:'DM Sans',sans-serif;font-size:15px;font-weight:600; }
em { font-style:italic; }
p  { line-height:1.7; }

/* PILL */
.pill      { display:inline-flex;align-items:center;gap:5px;font-family:'DM Mono',monospace;font-size:10px;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;padding:4px 12px;border-radius:var(--r-pill); }
.pill-gold { background:rgba(201,168,76,0.14);color:var(--gold);border:1px solid rgba(201,168,76,0.25); }
.pill-dark { background:rgba(255,255,255,0.08);color:rgba(245,244,241,0.6);border:1px solid rgba(255,255,255,0.12); }
.pill-dot  { width:5px;height:5px;border-radius:50%;background:currentColor;animation:blink 2s ease-in-out infinite; }
@keyframes blink { 0%,100%{opacity:1}50%{opacity:0.35} }

/* BUTTONS */
.btn     { display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600;letter-spacing:0.06em;border:none;border-radius:var(--r-btn);padding:12px 24px;cursor:pointer;transition:all 0.18s;white-space:nowrap;text-decoration:none; }
.btn-gold  { background:var(--gold);color:var(--dark-bg); }
.btn-gold:hover  { background:var(--gold-light);transform:translateY(-1px);box-shadow:0 6px 20px rgba(201,168,76,0.28); }
.btn-ghost-dark  { background:transparent;color:rgba(245,244,241,0.72);border:1px solid rgba(255,255,255,0.15); }
.btn-ghost-dark:hover { border-color:rgba(201,168,76,0.4);color:var(--gold); }
.btn-outline { background:transparent;color:var(--text);border:1px solid var(--border); }
.btn-outline:hover { border-color:var(--gold);color:var(--gold); }
.btn-lg   { padding:16px 32px;font-size:14px; }
.btn-full { width:100%;justify-content:center; }
.btn svg  { flex-shrink:0;transition:transform 0.18s; }
.btn:hover svg { transform:translateX(3px); }

/* TOPBAR */
.topbar { position:fixed;top:0;left:0;right:0;z-index:200;height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;background:rgba(14,14,24,0.9);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--dark-border);transition:background 0.3s; }
.topbar.solid { background:rgba(14,14,24,0.98); }
.topbar.light { background:rgba(245,244,241,0.94);border-bottom:1px solid var(--border); }
.topbar-logo { font-family:'DM Serif Display',serif;font-size:22px;font-weight:400;letter-spacing:-0.01em;color:#F5F4F1;display:flex;align-items:center;gap:4px;text-decoration:none; }
.topbar.light .topbar-logo { color:var(--text); }
.topbar-logo-dot { width:5px;height:5px;border-radius:50%;background:var(--gold);flex-shrink:0;margin-top:1px; }
.topbar-nav { display:flex;align-items:center;gap:28px; }
.topbar-nav a { font-size:13px;font-weight:500;color:rgba(245,244,241,0.6);transition:color 0.18s;letter-spacing:0.02em; }
.topbar-nav a:hover, .topbar-nav a.active { color:rgba(245,244,241,0.95); }
.topbar.light .topbar-nav a { color:var(--text-sub); }
.topbar.light .topbar-nav a:hover { color:var(--text); }
.topbar-right { display:flex;align-items:center;gap:10px; }
.lang-toggle { display:flex;border:1px solid var(--dark-border);border-radius:var(--r-btn);overflow:hidden; }
.topbar.light .lang-toggle { border-color:var(--border); }
.lang-toggle button { background:none;border:none;padding:5px 9px;font-family:'DM Mono',monospace;font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(245,244,241,0.35);transition:all 0.18s; }
.topbar.light .lang-toggle button { color:var(--text-muted); }
.lang-toggle button.active { background:var(--gold);color:var(--dark-bg); }
.nav-hamburger { display:none;background:none;border:none;color:rgba(245,244,241,0.7);font-size:20px;padding:4px; }
.topbar.light .nav-hamburger { color:var(--text); }

/* SECTION HELPERS */
.sec { padding:88px 0; }
.sec-sm { padding:64px 0; }
.section-dark  { background:var(--dark-bg);color:#F5F4F1; }
.section-surf  { background:var(--dark-surf);color:#F5F4F1; }
.section-light { background:var(--bg);color:var(--text); }
.section-white { background:var(--surface);color:var(--text); }
.sec-header { text-align:center;margin-bottom:52px; }
.sec-header h2 { margin:10px 0 14px; }
.sec-header p  { font-size:15px;font-weight:300;max-width:580px;margin:0 auto;line-height:1.75; }
.section-dark  .sec-header p, .section-surf .sec-header p { color:rgba(245,244,241,0.52); }
.section-light .sec-header p { color:var(--text-sub); }
.section-dark  h2, .section-surf h2 { color:#F5F4F1; }
.section-light h2 { color:var(--text); }

/* CARD */
.card { background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);padding:28px 24px; }
.card-dark { background:var(--dark-surf);border:1px solid var(--dark-border);border-radius:var(--r-card);padding:28px 24px; }

/* FOOTER */
.site-footer { background:#09090f;border-top:1px solid var(--dark-border);padding:52px 0 28px; }
.footer-grid { display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:48px;margin-bottom:40px; }
.footer-logo { font-family:'DM Serif Display',serif;font-size:20px;color:#F5F4F1;display:flex;align-items:center;gap:4px;margin-bottom:12px; }
.footer-desc { font-size:13px;color:rgba(245,244,241,0.3);line-height:1.7;margin-bottom:20px;max-width:240px; }
.footer-socials { display:flex;gap:8px; }
.footer-social { width:32px;height:32px;border-radius:var(--r-btn);background:rgba(255,255,255,0.04);border:1px solid var(--dark-border);display:flex;align-items:center;justify-content:center;color:rgba(245,244,241,0.35);transition:all 0.18s; }
.footer-social:hover { background:var(--gold-dim);border-color:rgba(201,168,76,0.3);color:var(--gold); }
.footer-col-title { font-family:'DM Mono',monospace;font-size:10px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold);margin-bottom:16px; }
.footer-links { list-style:none;display:flex;flex-direction:column;gap:9px; }
.footer-links a,.footer-links span { font-size:13px;color:rgba(245,244,241,0.32);transition:color 0.18s; }
.footer-links a:hover { color:rgba(245,244,241,0.72); }
.footer-bottom { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:24px;border-top:1px solid rgba(255,255,255,0.05); }
.footer-copy { font-size:12px;color:rgba(245,244,241,0.18); }
.footer-gdpr { display:flex;align-items:center;gap:8px;font-family:'DM Mono',monospace;font-size:10px;color:rgba(245,244,241,0.18); }
.gdpr-badge { background:rgba(22,163,74,0.12);border:1px solid rgba(22,163,74,0.22);color:#4ade80;padding:2px 8px;border-radius:3px;font-size:9px;letter-spacing:0.1em;text-transform:uppercase; }
.footer-legal { display:flex;gap:18px; }
.footer-legal a { font-size:12px;color:rgba(245,244,241,0.18);transition:color 0.18s; }
.footer-legal a:hover { color:rgba(245,244,241,0.5); }

/* FORMS */
.form-group { margin-bottom:18px; }
.form-label { display:block;font-size:13px;font-weight:500;color:var(--text);margin-bottom:6px; }
.form-input, .form-textarea, .form-select {
  width:100%;padding:12px 14px;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-input);
  font-family:'DM Sans',sans-serif;font-size:14px;color:var(--text);outline:none;transition:border-color 0.18s;
}
.form-input:focus, .form-textarea:focus, .form-select:focus { border-color:var(--gold); }
.form-textarea { resize:vertical;min-height:120px; }
.form-error-msg { color:var(--danger);font-size:12px;margin-top:4px;display:none; }
.form-error-msg.show { display:block; }
.form-success-msg { background:rgba(22,163,74,0.08);border:1px solid rgba(22,163,74,0.2);border-radius:var(--r-card);padding:16px 20px;color:var(--success);font-size:14px;display:none; }
.form-success-msg.show { display:flex;align-items:center;gap:10px; }

/* COOKIE CONSENT */
#cookie-banner {
  position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:9999;
  background:var(--dark-surf);border:1px solid rgba(201,168,76,0.2);border-radius:var(--r-panel);
  padding:20px 24px;max-width:560px;width:calc(100% - 40px);
  box-shadow:0 8px 40px rgba(0,0,0,0.5);
  display:none;
  animation:slideUp 0.3s ease;
}
#cookie-banner.show { display:block; }
@keyframes slideUp { from{opacity:0;transform:translateX(-50%) translateY(16px)} to{opacity:1;transform:translateX(-50%) translateY(0)} }
.cookie-title { font-family:'DM Sans',sans-serif;font-size:14px;font-weight:600;color:#F5F4F1;margin-bottom:8px; }
.cookie-text  { font-size:12.5px;color:rgba(245,244,241,0.55);line-height:1.65;margin-bottom:16px; }
.cookie-text a { color:var(--gold);text-decoration:underline; }
.cookie-actions { display:flex;gap:8px;flex-wrap:wrap; }
.cookie-btn { padding:9px 16px;border-radius:var(--r-btn);font-family:'DM Sans',sans-serif;font-size:12px;font-weight:600;letter-spacing:0.05em;border:none;cursor:pointer;transition:all 0.18s; }
.cookie-btn-accept { background:var(--gold);color:var(--dark-bg); }
.cookie-btn-accept:hover { background:var(--gold-light); }
.cookie-btn-necessary { background:transparent;color:rgba(245,244,241,0.5);border:1px solid rgba(255,255,255,0.15); }
.cookie-btn-necessary:hover { border-color:rgba(255,255,255,0.35);color:rgba(245,244,241,0.8); }
.cookie-btn-settings { background:transparent;color:rgba(245,244,241,0.4);font-size:11px;padding:6px 10px; }

/* LEGAL PAGES */
.legal-hero { padding:120px 0 64px;background:var(--dark-bg); }
.legal-hero h1 { color:#F5F4F1; }
.legal-hero p  { color:rgba(245,244,241,0.5);margin-top:12px;font-size:15px; }
.legal-body  { padding:64px 0 88px;background:var(--bg);color:var(--text); }
.legal-body h2 { font-family:'DM Serif Display',serif;font-size:24px;color:var(--text);margin:40px 0 14px; }
.legal-body h2:first-child { margin-top:0; }
.legal-body h3 { font-family:'DM Sans',sans-serif;font-size:15px;font-weight:600;color:var(--text);margin:24px 0 10px; }
.legal-body p  { font-size:14px;color:var(--text-sub);line-height:1.8;margin-bottom:14px; }
.legal-body ul,.legal-body ol { padding-left:22px;margin-bottom:14px; }
.legal-body li { font-size:14px;color:var(--text-sub);line-height:1.8;margin-bottom:6px; }
.legal-body a  { color:var(--gold);text-decoration:underline; }
.legal-body a:hover { color:var(--gold-light); }
.legal-toc { background:var(--surface);border:1px solid var(--border);border-radius:var(--r-card);padding:24px 28px;margin-bottom:40px; }
.legal-toc-title { font-family:'DM Mono',monospace;font-size:10px;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;color:var(--text-muted);margin-bottom:14px; }
.legal-toc ol  { padding-left:18px; }
.legal-toc li  { font-size:13.5px;color:var(--text-sub);margin-bottom:6px; }
.legal-toc a   { color:var(--gold);text-decoration:none; }
.legal-toc a:hover { text-decoration:underline; }
.legal-callout { background:rgba(201,168,76,0.07);border-left:3px solid var(--gold);border-radius:0 var(--r-btn) var(--r-btn) 0;padding:16px 20px;margin:20px 0; }
.legal-callout p { color:var(--text);margin:0; }
.legal-update { font-family:'DM Mono',monospace;font-size:10px;color:var(--text-muted);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:32px;display:block; }

/* HERO INNER PAGE */
.page-hero { padding:120px 0 64px;background:var(--dark-bg);position:relative;overflow:hidden; }
.page-hero-bg { position:absolute;inset:0;background:radial-gradient(ellipse 60% 50% at 50% 20%,rgba(201,168,76,0.07) 0%,transparent 60%); }
.page-hero-grid { position:absolute;inset:0;background-image:linear-gradient(rgba(201,168,76,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,76,0.03) 1px,transparent 1px);background-size:48px 48px; }
.page-hero h1 { color:#F5F4F1;position:relative;z-index:1; }
.page-hero p  { color:rgba(245,244,241,0.5);margin-top:14px;font-size:16px;max-width:560px;position:relative;z-index:1;line-height:1.7; }
.page-hero .pill { position:relative;z-index:1;margin-bottom:20px; }

/* RESPONSIVE */
@media(max-width:860px) { .footer-grid{grid-template-columns:1fr 1fr} }
@media(max-width:640px) {
  .topbar-nav { display:none; }
  .nav-hamburger { display:block; }
  .topbar-nav.open { display:flex;flex-direction:column;position:fixed;top:54px;left:0;right:0;background:rgba(14,14,24,0.98);padding:24px;gap:20px;border-bottom:1px solid var(--dark-border); }
  .footer-grid { grid-template-columns:1fr;gap:32px; }
  .footer-bottom { flex-direction:column;align-items:flex-start; }
  .cookie-actions { flex-direction:column; }
}

/* SVG ICONS helper */
.icon-svg { display:inline-block;vertical-align:middle;flex-shrink:0; }
