/* ── CCTM WEBSITE — SHARED STYLES v2 — LICHT THEMA ── */
:root {
  --bg:     #F8FAFC;
  --bg2:    #F1F5F9;
  --bg3:    #E2E8F0;
  --navy:   #1F3864;
  --blue:   #2563EB;
  --blue2:  #3B82F6;
  --accent: #0EA5E9;
  --white:  #FFFFFF;
  --text:   #1E293B;
  --muted:  #64748B;
  --border: rgba(30,41,59,0.12);
  --shadow: 0 1px 3px rgba(0,0,0,0.08),0 1px 2px rgba(0,0,0,0.04);
  --shadow2:0 4px 12px rgba(0,0,0,0.08);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:'DM Sans',system-ui,sans-serif;font-weight:300;line-height:1.7;overflow-x:hidden;}

/* NAV */
nav{position:sticky;top:0;z-index:100;display:flex;align-items:center;gap:1.5rem;padding:1rem 4rem;background:var(--white);border-bottom:1px solid var(--border);box-shadow:var(--shadow);}
.nav-logo{font-family:'DM Mono',monospace;font-size:0.88rem;font-weight:600;color:var(--navy);letter-spacing:0.14em;text-decoration:none;text-transform:uppercase;margin-right:auto;}
.nav-links{display:flex;gap:1.8rem;list-style:none;}
.nav-links a{color:var(--muted);font-size:0.82rem;text-decoration:none;letter-spacing:0.04em;text-transform:uppercase;transition:color 0.2s;padding-bottom:2px;border-bottom:2px solid transparent;}
.nav-links a:hover{color:var(--navy);}
.nav-links a.active{color:var(--navy);border-bottom-color:var(--blue);font-weight:500;}
.nav-cta{font-size:0.82rem;font-weight:500;color:var(--white);text-decoration:none;background:var(--blue);padding:0.5rem 1.3rem;border-radius:4px;transition:background 0.2s;white-space:nowrap;flex-shrink:0;}
.nav-cta:hover{background:var(--navy);}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:4px;}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--navy);margin:4px 0;transition:all 0.3s;}

/* HERO */
.hero{position:relative;min-height:80vh;display:flex;align-items:center;padding:7rem 4rem 6rem;overflow:hidden;background:linear-gradient(135deg,var(--navy) 0%,#2E4C8A 100%);}
.hero-grid{position:absolute;inset:0;z-index:1;background-image:linear-gradient(rgba(255,255,255,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.04) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse 80% 70% at 65% 40%,black 20%,transparent 75%);}
.hero-orb{position:absolute;z-index:1;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(59,130,246,0.25) 0%,transparent 68%);right:-80px;top:50%;transform:translateY(-50%);animation:orb 7s ease-in-out infinite;}
@keyframes orb{0%,100%{transform:translateY(-50%) scale(1);opacity:0.6;}50%{transform:translateY(-50%) scale(1.08);opacity:1;}}
.hero-content{position:relative;z-index:2;max-width:660px;}
.page-hero{position:relative;min-height:36vh;display:flex;align-items:flex-end;padding:5rem 4rem 3rem;overflow:hidden;background:linear-gradient(135deg,var(--navy) 0%,#2E4C8A 100%);}
.page-hero-content{position:relative;z-index:2;max-width:700px;}
.page-title{font-family:'DM Sans',system-ui,sans-serif;letter-spacing:-0.02em;font-size:clamp(2rem,3.5vw,3rem);font-weight:700;line-height:1.2;margin-bottom:1rem;color:#FFFFFF;}
.page-sub{font-size:1rem;color:rgba(255,255,255,0.75);max-width:560px;line-height:1.85;}

/* EYEBROW */
.hero-eyebrow,.section-label{display:inline-flex;align-items:center;gap:0.6rem;font-family:'DM Mono',monospace;font-size:0.72rem;letter-spacing:0.14em;text-transform:uppercase;margin-bottom:0.8rem;}
.hero-eyebrow{color:rgba(255,255,255,0.6);}
.hero-eyebrow::before{content:'';display:block;width:20px;height:1px;background:rgba(255,255,255,0.4);}
.section-label{color:var(--blue);}
.section-label::before{content:'';display:block;width:20px;height:1px;background:var(--blue);}
.page-hero .hero-eyebrow::before{background:rgba(255,255,255,0.4);}

/* TITLES */
.hero h1{font-family:'DM Sans',system-ui,sans-serif;letter-spacing:-0.02em;font-size:clamp(2.4rem,4.5vw,3.8rem);font-weight:700;line-height:1.15;margin-bottom:1.2rem;color:#FFFFFF;}
.hero h1 em,.page-title em{font-style:normal;background:linear-gradient(135deg,#93C5FD,#38BDF8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.hero-sub{font-size:1rem;color:rgba(255,255,255,0.75);max-width:500px;margin-bottom:2.2rem;line-height:1.85;}
.section-title{font-family:'DM Sans',system-ui,sans-serif;letter-spacing:-0.02em;font-size:clamp(1.6rem,2.5vw,2.2rem);font-weight:700;line-height:1.25;margin-bottom:0.8rem;color:var(--navy);}
.section-lead{font-size:0.95rem;color:var(--muted);max-width:600px;line-height:1.85;margin-bottom:2rem;}

/* BUTTONS */
.hero-actions{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;}
.btn-primary{display:inline-flex;align-items:center;gap:0.6rem;background:var(--blue);color:var(--white);font-size:0.88rem;font-weight:500;padding:0.8rem 1.8rem;border-radius:4px;text-decoration:none;transition:background 0.2s,transform 0.2s;border:none;cursor:pointer;box-shadow:0 2px 8px rgba(37,99,235,0.3);}
.btn-primary:hover{background:var(--navy);transform:translateY(-2px);}
.btn-ghost{display:inline-flex;align-items:center;color:rgba(255,255,255,0.8);font-size:0.88rem;text-decoration:none;transition:color 0.2s;border:1px solid rgba(255,255,255,0.3);padding:0.8rem 1.8rem;border-radius:4px;}
.btn-ghost:hover{color:#FFFFFF;border-color:rgba(255,255,255,0.6);}
.inline-link{color:var(--blue);font-size:0.88rem;text-decoration:none;font-weight:500;transition:color 0.2s;}
.inline-link:hover{color:var(--navy);}

/* METRICS */
.metrics-strip{position:absolute;bottom:2.5rem;left:4rem;right:4rem;z-index:2;display:flex;gap:2rem;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,0.15);padding-top:1.2rem;}
.metric-item{display:flex;flex-direction:column;gap:0.1rem;}
.metric-label{font-family:'DM Mono',monospace;font-size:0.66rem;color:rgba(255,255,255,0.5);letter-spacing:0.1em;text-transform:uppercase;}
.metric-value{font-family:'DM Mono',monospace;font-size:1rem;color:#93C5FD;font-weight:600;}
.metric-delta{font-size:0.68rem;}
.metric-delta.up{color:#86EFAC;}
.metric-delta.mid{color:#FDE68A;}
.metric-delta.low{color:#FCA5A5;}

/* LAYOUT */
section{position:relative;z-index:2;}
.section-inner{max-width:1080px;margin:0 auto;padding:5rem 4rem;}
.divider{width:100%;height:1px;background:var(--border);}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start;}

/* CARDS */
.trio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.trio-card{background:var(--white);border:1px solid var(--border);padding:2rem;border-radius:8px;box-shadow:var(--shadow);transition:box-shadow 0.3s,transform 0.3s;}
.trio-card:hover{box-shadow:var(--shadow2);transform:translateY(-2px);}
.trio-icon{font-size:1.4rem;margin-bottom:0.8rem;color:var(--blue);display:block;font-family:'DM Mono',monospace;}
.trio-card h3{font-size:0.95rem;font-weight:600;margin-bottom:0.4rem;color:var(--navy);}
.trio-card p{font-size:0.85rem;color:var(--muted);line-height:1.75;}
.nav-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:1.2rem;}
.nav-card{border:1px solid var(--border);padding:2rem;text-decoration:none;display:block;position:relative;background:var(--white);border-radius:8px;box-shadow:var(--shadow);transition:box-shadow 0.3s,transform 0.3s,border-color 0.3s;}
.nav-card:hover{box-shadow:var(--shadow2);transform:translateY(-2px);border-color:var(--blue);}
.nav-card-num{font-family:'DM Mono',monospace;font-size:1.6rem;color:var(--blue2);line-height:1;margin-bottom:0.6rem;font-weight:700;opacity:0.25;}
.nav-card h3{font-size:0.95rem;font-weight:600;margin-bottom:0.4rem;color:var(--navy);}
.nav-card p{font-size:0.83rem;color:var(--muted);line-height:1.75;}
.nav-card-arrow{position:absolute;bottom:1.5rem;right:1.5rem;color:var(--blue);font-size:1rem;transition:transform 0.2s;}
.nav-card:hover .nav-card-arrow{transform:translateX(4px);}

/* QUOTE */
.quote-block{border-left:3px solid var(--blue);padding:1.2rem 1.6rem;background:var(--bg2);margin:1.5rem 0;border-radius:0 4px 4px 0;}
.quote-block p{font-family:'DM Sans',system-ui,sans-serif;letter-spacing:-0.02em;font-size:1rem;line-height:1.7;color:var(--navy);font-style:italic;}
.quote-source{font-family:'DM Mono',monospace;font-size:0.7rem;color:var(--muted);margin-top:0.5rem;}
.quote-stack{display:flex;flex-direction:column;}

/* VIZ */
.viz-wrap{background:var(--white);border:1px solid var(--border);padding:1.5rem;border-radius:8px;box-shadow:var(--shadow);}
.viz-header{font-family:'DM Mono',monospace;font-size:0.7rem;color:var(--muted);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:1rem;}
.dimension-viz{display:flex;flex-direction:column;gap:0.8rem;}
.dim-row{display:flex;align-items:center;gap:0.8rem;}
.dim-label{font-family:'DM Mono',monospace;font-size:0.7rem;color:var(--muted);width:138px;flex-shrink:0;}
.dim-bar-track{flex:1;height:4px;background:var(--bg3);border-radius:2px;overflow:hidden;}
.dim-bar-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--blue),var(--accent));width:0;transition:width 1.8s cubic-bezier(0.16,1,0.3,1);}
.dim-score{font-family:'DM Mono',monospace;font-size:0.78rem;color:var(--blue);width:28px;text-align:right;flex-shrink:0;font-weight:600;}
.dim-lvl{font-family:'DM Mono',monospace;font-size:0.66rem;color:var(--muted);width:38px;flex-shrink:0;}
.viz-note{font-size:0.76rem;color:var(--muted);font-style:italic;border-top:1px solid var(--border);padding-top:0.8rem;margin-top:1rem;}
.dora-mini{border:1px solid var(--border);padding:1.2rem;margin-top:1.2rem;background:var(--white);border-radius:6px;box-shadow:var(--shadow);}
.dora-mini-label{font-family:'DM Mono',monospace;font-size:0.68rem;color:var(--muted);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:0.8rem;}
.dora-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.8rem;}
.dora-key{font-family:'DM Mono',monospace;font-size:0.66rem;color:var(--muted);}
.dora-val{font-family:'DM Mono',monospace;font-size:0.95rem;color:var(--blue);font-weight:600;}
.dora-val.warn{color:#D97706;}
.dora-val.danger{color:#DC2626;}

/* DIMS */
.dims-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--border);border:1px solid var(--border);margin-top:1rem;border-radius:8px;overflow:hidden;}
.dim-card{background:var(--white);padding:1.8rem 1.2rem;text-align:center;transition:background 0.2s;}
.dim-card:hover{background:var(--bg2);}
.dim-number{font-family:'DM Mono',monospace;font-size:1.6rem;font-weight:700;color:var(--bg3);line-height:1;margin-bottom:0.6rem;}
.dim-card h3{font-size:0.82rem;font-weight:600;margin-bottom:0.4rem;color:var(--navy);}
.dim-card p{font-size:0.78rem;color:var(--muted);line-height:1.65;}

/* LEVELS */
.levels-list{display:flex;flex-direction:column;gap:2px;margin-top:1rem;}
.level-row{display:grid;grid-template-columns:48px 1fr;border-radius:4px;overflow:hidden;box-shadow:var(--shadow);}
.level-num{background:var(--navy);display:flex;align-items:center;justify-content:center;font-family:'DM Mono',monospace;font-size:1.1rem;font-weight:600;color:var(--white);}
.level-content{background:var(--white);padding:1.2rem 1.6rem;border:1px solid var(--border);border-left:none;transition:background 0.2s;}
.level-row:hover .level-content{background:var(--bg2);}
.level-name{font-size:0.88rem;font-weight:600;margin-bottom:0.25rem;color:var(--navy);}
.level-desc{font-size:0.82rem;color:var(--muted);line-height:1.7;}

/* GQMM */
.gqmm-viz{padding-top:0.5rem;}
.gqmm-item{display:flex;align-items:center;gap:0.8rem;margin-bottom:0.7rem;}
.gqmm-dim{font-family:'DM Mono',monospace;font-size:0.7rem;color:#475569;width:160px;flex-shrink:0;}
.gqmm-bar{flex:1;height:4px;background:#E2E8F0;border-radius:2px;overflow:hidden;}
.gqmm-fill{height:100%;border-radius:2px;background:linear-gradient(90deg,#7C3AED,#A78BFA);}
.gqmm-score{font-family:'DM Mono',monospace;font-size:0.7rem;color:#7C3AED;width:60px;flex-shrink:0;font-weight:600;}

/* REGULATORY */
.reg-stack{display:flex;flex-direction:column;gap:2px;margin-top:1rem;}
.reg-card{background:var(--white);padding:1.8rem 2rem;border:1px solid var(--border);border-left:3px solid var(--border);transition:border-color 0.3s,box-shadow 0.3s;border-radius:0 6px 6px 0;}
.reg-card:hover{border-left-color:var(--blue);box-shadow:var(--shadow2);}
.reg-tag{font-family:'DM Mono',monospace;font-size:0.7rem;color:var(--blue);letter-spacing:0.1em;text-transform:uppercase;margin-bottom:0.6rem;}
.reg-card h3{font-size:0.95rem;font-weight:600;margin-bottom:0.5rem;color:var(--navy);}
.reg-card p{font-size:0.85rem;color:var(--muted);line-height:1.8;}

/* BENEFIT */
.benefit-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-top:1rem;}
.benefit-card{border:1px solid var(--border);padding:1.6rem;background:var(--white);border-radius:8px;box-shadow:var(--shadow);transition:box-shadow 0.3s;}
.benefit-card:hover{box-shadow:var(--shadow2);}
.benefit-icon{font-size:1.3rem;margin-bottom:0.7rem;display:block;}
.benefit-card h3{font-size:0.9rem;font-weight:600;margin-bottom:0.4rem;color:var(--navy);}
.benefit-card p{font-size:0.82rem;color:var(--muted);line-height:1.75;}

/* FRAMEWORK TABLE */
.framework-table{border:1px solid var(--border);overflow:hidden;margin-top:1rem;border-radius:8px;box-shadow:var(--shadow);}
.fw-header{display:grid;grid-template-columns:1fr 1.6fr;background:var(--navy);padding:0.8rem 1.4rem;font-family:'DM Mono',monospace;font-size:0.7rem;color:rgba(255,255,255,0.6);letter-spacing:0.1em;text-transform:uppercase;gap:2rem;}
.fw-row{display:grid;grid-template-columns:1fr 1.6fr;padding:1.1rem 1.4rem;gap:2rem;border-top:1px solid var(--border);background:var(--white);transition:background 0.2s;}
.fw-row:hover{background:var(--bg2);}
.fw-name{font-size:0.85rem;color:var(--navy);display:flex;align-items:flex-start;gap:0.5rem;flex-direction:column;font-weight:500;}
.fw-tag{font-family:'DM Mono',monospace;font-size:0.68rem;color:var(--blue);letter-spacing:0.08em;font-weight:600;}
.fw-desc{font-size:0.82rem;color:var(--muted);line-height:1.75;}

/* CONTACT */
.contact-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:4rem;align-items:start;}
.contact-items{display:flex;flex-direction:column;gap:1rem;}
.contact-item{display:flex;gap:1rem;align-items:flex-start;}
.ci-icon{color:var(--blue);font-family:'DM Mono',monospace;font-size:1rem;flex-shrink:0;padding-top:0.1rem;}
.ci-label{font-family:'DM Mono',monospace;font-size:0.7rem;color:var(--muted);letter-spacing:0.08em;text-transform:uppercase;margin-bottom:0.2rem;}
.ci-val{font-size:0.88rem;color:var(--navy);font-weight:500;}
.ci-val a{color:var(--blue);text-decoration:none;}
.ci-val a:hover{text-decoration:underline;}
.contact-form-wrap{background:var(--white);border:1px solid var(--border);padding:2.2rem;border-radius:10px;box-shadow:var(--shadow2);}
.contact-form-header{font-family:'DM Mono',monospace;font-size:0.74rem;color:var(--navy);letter-spacing:0.12em;text-transform:uppercase;margin-bottom:1.5rem;padding-bottom:0.8rem;border-bottom:1px solid var(--border);font-weight:600;}
.contact-form{display:flex;flex-direction:column;gap:1rem;}
.form-group{display:flex;flex-direction:column;gap:0.35rem;}
.form-group label{font-family:'DM Mono',monospace;font-size:0.7rem;color:var(--muted);letter-spacing:0.08em;text-transform:uppercase;}
.form-group input,.form-group textarea{background:var(--bg2);border:1px solid var(--border);color:var(--text);font-family:'DM Sans',sans-serif;font-size:0.9rem;padding:0.7rem 0.9rem;border-radius:6px;outline:none;transition:border-color 0.2s;}
.form-group input:focus,.form-group textarea:focus{border-color:var(--blue);background:var(--white);}
.form-group textarea{resize:vertical;}
.form-submit{align-self:flex-start;background:var(--blue);color:var(--white);border:none;cursor:pointer;font-family:'DM Sans',sans-serif;font-size:0.88rem;font-weight:500;padding:0.8rem 1.8rem;border-radius:6px;letter-spacing:0.03em;transition:background 0.2s,transform 0.2s;box-shadow:0 2px 8px rgba(37,99,235,0.3);}
.form-submit:hover{background:var(--navy);transform:translateY(-1px);}
.form-note{font-size:0.76rem;color:var(--muted);}

/* REFERENCES */
.references{background:var(--bg2);padding:2.5rem 4rem;border-top:1px solid var(--border);}
.references-inner{max-width:1080px;margin:0 auto;}
.ref-title{font-family:'DM Mono',monospace;font-size:0.7rem;color:var(--muted);letter-spacing:0.12em;text-transform:uppercase;margin-bottom:1.2rem;padding-bottom:0.6rem;border-bottom:1px solid var(--border);}
.ref-list{display:flex;flex-direction:column;gap:0.4rem;}
.ref-item{font-size:0.78rem;color:var(--muted);line-height:1.6;}
.ref-item strong{color:var(--navy);font-weight:600;}

/* FOOTER */
footer{background:var(--bg2);border-top:1px solid var(--border);padding:1.6rem 4rem;display:flex;align-items:center;gap:2rem;flex-wrap:wrap;}
.footer-brand{font-family:'DM Mono',monospace;font-size:0.78rem;color:var(--navy);letter-spacing:0.08em;margin-right:auto;font-weight:600;}
.footer-nav{display:flex;gap:1.8rem;}
.footer-nav a{font-size:0.78rem;color:var(--muted);text-decoration:none;transition:color 0.2s;}
.footer-nav a:hover{color:var(--navy);}
.footer-copy{font-size:0.74rem;color:var(--muted);}

/* REVEAL */
.reveal{opacity:0;transform:translateY(20px);transition:opacity 0.6s ease,transform 0.6s ease;}
.reveal.visible{opacity:1;transform:none;}

/* RESPONSIVE */
@media(max-width:960px){
  nav{padding:1rem 1.5rem;}
  .nav-toggle{display:block;}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--white);flex-direction:column;gap:0;border-bottom:1px solid var(--border);box-shadow:var(--shadow2);padding:0.5rem 0;}
  .nav-links.open{display:flex;}
  .nav-links a{padding:0.8rem 1.5rem;border-bottom:none;}
  .nav-cta{display:none;}
  .hero,.page-hero{padding-left:1.5rem;padding-right:1.5rem;}
  .section-inner{padding:3rem 1.5rem;}
  .metrics-strip{left:1.5rem;right:1.5rem;gap:1rem;}
  .two-col{grid-template-columns:1fr;gap:2rem;}
  .trio-grid,.nav-cards,.benefit-grid{grid-template-columns:1fr;}
  .dims-grid{grid-template-columns:repeat(2,1fr);}
  .contact-layout{grid-template-columns:1fr;}
  .references{padding:2rem 1.5rem;}
  footer{padding:1.2rem 1.5rem;flex-direction:column;align-items:flex-start;gap:0.8rem;}
  .footer-nav{display:none;}
  .fw-header,.fw-row{grid-template-columns:1fr;}
}
@media(max-width:600px){
  .hero{min-height:70vh;padding-top:5rem;padding-bottom:5rem;}
  .hero h1{font-size:2rem;}
  .page-hero{min-height:30vh;padding-top:4rem;}
  .page-title{font-size:1.8rem;}
  .metrics-strip{display:none;}
  .dims-grid{grid-template-columns:1fr;}
}