/* ===== RESET & BASE ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px;-webkit-text-size-adjust:100%;overflow-x:hidden}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:#0d0d14;color:#e0e0e0;line-height:1.7;overflow-x:hidden}

/* ===== SKIP LINK ===== */
.skip-link{position:absolute;top:-100%;left:1rem;background:#00e5ff;color:#0d0d14;padding:.5rem 1rem;z-index:10000;border-radius:0 0 6px 6px;font-weight:700;text-decoration:none;transition:top .2s}
.skip-link:focus{top:0}

/* ===== COLOURS / VARS ===== */
:root{
  --bg-dark:#0d0d14;
  --bg-panel:rgba(20,20,35,.72);
  --neon-cyan:#00e5ff;
  --neon-orange:#ff6d2e;
  --neon-green:#39ff8e;
  --text-primary:#e8e8ec;
  --text-secondary:#a0a0b0;
  --text-dark:#0d0d14;
  --glass-border:rgba(255,255,255,.08);
  --radius:12px;
  --radius-sm:8px;
  --transition:0.3s ease;
  --max-w:1140px;
  --header-h:64px;
}

/* ===== REDUCED MOTION ===== */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0s!important;transition-duration:0s!important;scroll-behavior:auto!important}
}

/* ===== FOCUS ===== */
:focus-visible{outline:2px solid var(--neon-cyan);outline-offset:3px;border-radius:3px}
a:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none}

/* ===== TYPOGRAPHY ===== */
h1,h2,h3,h4{color:var(--text-primary);line-height:1.25;font-weight:700}
h1{font-size:clamp(2rem,5vw,3.2rem)}
h2{font-size:clamp(1.5rem,3.5vw,2.2rem);margin-bottom:1rem}
h3{font-size:clamp(1.15rem,2.5vw,1.5rem);margin-bottom:.75rem}
p{margin-bottom:1rem;color:var(--text-secondary)}
a{color:var(--neon-cyan);text-decoration:none;transition:color var(--transition)}
a:hover{color:var(--neon-orange)}

/* ===== LAYOUT ===== */
.container{max-width:var(--max-w);margin:0 auto;padding:0 1.25rem}
section{padding:5rem 0}
section:nth-child(even){background:rgba(0,0,0,.15)}

/* ===== GLASS PANEL ===== */
.glass{background:var(--bg-panel);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--glass-border);border-radius:var(--radius);padding:2rem}

/* ===== HEADER ===== */
.site-header{position:fixed;top:0;left:0;width:100%;height:var(--header-h);background:rgba(13,13,20,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--glass-border);z-index:1000;display:flex;align-items:center}
.site-header .container{display:flex;align-items:center;justify-content:space-between;width:100%}
.site-logo{font-size:1.25rem;font-weight:800;color:var(--neon-cyan);letter-spacing:-.02em;text-decoration:none}
.site-logo span{color:var(--neon-orange)}

/* NAV */
.main-nav{display:flex;align-items:center;gap:.25rem}
.main-nav a{padding:.4rem .75rem;font-size:.875rem;color:var(--text-secondary);border-radius:var(--radius-sm);transition:background var(--transition),color var(--transition);white-space:nowrap}
.main-nav a:hover,.main-nav a.active{color:var(--neon-cyan);background:rgba(0,229,255,.08)}
.nav-toggle{display:none;background:none;border:none;color:var(--text-primary);font-size:1.5rem;cursor:pointer;padding:.5rem}

/* Body scroll lock when mobile nav is open */
html.nav-open,body.nav-open{overflow:hidden!important;touch-action:none}
.nav-overlay{display:none;position:fixed;inset:0;z-index:998;background:rgba(0,0,0,.5)}
.nav-overlay.visible{display:block}

@media(max-width:960px){
  .nav-toggle{display:block}
  .main-nav{position:fixed;top:var(--header-h);right:0;width:280px;height:calc(100vh - var(--header-h));background:rgba(13,13,20,.97);flex-direction:column;padding:1.5rem;gap:.5rem;transform:translateX(100%);transition:transform var(--transition);border-left:1px solid var(--glass-border);z-index:999;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .main-nav.open{transform:translateX(0)}
  .main-nav a{font-size:1rem;padding:.6rem 1rem}
}

/* ===== HERO ===== */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;padding-top:calc(var(--header-h) + 3rem);overflow:hidden}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__bg svg{position:absolute;inset:0;width:100%;height:100%;opacity:.12}
.hero__content{position:relative;z-index:1;max-width:700px}
.hero__content h1{margin-bottom:1.25rem}
.hero__content h1 .accent{color:var(--neon-cyan)}
.hero__content p.lead{font-size:1.15rem;color:var(--text-secondary);margin-bottom:2rem;max-width:560px}
.hero__cta{display:inline-flex;align-items:center;gap:.5rem;background:var(--neon-cyan);color:var(--text-dark);font-weight:700;padding:.85rem 2rem;border-radius:var(--radius);transition:background var(--transition),transform var(--transition)}
.hero__cta:hover{background:var(--neon-orange);color:#fff;transform:translateY(-2px)}

/* ===== SECTION HEADERS ===== */
.section-header{text-align:center;margin-bottom:3rem}
.section-header .overline{display:block;font-size:.8rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--neon-orange);margin-bottom:.5rem}
.section-header p{max-width:620px;margin:0 auto}

/* ===== CARD GRID ===== */
.card-grid{display:grid;gap:1.5rem}
.card-grid--3{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.card-grid--2{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}

.card{position:relative;overflow:hidden;transition:transform var(--transition),border-color var(--transition)}
.card:hover{transform:translateY(-4px);border-color:rgba(0,229,255,.25)}
.card__icon{width:48px;height:48px;margin-bottom:1rem;color:var(--neon-cyan)}
.card__icon svg{width:100%;height:100%}
.card h3{color:var(--text-primary)}
.card p{font-size:.925rem}

/* ===== CONTENT WITH IMAGE ===== */
.content-with-image{display:flex;gap:2rem;align-items:flex-start}
.content-with-image--reverse{flex-direction:row-reverse}
.content-image{width:280px;max-width:40%;flex-shrink:0;border-radius:var(--radius);overflow:hidden;border:1px solid var(--glass-border)}
.content-image img{width:100%;height:auto;display:block;object-fit:cover}
.content-text{flex:1}
@media(max-width:640px){
  .content-with-image,.content-with-image--reverse{flex-direction:column}
  .content-image{width:100%;max-width:100%}
}

/* ===== INTERACTIVE: RHYTHM TOOL ===== */
.tool-panel{max-width:640px;margin:0 auto}
.tool-panel label{display:block;font-weight:600;margin-bottom:.35rem;color:var(--text-primary);font-size:.925rem}
.tool-panel select,.tool-panel input[type="range"]{width:100%;margin-bottom:1.25rem;padding:.6rem .8rem;background:#1a1a2e;border:1px solid var(--glass-border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.925rem;font-family:inherit}
.tool-panel select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2300e5ff' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .8rem center;padding-right:2.5rem;cursor:pointer}
.tool-panel select option{background:#1a1a2e;color:var(--text-primary)}
.tool-panel select:focus,.tool-panel input:focus{border-color:var(--neon-cyan);outline:none}
.tool-panel .range-val{text-align:right;font-size:.85rem;color:var(--neon-cyan);margin-top:-.9rem;margin-bottom:1rem}
.tool-result{padding:1.25rem;border-radius:var(--radius-sm);background:rgba(0,229,255,.06);border:1px solid rgba(0,229,255,.15);min-height:60px}
.tool-result h4{color:var(--neon-cyan);margin-bottom:.5rem;font-size:1rem}
.tool-result ul{list-style:none;padding:0}
.tool-result li{padding:.3rem 0;padding-left:1.2rem;position:relative;font-size:.925rem;color:var(--text-secondary)}
.tool-result li::before{content:"";position:absolute;left:0;top:.7rem;width:6px;height:6px;border-radius:50%;background:var(--neon-green)}

/* ===== INTERACTIVE: SCENARIOS ===== */
.scenario-btns{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1.5rem}
.scenario-btn{background:rgba(255,255,255,.06);border:1px solid var(--glass-border);color:var(--text-primary);padding:.65rem 1.25rem;border-radius:var(--radius);cursor:pointer;font-size:.9rem;font-family:inherit;transition:background var(--transition),border-color var(--transition)}
.scenario-btn:hover,.scenario-btn.active{background:rgba(0,229,255,.1);border-color:var(--neon-cyan);color:var(--neon-cyan)}
.scenario-result{padding:1.25rem;background:rgba(57,255,142,.05);border:1px solid rgba(57,255,142,.15);border-radius:var(--radius-sm);min-height:60px}
.scenario-result h4{color:var(--neon-green);margin-bottom:.5rem}
.scenario-result p{font-size:.925rem;margin-bottom:.5rem}

/* ===== FAQ ACCORDION ===== */
.faq-list{max-width:780px;margin:0 auto}
.faq-item{border-bottom:1px solid var(--glass-border)}
.faq-item:last-child{border-bottom:none}
.faq-question{width:100%;display:flex;align-items:center;justify-content:space-between;padding:1.15rem 0;background:none;border:none;color:var(--text-primary);font-size:1rem;font-weight:600;cursor:pointer;text-align:left;font-family:inherit;transition:color var(--transition);gap:1rem}
.faq-question:hover{color:var(--neon-cyan)}
.faq-question .faq-icon{flex-shrink:0;width:24px;height:24px;position:relative;transition:transform var(--transition)}
.faq-question .faq-icon::before,.faq-question .faq-icon::after{content:"";position:absolute;background:var(--neon-cyan);border-radius:2px}
.faq-question .faq-icon::before{width:14px;height:2px;top:11px;left:5px}
.faq-question .faq-icon::after{width:2px;height:14px;top:5px;left:11px;transition:transform var(--transition)}
.faq-item.open .faq-question .faq-icon::after{transform:rotate(90deg)}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .4s ease,padding .4s ease;padding-bottom:0}
.faq-item.open .faq-answer{padding-bottom:1.25rem}
.faq-answer p{font-size:.925rem}

/* ===== FOOTER ===== */
.site-footer{background:rgba(0,0,0,.35);border-top:1px solid var(--glass-border);padding:3rem 0 1.5rem}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;margin-bottom:2rem}
.footer-col h4{font-size:.925rem;color:var(--text-primary);margin-bottom:.75rem}
.footer-col ul{list-style:none;padding:0}
.footer-col li{margin-bottom:.35rem}
.footer-col a{font-size:.875rem;color:var(--text-secondary)}
.footer-col a:hover{color:var(--neon-cyan)}
.footer-bottom{text-align:center;padding-top:1.5rem;border-top:1px solid var(--glass-border);font-size:.8rem;color:var(--text-secondary)}

/* ===== COOKIE BANNER ===== */
.cookie-banner{position:fixed;bottom:0;left:0;width:100%;background:rgba(13,13,20,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--glass-border);padding:1.25rem;z-index:9999;transform:translateY(100%);transition:transform .4s ease}
.cookie-banner.visible{transform:translateY(0)}
.cookie-inner{max-width:var(--max-w);margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:1rem}
.cookie-inner p{flex:1;min-width:240px;font-size:.875rem;margin:0;color:var(--text-secondary)}
.cookie-inner p a{color:var(--neon-cyan);text-decoration:underline}
.cookie-btns{display:flex;gap:.5rem;flex-wrap:wrap}
.cookie-btn{padding:.55rem 1.15rem;border-radius:var(--radius-sm);font-size:.85rem;font-weight:600;cursor:pointer;border:1px solid var(--glass-border);font-family:inherit;transition:background var(--transition),color var(--transition),border-color var(--transition)}
.cookie-btn--accept{background:var(--neon-cyan);color:var(--text-dark);border-color:var(--neon-cyan)}
.cookie-btn--accept:hover{background:#00c8e0}
.cookie-btn--reject{background:rgba(255,109,46,.12);color:var(--neon-orange);border-color:var(--neon-orange)}
.cookie-btn--reject:hover{background:rgba(255,109,46,.22)}
.cookie-btn--settings{background:transparent;color:var(--text-secondary);border-color:var(--glass-border)}
.cookie-btn--settings:hover{color:var(--text-primary);border-color:var(--text-secondary)}

/* COOKIE SETTINGS PANEL */
.cookie-settings{display:none;width:100%;margin-top:1rem}
.cookie-settings.open{display:block}
.cookie-opt{display:flex;align-items:center;justify-content:space-between;padding:.6rem 0;border-bottom:1px solid var(--glass-border)}
.cookie-opt:last-child{border-bottom:none}
.cookie-opt span{font-size:.875rem;color:var(--text-secondary)}
.cookie-opt .tag{font-size:.75rem;padding:.15rem .5rem;border-radius:4px;margin-left:.5rem}
.tag--required{background:rgba(0,229,255,.12);color:var(--neon-cyan)}
.toggle{position:relative;width:44px;height:24px;flex-shrink:0}
.toggle input{opacity:0;width:0;height:0;position:absolute}
.toggle .slider{position:absolute;inset:0;background:rgba(255,255,255,.12);border-radius:12px;cursor:pointer;transition:background var(--transition)}
.toggle .slider::before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform var(--transition)}
.toggle input:checked+.slider{background:var(--neon-green)}
.toggle input:checked+.slider::before{transform:translateX(20px)}
.toggle input:disabled+.slider{opacity:.6;cursor:not-allowed}
.cookie-save-btn{margin-top:1rem;padding:.55rem 1.5rem;background:var(--neon-cyan);color:var(--text-dark);border:none;border-radius:var(--radius-sm);font-weight:600;cursor:pointer;font-family:inherit;font-size:.85rem}
.cookie-save-btn:hover{background:#00c8e0}

/* ===== FORM (standalone) ===== */
.form-section{max-width:680px;margin:0 auto}
.form-group{margin-bottom:1.25rem}
.form-group label{display:block;font-weight:600;margin-bottom:.35rem;font-size:.925rem;color:var(--text-primary)}
.form-group .required{color:var(--neon-orange)}
.form-group input,.form-group textarea{width:100%;padding:.7rem 1rem;background:rgba(255,255,255,.06);border:1px solid var(--glass-border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.925rem;font-family:inherit;transition:border-color var(--transition)}
.form-group input:focus,.form-group textarea:focus{border-color:var(--neon-cyan);outline:none}
.form-group textarea{min-height:120px;resize:vertical}
.form-group .error-msg{font-size:.8rem;color:var(--neon-orange);margin-top:.25rem;display:none}
.form-group.has-error input,.form-group.has-error textarea{border-color:var(--neon-orange)}
.form-group.has-error .error-msg{display:block}
.form-consent{display:flex;align-items:flex-start;gap:.6rem;margin-bottom:1.5rem}
.form-consent input[type="checkbox"]{margin-top:.3rem;accent-color:var(--neon-cyan);width:18px;height:18px;flex-shrink:0}
.form-consent label{font-size:.85rem;color:var(--text-secondary);font-weight:400;cursor:pointer}
.form-submit{padding:.75rem 2rem;background:var(--neon-cyan);color:var(--text-dark);border:none;border-radius:var(--radius-sm);font-weight:700;font-size:1rem;cursor:pointer;font-family:inherit;transition:background var(--transition),transform var(--transition)}
.form-submit:hover{background:var(--neon-orange);color:#fff;transform:translateY(-2px)}
.form-submit:disabled{opacity:.5;cursor:not-allowed;transform:none}
.form-feedback{margin-top:1rem;padding:1rem;border-radius:var(--radius-sm);display:none;font-size:.925rem}
.form-feedback.success{display:block;background:rgba(57,255,142,.08);border:1px solid rgba(57,255,142,.2);color:var(--neon-green)}
.form-feedback.error{display:block;background:rgba(255,109,46,.08);border:1px solid rgba(255,109,46,.2);color:var(--neon-orange)}
.hp-field{position:absolute;left:-9999px;opacity:0;height:0;width:0;overflow:hidden;pointer-events:none;tab-index:-1}

/* ===== CONTACT INFO BLOCKS ===== */
.contact-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;margin-bottom:3rem}
.contact-info-item{display:flex;align-items:flex-start;gap:1rem}
.contact-info-item .ci-icon{width:40px;height:40px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(0,229,255,.1);color:var(--neon-cyan)}
.contact-info-item .ci-icon svg{width:20px;height:20px}
.contact-info-item .ci-text strong{display:block;font-size:.925rem;color:var(--text-primary);margin-bottom:.15rem}
.contact-info-item .ci-text span,.contact-info-item .ci-text a{font-size:.875rem;color:var(--text-secondary)}

/* ===== PAGE HERO (sub-pages) ===== */
.page-hero{padding:calc(var(--header-h) + 3rem) 0 3rem;text-align:center;position:relative}
.page-hero::after{content:"";position:absolute;bottom:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,var(--neon-cyan),transparent)}

/* ===== LEGAL / CONTENT PAGES ===== */
.legal-content{padding:3rem 0 5rem}
.legal-content h2{margin-top:2.5rem;margin-bottom:.75rem;font-size:1.3rem;color:var(--neon-cyan)}
.legal-content h3{font-size:1.1rem;margin-top:1.5rem}
.legal-content ul,.legal-content ol{padding-left:1.5rem;margin-bottom:1rem}
.legal-content li{margin-bottom:.4rem;color:var(--text-secondary);font-size:.925rem}
.legal-content p{font-size:.925rem}
.legal-content a{color:var(--neon-cyan);text-decoration:underline}

/* ===== SITEMAP PAGE ===== */
.sitemap-list{list-style:none;padding:0}
.sitemap-list li{padding:.5rem 0;border-bottom:1px solid var(--glass-border)}
.sitemap-list li:last-child{border-bottom:none}
.sitemap-list a{font-size:1rem;display:flex;align-items:center;gap:.5rem}
.sitemap-list a::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--neon-cyan);flex-shrink:0}

/* ===== ABOUT PAGE ===== */
.about-values{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-top:2rem}
.about-value-card{text-align:center;padding:2rem 1.5rem}
.about-value-card h3{color:var(--neon-cyan)}

/* ===== 404 PAGE ===== */
.page-404{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding-top:var(--header-h)}
.page-404 h1{font-size:clamp(5rem,12vw,10rem);color:var(--neon-cyan);line-height:1;margin-bottom:.5rem}
.page-404 h2{font-size:1.5rem;margin-bottom:1rem}
.page-404 p{margin-bottom:2rem}
.page-404 a{display:inline-block;padding:.75rem 2rem;background:var(--neon-cyan);color:var(--text-dark);font-weight:700;border-radius:var(--radius);transition:background var(--transition)}
.page-404 a:hover{background:var(--neon-orange);color:#fff}

/* ===== COURT SVG BACKGROUND ===== */
.court-bg{position:fixed;inset:0;pointer-events:none;z-index:-1;overflow:hidden}
.court-bg svg{width:100%;height:100%;opacity:.04}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:var(--bg-dark)}
::-webkit-scrollbar-thumb{background:rgba(0,229,255,.25);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:rgba(0,229,255,.4)}

/* ===== UTILITIES ===== */
.text-center{text-align:center}
.mt-2{margin-top:2rem}
.mb-2{margin-bottom:2rem}
.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}
