/* =========================================================
   KODEX — CLEAN UNIFIED STYLES
   DA: noir / blanc / gris / vert #84CC16
   Compatible: index / services / projects / project / contact
========================================================= */

:root {
    --background: #070707;
    --surface: #101010;
    --surface-light: #151515;
    --surface-alt: #141414;
    --surface-deep: #0b0b0b;
    --surface-control: #1e1e1e;
    --border: rgba(255,255,255,.09);
    --border-strong: rgba(255,255,255,.17);
    --border-track: #242424;
    --text: #f5f5f5;
    --text-strong: #ffffff;
    --muted: #858585;
    --muted-light: #b5b5b5;
    --muted-dark: #555555;
    --accent: #84CC16;
    --accent-light: #A3E635;
    --blue: #38BDF8;
    --orange: #F97316;
    --max-width: 1200px;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--background); color:var(--text); font-family:"Inter",sans-serif; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button, input, select, textarea { font:inherit; }
button { border:0; background:none; color:inherit; cursor:pointer; }
::selection { background:var(--accent); color:#000; }

::-webkit-scrollbar { width:7px; }
::-webkit-scrollbar-track { background:var(--background); }
::-webkit-scrollbar-thumb { background:var(--border-track); border-radius:20px; }

/* Background atmosphere */
.background-glow {
    position:fixed;
    width:500px;
    height:500px;
    border-radius:50%;
    pointer-events:none;
    filter:blur(140px);
    opacity:.06;
    z-index:-1;
}
.glow-one { top:-200px; right:-150px; background:var(--accent); }
.glow-two { bottom:10%; left:-300px; background:var(--blue); }

/* Navbar */
.navbar {
    position:fixed;
    top:0; left:0; width:100%;
    z-index:1000;
    padding:20px 24px;
    border-bottom:1px solid transparent;
    transition:.3s ease;
}
.navbar.scrolled {
    background:rgba(7,7,7,.82);
    backdrop-filter:blur(18px);
    border-bottom-color:var(--border);
}
.nav-container {
    max-width:var(--max-width);
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
}
.logo { font-size:24px; font-weight:800; letter-spacing:-1.5px; }
.logo span { color:var(--accent); }
.nav-links { display:flex; align-items:center; gap:32px; margin-left:auto; margin-right:36px; }
.nav-links a { position:relative; font-size:13px; color:var(--muted-light); transition:.2s ease; }
.nav-links a:hover, .nav-links a.active { color:var(--text-strong); }
.nav-links a.active::after { content:""; position:absolute; left:0; right:0; bottom:-9px; height:1px; background:var(--accent); }
.nav-button, .nav-cta {
    display:inline-flex; align-items:center; justify-content:center;
    padding:11px 17px;
    border:1px solid var(--border);
    border-radius:8px;
    font-size:12px; font-weight:600;
    transition:.25s ease;
}
.nav-button:hover, .nav-cta:hover { border-color:rgba(132,204,22,.45); background:rgba(132,204,22,.055); transform:translateY(-1px); }
.menu-button, .menu-toggle {
    display:none;
    width:42px; height:42px;
    border:1px solid var(--border);
    border-radius:8px;
    background:rgba(255,255,255,.02);
}
.menu-button span, .menu-toggle span { display:block; width:18px; height:1px; margin:5px auto; background:var(--text-strong); }

/* Generic buttons */
.primary-button, .secondary-button, .btn, .primary-btn {
    display:inline-flex; align-items:center; justify-content:center;
    gap:12px; min-height:46px; padding:14px 18px;
    border-radius:8px; font-size:13px; font-weight:600; transition:.25s ease;
}
.primary-button, .btn-primary, .primary-btn { background:var(--accent); color:#050505; }
.primary-button:hover, .btn-primary:hover, .primary-btn:hover { background:var(--accent-light); transform:translateY(-2px); }
.secondary-button, .btn-secondary, .secondary-btn { border:1px solid var(--border); color:var(--muted-light); }
.secondary-button:hover, .btn-secondary:hover, .secondary-btn:hover { color:var(--text-strong); border-color:var(--border-strong); transform:translateY(-2px); }
.hero-actions { display:flex; gap:12px; margin-top:35px; }

/* Hero */
.hero {
    max-width:var(--max-width);
    min-height:900px;
    margin:auto;
    display:grid;
    grid-template-columns:1.05fr .95fr;
    align-items:center;
    padding:150px 24px 100px;
    gap:60px;
}
.hero-badge {
    display:inline-flex; align-items:center; gap:9px;
    padding:8px 12px; margin-bottom:30px;
    border:1px solid var(--border); border-radius:100px;
    color:var(--muted-light); font-size:11px; text-transform:uppercase; letter-spacing:.7px;
}
.hero-badge span:first-child, .status-dot { width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 10px rgba(132,204,22,.7); }
.hero h1 { font-size:clamp(55px,7vw,92px); line-height:.98; letter-spacing:-5px; font-weight:800; }
.hero h1 span, .cta-content h2 span, .cta-box h2 span, .project-hero h1 span { color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.5); }
.hero-description { max-width:520px; margin-top:35px; color:var(--muted); font-size:16px; line-height:1.7; }
.hero-stats { display:flex; align-items:center; gap:22px; margin-top:80px; }
.stat { display:flex; flex-direction:column; gap:5px; }
.stat strong { font-size:19px; }
.stat span { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.6px; }
.stat-line { width:1px; height:30px; background:var(--border); }

/* Existing landing visual */
.hero-visual { position:relative; height:520px; display:flex; align-items:center; justify-content:center; }
.visual-card { width:440px; height:340px; border:1px solid rgba(255,255,255,.12); border-radius:16px; background:var(--surface-deep); box-shadow:0 50px 100px rgba(0,0,0,.5); transform:perspective(1000px) rotateY(-7deg) rotateX(4deg); }
.window-top { height:40px; padding:0 15px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--border); }
.window-dots { display:flex; gap:5px; }
.window-dots span { width:6px; height:6px; border-radius:50%; background:var(--border-strong); }
.window-url { color:var(--muted-dark); font-size:9px; }
.visual-content { padding:45px; }
.mini-label { color:var(--accent); font-size:8px; letter-spacing:2px; }
.mini-title { margin-top:18px; font-size:34px; line-height:1; font-weight:700; letter-spacing:-2px; }
.mini-title span { color:var(--muted); }
.mini-lines { margin-top:25px; }
.mini-lines span { display:block; width:160px; height:5px; margin-bottom:7px; background:var(--surface-control); border-radius:10px; }
.mini-lines span:nth-child(2){ width:120px; } .mini-lines span:nth-child(3){ width:145px; }
.mini-button { display:inline-block; margin-top:25px; padding:8px 14px; border-radius:5px; background:var(--accent); color:#050505; font-size:9px; font-weight:700; }
.floating-card { position:absolute; display:flex; align-items:center; gap:12px; padding:13px 15px; border:1px solid var(--border); border-radius:10px; background:rgba(18,18,18,.85); backdrop-filter:blur(15px); box-shadow:0 20px 50px rgba(0,0,0,.35); }
.floating-card strong { display:block; font-size:11px; } .floating-card small { display:block; margin-top:4px; color:var(--muted); font-size:8px; }
.floating-icon { width:30px; height:30px; display:grid; place-items:center; border-radius:7px; background:rgba(132,204,22,.1); color:var(--accent); }
.floating-card-one { top:80px; right:-10px; } .floating-card-two { bottom:70px; left:-10px; }

/* Internal page hero */
.page-hero, .contact-hero {
    width:100%; max-width:none; min-height:760px; margin:0; padding:180px 6vw 100px;
    display:flex; align-items:center; position:relative; overflow:hidden; background:var(--background);
}
.page-hero::before, .contact-hero::before, .project-hero::before {
    content:""; position:absolute; width:520px; height:520px; right:-180px; top:80px; border-radius:50%;
    background:rgba(132,204,22,.055); filter:blur(120px); pointer-events:none;
}
.page-hero::after, .contact-hero::after, .project-hero::after { content:none !important; }
.page-hero-inner, .contact-hero-content, .project-hero-content { position:relative; z-index:2; width:100%; max-width:var(--max-width); margin:auto; }
.page-hero h1, .project-hero h1 { margin:0; }
.page-hero p { max-width:600px; margin-top:30px; color:var(--muted); font-size:16px; line-height:1.75; }

/* Sections */
.section { max-width:var(--max-width); margin:auto; padding:130px 24px; }
.section-header { display:grid; grid-template-columns:1fr 350px; align-items:end; gap:60px; margin-bottom:65px; }
.section-label { color:var(--accent); font-size:10px; font-weight:600; letter-spacing:1.5px; }
.section-header h2, .about-title h2, .pricing-intro h2 { margin-top:18px; font-size:clamp(45px,5vw,68px); line-height:1; letter-spacing:-3px; }
.section-header h2 span, .about-title h2 span, .pricing-intro h2 span { color:var(--muted); }
.section-header>p { color:var(--muted); font-size:14px; line-height:1.7; }

/* Services */
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.service-card { position:relative; min-height:350px; padding:32px; overflow:hidden; border:1px solid var(--border); border-radius:14px; background:rgba(15,15,15,.72); transition:.3s ease; }
.service-card:hover { transform:translateY(-5px); border-color:rgba(132,204,22,.25); }
.service-number { position:absolute; top:30px; right:30px; color:var(--border-strong); font-size:11px; }
.service-icon { width:45px; height:45px; display:grid; place-items:center; margin-bottom:28px; border:1px solid var(--border); border-radius:10px; color:var(--accent); font-size:17px; }
.service-card h3 { margin-top:20px; font-size:23px; letter-spacing:-.7px; }
.service-card p { margin-top:13px; color:var(--muted); font-size:13px; line-height:1.7; }
.service-card ul { margin-top:22px; display:flex; flex-direction:column; gap:9px; }
.service-card li { position:relative; padding-left:17px; color:#999; font-size:11px; }
.service-card li::before { content:"→"; position:absolute; left:0; color:var(--accent); }

/* Pricing */
.pricing-section { position:relative; overflow:hidden; }
.pricing-intro { display:grid; grid-template-columns:1fr 350px; align-items:end; gap:60px; margin-bottom:65px; }
.pricing-intro>p { color:var(--muted); font-size:14px; line-height:1.7; }
.pricing-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.pricing-card { position:relative; min-height:590px; padding:28px; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--border); border-radius:14px; background:var(--surface); transition:.3s ease; }
.pricing-card:hover { transform:translateY(-5px); border-color:var(--border-strong); }
.pricing-card.featured { border-color:rgba(132,204,22,.3); background:linear-gradient(145deg,rgba(132,204,22,.045),transparent 50%),var(--surface); }
.pricing-glow { position:absolute; width:200px; height:200px; top:-130px; right:-100px; border-radius:50%; background:rgba(132,204,22,.1); filter:blur(55px); }
.pricing-card>* { position:relative; z-index:1; }
.pricing-top { display:flex; align-items:flex-start; justify-content:space-between; }
.pricing-top>div { display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.pricing-name { font-size:17px; font-weight:800; }
.pricing-index { color:var(--border-strong); font-size:10px; }
.pricing-tag { padding:5px 8px; border:1px solid var(--border); border-radius:5px; color:#777; font-size:9px; text-transform:uppercase; letter-spacing:.7px; }
.pricing-tag.popular { color:var(--accent); border-color:rgba(132,204,22,.3); background:rgba(132,204,22,.05); }
.pricing-description { min-height:78px; margin-top:28px; color:var(--muted); font-size:12px; line-height:1.75; }
.pricing-price { min-height:95px; display:flex; flex-direction:column; justify-content:center; }
.pricing-price small { color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.8px; }
.pricing-price strong { margin-top:4px; color:var(--text); font-size:36px; line-height:1; letter-spacing:-2px; }
.pricing-card.featured .pricing-price strong { color:var(--accent); }
.custom-price strong { font-size:28px; }
.pricing-divider { height:1px; margin:4px 0 23px; background:var(--border); }
.pricing-features { flex:1; display:flex; flex-direction:column; gap:12px; }
.pricing-features li { position:relative; padding-left:19px; color:var(--muted-light); font-size:11px; line-height:1.5; }
.pricing-features li::before { content:"✓"; position:absolute; left:0; color:var(--accent); font-weight:800; }
.pricing-btn { width:100%; min-height:45px; margin-top:28px; display:flex; align-items:center; justify-content:center; border:1px solid var(--border); border-radius:8px; color:var(--text); background:rgba(255,255,255,.02); font-size:11px; font-weight:700; transition:.25s ease; }
.pricing-btn:hover { transform:translateY(-2px); border-color:var(--border-strong); background:var(--surface-light); }
.pricing-btn.primary { background:var(--accent); border-color:var(--accent); color:#050505; }
.pricing-btn.primary:hover { background:var(--accent-light); border-color:var(--accent-light); }
.pricing-note { margin-top:20px; color:var(--muted-dark); font-size:10px; }

/* Projects */
.projects-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.project-card { overflow:hidden; border:1px solid var(--border); border-radius:14px; background:var(--surface); transition:.3s ease; }
.project-card:hover { transform:translateY(-5px); border-color:rgba(255,255,255,.16); }
.project-large { grid-column:span 2; }
.project-preview { position:relative; height:330px; padding:25px; overflow:hidden; display:block; }
.project-large .project-preview { height:390px; }
.meetnote-preview { background:var(--surface-deep); }
.preview-navbar, .tibco-header { display:flex; align-items:center; justify-content:space-between; color:var(--muted-light); font-size:10px; }
.preview-navbar strong, .tibco-header strong { color:var(--text-strong); font-size:14px; }
.preview-dashboard, .tibco-dashboard { display:flex; width:82%; height:235px; margin:30px auto 0; border:1px solid var(--border); border-radius:9px; background:var(--surface-deep); }
.preview-sidebar, .tibco-side { width:45px; padding:15px 10px; display:flex; flex-direction:column; align-items:center; gap:16px; border-right:1px solid var(--border); }
.preview-sidebar span, .tibco-side span { width:14px; height:14px; border-radius:4px; background:var(--border-track); }
.preview-sidebar .active, .tibco-side .active { background:var(--accent); }
.preview-main, .tibco-content { padding:30px; }
.preview-main small, .tibco-content small { color:var(--muted); font-size:8px; }
.preview-main h4, .tibco-content h4 { margin-top:10px; font-size:23px; line-height:1.1; letter-spacing:-1px; }
.preview-cards { display:flex; gap:8px; margin-top:25px; }
.preview-cards div { width:90px; height:45px; border:1px solid var(--border); border-radius:5px; }
.servio-preview { background:var(--surface); }
.servio-logo { font-size:20px; font-weight:800; }
.servio-logo span { color:var(--accent); }
.servio-text { margin-top:65px; }
.servio-text span { color:var(--accent); font-size:9px; }
.servio-text strong { display:block; margin-top:12px; font-size:30px; line-height:1.05; letter-spacing:-1.5px; }
.servio-boxes { position:absolute; right:35px; bottom:30px; display:flex; gap:7px; }
.servio-boxes span { width:45px; height:45px; border:1px solid var(--border); border-radius:7px; }
.toolpilot-preview { background:var(--surface-deep); }
.toolpilot-topbar {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    font-size:12px;
}
.toolpilot-brand {
    display:flex;
    flex-direction:column;
    gap:4px;
}
.toolpilot-brand strong {
    font-size:15px;
    letter-spacing:-.4px;
}
.toolpilot-brand span {
    color:var(--muted);
    font-size:8px;
    letter-spacing:.16em;
}
.toolpilot-count {
    color:var(--accent);
    font-size:10px;
    padding-top:2px;
    white-space:nowrap;
}
.toolpilot-searchbar {
    height:42px;
    margin-top:28px;
    padding:0 14px;
    display:flex;
    align-items:center;
    gap:9px;
    border:1px solid var(--border);
    border-radius:8px;
    background:var(--surface-deep);
    color:var(--muted);
    font-size:10px;
}
.toolpilot-searchbar span:first-child {
    color:var(--accent);
    font-size:15px;
}
.toolpilot-layout {
    display:grid;
    grid-template-columns:150px 1fr;
    gap:12px;
    margin-top:14px;
}
.toolpilot-categories {
    display:flex;
    flex-direction:column;
    gap:7px;
}
.toolpilot-category {
    min-height:44px;
    padding:8px 10px;
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid var(--border);
    border-radius:7px;
    background:var(--surface-deep);
}
.toolpilot-category span {
    width:24px;
    height:24px;
    display:grid;
    place-items:center;
    border:1px solid var(--border);
    border-radius:6px;
    color:var(--muted);
    font-size:7px;
    font-weight:700;
}
.toolpilot-category strong {
    color:#b8b8b8;
    font-size:9px;
}
.toolpilot-category.active {
    border-color:rgba(132,204,22,.3);
    background:rgba(132,204,22,.045);
}
.toolpilot-category.active span {
    border-color:rgba(132,204,22,.3);
    color:var(--accent);
}
.toolpilot-category.active strong {
    color:var(--text-strong);
}
.toolpilot-results {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
}
.toolpilot-result-card {
    min-height:105px;
    padding:14px;
    border:1px solid var(--border);
    border-radius:8px;
    background:var(--surface-deep);
}
.toolpilot-result-card.compare {
    background:linear-gradient(145deg,rgba(132,204,22,.06),var(--surface-deep) 70%);
}
.toolpilot-result-head {
    display:flex;
    flex-direction:column;
    gap:7px;
}
.toolpilot-result-head span {
    color:var(--accent);
    font-size:7px;
    letter-spacing:.12em;
}
.toolpilot-result-head strong {
    color:var(--text);
    font-size:11px;
}
.toolpilot-result-card small {
    display:block;
    margin-top:18px;
    color:var(--muted);
    font-size:8px;
    line-height:1.5;
}
.tibco-preview { background:var(--surface-deep); }
.tibco-stats { display:flex; gap:8px; margin-top:25px; }
.tibco-stats div { min-width:90px; padding:10px; border:1px solid var(--border); border-radius:5px; }
.tibco-stats span { display:block; color:var(--muted); font-size:8px; }
.tibco-stats strong { display:block; margin-top:5px; font-size:16px; }
.project-info { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; padding:25px 27px 28px; }
.project-category { color:var(--accent); font-size:9px; text-transform:uppercase; letter-spacing:1px; }
.project-info h3 { margin-top:10px; font-size:21px; }
.project-info p { max-width:600px; margin-top:7px; color:var(--muted); font-size:12px; line-height:1.6; }
.project-arrow, .project-link { width:40px; height:40px; flex-shrink:0; display:grid; place-items:center; border:1px solid var(--border); border-radius:50%; color:var(--text-strong); font-size:13px; transition:.25s ease; }
.project-card:hover .project-arrow, .project-link:hover { background:var(--accent); color:#000; border-color:var(--accent); }
.project-preview-overlay { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(7,7,7,.68); opacity:0; transition:.3s ease; z-index:10; }
.project-preview-overlay span { padding:11px 16px; border:1px solid rgba(255,255,255,.18); border-radius:7px; background:rgba(10,10,10,.82); color:var(--text-strong); font-size:11px; transform:translateY(8px); transition:.3s ease; }
.project-card:hover .project-preview-overlay { opacity:1; }
.project-card:hover .project-preview-overlay span { transform:translateY(0); }

/* Stack */
.project-stack-section { padding-top:40px; }
.stack-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:60px; }
.stack-item { min-height:180px; padding:25px; display:flex; flex-direction:column; justify-content:space-between; border:1px solid var(--border); border-radius:14px; background:var(--surface); transition:.3s ease; }
.stack-item:hover { transform:translateY(-4px); border-color:rgba(132,204,22,.28); }
.stack-item>span { color:var(--accent); font-size:9px; letter-spacing:1px; }
.stack-item strong { font-size:20px; letter-spacing:-.5px; }
.stack-item small { color:var(--muted); font-size:11px; }

/* Process */
.process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.process-item, .process-card { min-height:250px; padding:28px; border:1px solid var(--border); border-radius:14px; background:var(--surface); transition:.3s ease; }
.process-item:hover, .process-card:hover { transform:translateY(-5px); border-color:rgba(132,204,22,.25); }
.process-number, .process-card>span { color:var(--accent); font-size:10px; }
.process-item h3, .process-card h3 { margin-top:75px; font-size:20px; }
.process-item p, .process-card p { margin-top:10px; color:var(--muted); font-size:12px; line-height:1.7; }

/* Contact */
.contact-section { padding-top:80px; }
.contact-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; align-items:start; }
.contact-info h2 { margin-top:18px; font-size:clamp(45px,5vw,68px); line-height:1; letter-spacing:-3px; }
.contact-info h2 span { color:var(--muted); }
.contact-info>p { max-width:400px; margin-top:25px; color:var(--muted); font-size:13px; line-height:1.8; }
.contact-details { margin-top:50px; display:flex; flex-direction:column; gap:25px; }
.contact-details a, .contact-details div { display:flex; flex-direction:column; gap:7px; color:#ddd; font-size:13px; }
.contact-details span { color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:1px; }
.contact-details a:hover { color:var(--accent); }
.contact-form-wrapper { position:relative; padding:35px; overflow:hidden; border:1px solid var(--border); border-radius:14px; background:var(--surface); }
.contact-form-wrapper::before { content:""; position:absolute; width:220px; height:220px; top:-150px; right:-100px; border-radius:50%; background:rgba(132,204,22,.055); filter:blur(55px); pointer-events:none; }
.contact-form-wrapper form { position:relative; z-index:1; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:15px; }
.form-group { display:flex; flex-direction:column; gap:9px; margin-bottom:20px; }
.form-group label { color:var(--muted-light); font-size:10px; text-transform:uppercase; letter-spacing:.7px; }
.form-group input, .form-group select, .form-group textarea { width:100%; padding:14px; border:1px solid var(--border); border-radius:7px; outline:none; background:var(--surface-deep); color:var(--text-strong); font-size:12px; transition:.2s ease; }
.form-group input::placeholder, .form-group textarea::placeholder { color:var(--muted-dark); }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:rgba(132,204,22,.5); }
.form-group textarea { resize:vertical; min-height:150px; }
.form-button { border:0; cursor:pointer; margin-top:5px; }
.form-message { margin-top:15px; min-height:18px; font-size:11px; color:var(--accent); }

/* =========================================
   ABOUT — 03 / À PROPOS
========================================= */

.about-section {
    position: relative;
    overflow: hidden;
    scroll-margin-top: 100px;
}

.about-grid {
    max-width: var(--max-width);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 0.85fr 1.15fr;
    gap: 90px;
    align-items: start;
}

.about-title {
    position: sticky;
    top: 140px;
}

.about-title .section-label {
    display: block;
}

.about-title h2 {
    margin-top: 18px;
    font-size: clamp(52px, 6vw, 82px);
    line-height: .95;
    letter-spacing: -4px;
    font-weight: 800;
}

.about-title h2 span {
    color: transparent;
    -webkit-text-stroke: 1px rgba(255,255,255,.45);
}

.about-content {
    max-width: 700px;
}

.about-big-text {
    max-width: 650px;
    margin: 0;
    color: #e8e8e8 !important;
    font-size: 29px !important;
    line-height: 1.35 !important;
    letter-spacing: -1px;
}

.about-content > p:not(.about-big-text) {
    max-width: 620px;
    margin-top: 28px;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.9;
}

.about-points {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-top: 55px;
}

.about-points > div {
    min-height: 105px;
    padding: 18px 0 0;
    border-top: 1px solid var(--border);
    transition: transform .25s ease, border-color .25s ease;
}

.about-points > div:hover {
    transform: translateY(-3px);
    border-color: rgba(132,204,22,.35);
}

.about-points span {
    display: block;
    color: var(--accent);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
}

.about-points strong {
    display: block;
    margin-top: 18px;
    color: var(--text);
    font-size: 13px;
    font-weight: 600;
}

/* About responsive */
@media (max-width: 900px) {
    .about-grid {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .about-title {
        position: static;
    }

    .about-title h2 {
        font-size: 58px;
        letter-spacing: -3px;
    }

    .about-content {
        max-width: 100%;
    }
}

@media (max-width: 650px) {
    .about-grid {
        gap: 35px;
    }

    .about-title h2 {
        font-size: 48px;
        letter-spacing: -3px;
    }

    .about-big-text {
        font-size: 23px !important;
        line-height: 1.4 !important;
    }

    .about-content > p:not(.about-big-text) {
        font-size: 13px;
        line-height: 1.8;
    }

    .about-points {
        grid-template-columns: 1fr;
        gap: 0;
        margin-top: 40px;
    }

    .about-points > div {
        min-height: auto;
        padding: 17px 0 20px;
    }
}

/* CTA */
.cta-section { position:relative; padding:100px 24px; max-width:var(--max-width); margin:50px auto 0; display:flex; align-items:center; justify-content:center; min-height:600px; border-top:1px solid var(--border); border-bottom:1px solid var(--border); text-align:center; overflow:hidden; }
.cta-box, .cta-content { position:relative; }
.cta-box { width:100%; padding:85px 40px; border:1px solid var(--border); border-radius:16px; background:var(--surface); }
.cta-box::before { content:""; position:absolute; width:320px; height:320px; left:50%; top:-200px; transform:translateX(-50%); border-radius:50%; background:rgba(132,204,22,.055); filter:blur(80px); }
.cta-box>* { position:relative; }
.cta-content h2, .cta-box h2 { margin-top:20px; font-size:clamp(50px,7vw,85px); line-height:.98; letter-spacing:-5px; }
.cta-content p, .cta-box p { max-width:500px; margin:30px auto; color:var(--muted); font-size:14px; line-height:1.7; }

/* Footer */
.footer { max-width:var(--max-width); margin:auto; padding:70px 24px 25px; }
.footer-container { display:flex; align-items:flex-end; justify-content:space-between; gap:60px; padding-top:30px; border-top:1px solid var(--border); }
.footer-brand p { margin-top:15px; color:var(--muted); font-size:11px; line-height:1.6; }
.footer-links { display:flex; gap:35px; }
.footer-links a { color:#999; font-size:11px; transition:.2s ease; }
.footer-links a:hover { color:var(--text-strong); }
.footer-copy { color:var(--muted-dark); font-size:9px; }

/* Mobile menu */
.mobile-menu { position:fixed; inset:0; z-index:2000; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:28px; background:rgba(7,7,7,.98); opacity:0; visibility:hidden; transform:translateY(-10px); transition:.25s ease; }
.mobile-menu.open { opacity:1; visibility:visible; transform:translateY(0); }
.mobile-menu a { font-size:28px; font-weight:700; letter-spacing:-1px; }
.mobile-close { position:absolute; top:22px; right:22px; color:var(--text-strong); font-size:36px; }
.mobile-menu-cta { padding:13px 18px; border:1px solid rgba(132,204,22,.3); border-radius:8px; color:var(--accent); font-size:13px !important; }

/* Project detail */
.project-hero { min-height:72vh; display:flex; align-items:flex-end; padding:180px 6vw 100px; position:relative; overflow:hidden; }
.project-hero-content { max-width:var(--max-width); }
.back-link { display:inline-flex; margin-bottom:55px; color:var(--muted); font-size:14px; transition:.25s ease; }
.back-link:hover { color:var(--text-strong); transform:translateX(-4px); }
.project-hero .project-category { margin-bottom:22px; font-size:12px; font-weight:700; letter-spacing:.18em; }
.project-hero p { max-width:650px; margin-top:35px; color:var(--muted); font-size:19px; line-height:1.7; }
.project-meta { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; max-width:900px; margin-top:70px; padding-top:30px; border-top:1px solid var(--border); }
.project-meta div { display:flex; flex-direction:column; gap:9px; }
.project-meta span { color:var(--muted); font-size:11px; letter-spacing:.14em; text-transform:uppercase; }
.project-meta strong { color:var(--text); font-size:14px; }
.project-showcase { padding:20px 6vw 120px; }
.project-browser { max-width:1250px; margin:auto; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:16px; background:var(--surface); box-shadow:0 40px 100px rgba(0,0,0,.5); }
.browser-bar { height:48px; display:flex; align-items:center; position:relative; padding:0 18px; border-bottom:1px solid rgba(255,255,255,.08); }
.browser-dots { display:flex; gap:7px; }
.browser-dots span { width:9px; height:9px; border-radius:50%; background:var(--border-strong); }
.browser-url { position:absolute; left:50%; transform:translateX(-50%); color:var(--muted); font-size:11px; }
.project-screen { min-height:570px; position:relative; overflow:hidden; background:radial-gradient(circle at 70% 20%,rgba(132,204,22,.055),transparent 35%),#090909; }
.screen-content { position:absolute; inset:10%; padding:50px; border:1px solid rgba(255,255,255,.06); border-radius:12px; }
.screen-line { background:var(--surface-control); border-radius:5px; margin-bottom:15px; }
.screen-line.large { width:48%; height:45px; } .screen-line.medium { width:34%; height:16px; } .screen-line.small { width:25%; height:12px; }
.screen-grid { margin-top:55px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.screen-grid div { height:220px; border-radius:10px; border:1px solid rgba(255,255,255,.06); background:var(--surface-deep); }
.project-description { padding:0 6vw 120px; }
.project-description-inner { max-width:1050px; margin:auto; display:grid; grid-template-columns:1fr 1.4fr; gap:90px; }
.project-description h2 { font-size:clamp(38px,5vw,60px); line-height:1; letter-spacing:-3px; }
.project-description h2 span { color:var(--muted); }
.project-description p { color:var(--muted); font-size:14px; line-height:1.9; }
.project-tech { margin-top:28px; display:flex; flex-wrap:wrap; gap:8px; }
.project-tech span { padding:7px 10px; border:1px solid var(--border); border-radius:6px; color:#888; font-size:9px; }
.project-actions { max-width:1050px; margin:0 auto 120px; padding:0 6vw; display:flex; gap:10px; }

/* Reveal */
.reveal { opacity:0; transform:translateY(30px); transition:opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

/* Responsive */
@media (max-width:1100px) {
    .services-grid { grid-template-columns:repeat(2,1fr); }
    .pricing-grid { grid-template-columns:repeat(2,1fr); }
    .process-grid { grid-template-columns:repeat(2,1fr); }
    .hero { grid-template-columns:1fr; }
}

@media (max-width:900px) {
    .nav-links, .nav-button, .nav-cta { display:none; }
    .menu-button, .menu-toggle { display:block; }
    .hero { min-height:auto; padding-top:130px; }
    .hero-visual { height:450px; }
    .section-header, .pricing-intro { grid-template-columns:1fr; gap:20px; }
    .contact-grid, .project-description-inner { grid-template-columns:1fr; gap:55px; }
    .project-meta { grid-template-columns:1fr 1fr; }
    .footer-container { flex-direction:column; align-items:flex-start; }
    .project-screen { min-height:450px; }
}

@media (max-width:650px) {
    .hero { padding:125px 20px 80px; }
    .hero h1 { font-size:55px; letter-spacing:-3px; }
    .hero-actions { flex-direction:column; align-items:stretch; }
    .primary-button, .secondary-button, .btn, .primary-btn, .secondary-btn { justify-content:center; }
    .hero-stats { gap:12px; margin-top:55px; flex-wrap:wrap; }
    .stat-line { height:25px; }
    .hero-visual { height:370px; }
    .visual-card { width:100%; height:280px; }
    .floating-card { display:none; }
    .page-hero, .contact-hero { min-height:auto; padding:145px 20px 80px; }
    .page-hero h1 { font-size:55px; letter-spacing:-3px; }
    .section { padding:90px 20px; }
    .section-header h2, .pricing-intro h2 { font-size:45px; letter-spacing:-3px; }
    .services-grid, .projects-grid, .pricing-grid { grid-template-columns:1fr; }
    .project-large { grid-column:auto; }
    .project-preview, .project-large .project-preview { height:300px; }
    .preview-dashboard, .tibco-dashboard { width:96%; }
    .project-info { align-items:flex-start; }
    .project-link, .project-arrow { align-self:flex-end; }
    .stack-grid { grid-template-columns:1fr; }
    .process-grid { grid-template-columns:1fr; }
    .process-item, .process-card { min-height:220px; }
    .process-item h3, .process-card h3 { margin-top:55px; }
    .contact-form-wrapper { padding:20px; }
    .form-row { grid-template-columns:1fr; gap:0; }
    .project-hero { min-height:auto; padding:145px 20px 75px; }
    .project-hero h1 { font-size:55px; letter-spacing:-3px; }
    .project-hero p { font-size:15px; }
    .project-meta { grid-template-columns:1fr; gap:22px; margin-top:45px; }
    .project-showcase { padding:10px 20px 80px; }
    .project-screen { min-height:330px; }
    .screen-content { inset:7%; padding:18px; }
    .screen-grid { grid-template-columns:1fr; gap:10px; margin-top:30px; }
    .screen-grid div { height:100px; }
    .browser-url { display:none; }
    .project-description { padding:0 20px 80px; }
    .project-actions { flex-direction:column; padding:0 20px; margin-bottom:80px; }
    .project-actions .btn { width:100%; }
    .cta-section { padding:80px 20px; min-height:500px; }
    .cta-box { padding:65px 22px; }
    .cta-content h2, .cta-box h2 { font-size:50px; letter-spacing:-3px; }
    .footer { padding:55px 20px 20px; }
    .footer-links { flex-wrap:wrap; gap:25px; }
}

@media (prefers-reduced-motion:reduce) {
    html { scroll-behavior:auto; }
    .reveal { opacity:1; transform:none; }
    *,*::before,*::after { transition-duration:.01ms !important; }
}

/* =========================================
   PROJECT DETAILS
========================================= */

.project-details {
    max-width: 1250px;
    margin: 0 auto;
    padding: 0 6vw 120px;

    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.detail-card {
    min-height: 310px;

    padding: 34px;

    display: flex;
    flex-direction: column;

    border: 1px solid var(--border);
    border-radius: 14px;

    background: var(--surface);

    transition:
        transform .3s ease,
        border-color .3s ease,
        background .3s ease;
}

.detail-card:hover {
    transform: translateY(-5px);
    border-color: rgba(132, 204, 22, .25);
    background: var(--surface-alt);
}

.detail-card h3 {
    margin-top: 70px;

    font-size: 28px;
    line-height: 1.1;
    letter-spacing: -1.5px;
}

.detail-card p {
    margin-top: 18px;

    color: var(--muted);

    font-size: 14px;
    line-height: 1.8;
}


/* =========================================
   PROJECT FEATURES
========================================= */

.project-features {
    padding: 0 6vw 120px;
}

.project-features .section-heading {
    max-width: var(--max-width);
    margin: 0 auto 55px;
}

.features-grid {
    max-width: 1250px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}

.feature-card {
    position: relative;

    min-height: 250px;

    padding: 34px;

    border: 1px solid var(--border);
    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.025),
            rgba(255,255,255,0)
        );

    overflow: hidden;

    transition:
        transform .3s ease,
        border-color .3s ease;
}

.feature-card::after {
    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    right: -90px;
    top: -90px;

    border-radius: 50%;

    background: rgba(132,204,22,.05);

    pointer-events: none;
}

.feature-card:hover {
    transform: translateY(-5px);
    border-color: rgba(132,204,22,.25);
}

.feature-number {
    display: block;

    color: var(--accent);

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .16em;
}

.feature-card h3 {
    margin-top: 55px;

    font-size: 27px;
    line-height: 1.1;
    letter-spacing: -1.5px;
}

.feature-card p {
    max-width: 520px;

    margin-top: 15px;

    color: var(--muted);

    font-size: 14px;
    line-height: 1.8;
}


/* =========================================
   PROJECT GALLERY
========================================= */

.project-gallery {
    padding: 0 6vw 120px;
}

.project-gallery .section-heading {
    max-width: var(--max-width);
    margin: 0 auto 55px;
}

.gallery-grid {
    max-width: 1250px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.gallery-placeholder {
    min-height: 300px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid var(--border);
    border-radius: 14px;

    background:
        radial-gradient(
            circle at 50% 20%,
            rgba(132,204,22,.05),
            transparent 42%
        ),
        var(--surface-deep);

    color: var(--muted-dark);

    font-size: 10px;
    font-weight: 700;

    letter-spacing: .18em;

    transition:
        transform .3s ease,
        border-color .3s ease;
}

.gallery-placeholder:hover {
    transform: translateY(-5px);

    border-color:
        rgba(132,204,22,.22);
}


/* =========================================
   PROJECT CTA
========================================= */

.project-cta {
    padding: 40px 6vw 120px;
}

.project-cta-inner {
    max-width: 1250px;
    min-height: 450px;

    margin: 0 auto;

    padding: 80px;

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius: 18px;

    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(132,204,22,.08),
            transparent 30%
        ),
        var(--surface);

    overflow: hidden;
}

.project-cta-inner h2 {
    margin-top: 25px;

    font-size: clamp(48px, 6vw, 80px);

    line-height: .95;
    letter-spacing: -4px;
}

.project-cta-inner h2 span {
    color: var(--muted);
}

.project-cta-inner .btn {
    margin-top: 40px;
}


/* =========================================
   PROJECT MOBILE
========================================= */

@media (max-width: 900px) {

    .project-details {
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }

    .features-grid {
        grid-template-columns: 1fr;
    }

    .gallery-grid {
        grid-template-columns: 1fr 1fr;
    }

    .project-cta-inner {
        padding: 60px 45px;
    }

}


@media (max-width: 650px) {

    .project-details {
        grid-template-columns: 1fr;

        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 80px;
    }

    .detail-card {
        min-height: 260px;
        padding: 28px;
    }

    .detail-card h3 {
        margin-top: 45px;
        font-size: 24px;
    }


    .project-features {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 80px;
    }

    .project-features .section-heading {
        margin-bottom: 35px;
    }

    .feature-card {
        min-height: 230px;
        padding: 28px;
    }

    .feature-card h3 {
        margin-top: 45px;
        font-size: 24px;
    }


    .project-gallery {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 80px;
    }

    .project-gallery .section-heading {
        margin-bottom: 35px;
    }

    .gallery-grid {
        grid-template-columns: 1fr;
    }

    .gallery-placeholder {
        min-height: 230px;
    }


    .project-cta {
        padding:
            20px
            20px
            80px;
    }

    .project-cta-inner {
        min-height: 420px;

        padding:
            50px 25px;

        border-radius: 14px;
    }

    .project-cta-inner h2 {
        font-size: 48px;
        letter-spacing: -3px;
    }

}

/* =========================================================
   KODEX — ABOUT PAGE
   Styles for about.html
========================================================= */

.about-page-hero {
    min-height: 720px;
}

.about-page-hero .page-hero-inner {
    max-width: var(--max-width);
}

.about-intro {
    max-width: var(--max-width);
    margin: 0 auto;
    display: grid;
    grid-template-columns: .82fr 1.18fr;
    gap: 90px;
    align-items: start;
}

.about-intro-copy {
    max-width: 760px;
}

.about-lead {
    margin: 0;
    max-width: 700px;
    color: #ededed;
    font-size: clamp(22px, 2.2vw, 30px);
    line-height: 1.45;
    letter-spacing: -.7px;
}

.about-intro-copy > p:not(.about-lead) {
    margin-top: 28px;
    max-width: 680px;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.85;
}

.about-points-wide {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-top: 55px;
}

.about-point-card {
    min-height: 190px;
    padding: 22px 20px 24px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background:
        linear-gradient(145deg, rgba(255,255,255,.02), transparent 65%),
        rgba(255,255,255,.01);
    transition:
        transform .25s ease,
        border-color .25s ease,
        background .25s ease;
}

.about-point-card:hover {
    transform: translateY(-4px);
    border-color: rgba(132,204,22,.28);
    background:
        linear-gradient(145deg, rgba(132,204,22,.045), transparent 65%),
        rgba(255,255,255,.012);
}

.about-point-number {
    display: inline-block;
    color: var(--accent);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
}

.about-point-card h3 {
    margin-top: 34px;
    font-size: 17px;
    line-height: 1.15;
}

.about-point-card p {
    margin-top: 12px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.7;
}

.about-mvv-grid {
    max-width: var(--max-width);
    margin: 70px auto 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.about-mvv-card {
    position: relative;
    min-height: 290px;
    padding: 28px;
    border-top: 1px solid var(--border);
    border-left: 1px solid var(--border);
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    overflow: hidden;
}

.about-mvv-card::before {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    right: -100px;
    top: -100px;
    border-radius: 50%;
    background: rgba(132,204,22,.045);
    filter: blur(55px);
    pointer-events: none;
}

.about-mvv-card .section-label,
.about-mvv-card h3,
.about-mvv-card p {
    position: relative;
    z-index: 1;
}

.about-mvv-card h3 {
    margin-top: 28px;
    max-width: 310px;
    font-size: 21px;
    line-height: 1.2;
    letter-spacing: -.4px;
}

.about-mvv-card p {
    margin-top: 18px;
    max-width: 390px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.8;
}

.about-process-grid {
    max-width: var(--max-width);
    margin: 70px auto 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.about-process-card {
    min-height: 230px;
    padding: 20px 0 0;
    border-top: 1px solid var(--border);
}

.about-process-card > span {
    display: block;
    color: var(--accent);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
}

.about-process-card h3 {
    margin-top: 30px;
    font-size: 17px;
}

.about-process-card p {
    margin-top: 12px;
    max-width: 250px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.75;
}

.about-final-grid {
    max-width: var(--max-width);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.about-final-card {
    position: relative;
    padding: 42px;
    min-height: 330px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background:
        linear-gradient(145deg, rgba(255,255,255,.02), transparent 70%),
        var(--surface);
    overflow: hidden;
}

.about-final-card::after {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    right: -170px;
    top: -160px;
    border-radius: 50%;
    background: rgba(132,204,22,.055);
    filter: blur(75px);
    pointer-events: none;
}

.about-final-card > * {
    position: relative;
    z-index: 1;
}

.about-final-card h3 {
    margin-top: 22px;
    max-width: 500px;
    font-size: clamp(25px, 3vw, 38px);
    line-height: 1.04;
    letter-spacing: -1.5px;
}

.about-final-card p {
    margin-top: 18px;
    max-width: 620px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.8;
}

/* About page spacing */
.about-page-hero + .section {
    padding-top: 115px;
}

@media (max-width: 1000px) {
    .about-intro {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .about-mvv-grid {
        grid-template-columns: 1fr;
    }

    .about-mvv-card {
        min-height: auto;
    }

    .about-process-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .about-final-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .about-page-hero {
        min-height: auto;
    }

    .about-page-hero + .section {
        padding-top: 85px;
    }

    .about-intro {
        gap: 35px;
    }

    .about-lead {
        font-size: 22px;
    }

    .about-intro-copy > p:not(.about-lead) {
        font-size: 13px;
        line-height: 1.8;
    }

    .about-points-wide {
        grid-template-columns: 1fr;
        margin-top: 38px;
    }

    .about-point-card {
        min-height: auto;
    }

    .about-point-card h3 {
        margin-top: 25px;
    }

    .about-mvv-grid {
        margin-top: 45px;
        gap: 12px;
    }

    .about-mvv-card {
        padding: 24px;
    }

    .about-process-grid {
        grid-template-columns: 1fr;
        margin-top: 45px;
    }

    .about-process-card {
        min-height: auto;
        padding-bottom: 25px;
    }

    .about-final-grid {
        gap: 12px;
    }

    .about-final-card {
        padding: 28px 24px;
        min-height: auto;
    }

    .about-final-card h3 {
        font-size: 29px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .about-point-card,
    .about-mvv-card,
    .about-final-card {
        transition: none;
    }
}

/* =========================================================
   CONTACT PAGE — FUNCTIONAL FORM
========================================================= */

.contact-page-hero {
    width: min(1200px, calc(100% - 48px));
    min-height: 680px;
    margin: 0 auto;
    padding: 180px 0 100px;
    display: flex;
    align-items: center;
    position: relative;
}

.contact-page-inner {
    max-width: 900px;
    position: relative;
    z-index: 1;
}

.contact-page-hero h1 {
    margin: 0;
    font-size: clamp(58px, 8vw, 108px);
    line-height: .92;
    letter-spacing: -5px;
    font-weight: 800;
}

.contact-page-hero h1 span {
    color: transparent;
    -webkit-text-stroke: 1px rgba(255,255,255,.5);
}

.contact-page-hero p {
    max-width: 640px;
    margin-top: 30px;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.8;
}

.contact-direct-links {
    display: flex;
    gap: 10px;
    margin-top: 35px;
    flex-wrap: wrap;
}

.contact-direct-links .btn {
    min-width: 170px;
}

.contact-honey {
    position: absolute !important;
    left: -10000px !important;
    top: auto !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.form-consent {
    margin: -2px 0 20px;
}

.form-consent label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #787878;
    font-size: 11px;
    line-height: 1.6;
    cursor: pointer;
}

.form-consent input {
    width: 15px;
    height: 15px;
    margin: 1px 0 0;
    accent-color: var(--accent);
    flex: 0 0 auto;
}

.form-button {
    min-width: 190px;
}

.form-button:disabled {
    opacity: .6;
    cursor: wait;
    transform: none !important;
}

.form-message {
    min-height: 20px;
    margin-top: 14px;
    color: var(--accent);
}

.form-note {
    margin-top: 8px;
    color: var(--muted-dark);
    font-size: 10px;
    line-height: 1.5;
}

.contact-bottom-section {
    padding-top: 40px;
}

.contact-bottom-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}

.contact-bottom-card {
    min-height: 230px;
    padding: 28px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    transition: .3s ease;
}

.contact-bottom-card:hover {
    transform: translateY(-4px);
    border-color: rgba(132,204,22,.25);
}

.contact-bottom-card h3 {
    margin-top: 65px;
    font-size: 22px;
    letter-spacing: -.6px;
}

.contact-bottom-card p {
    max-width: 520px;
    margin-top: 12px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.75;
}

@media (max-width: 900px) {
    .contact-page-hero {
        min-height: 620px;
        padding: 150px 0 90px;
    }

    .contact-grid {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .contact-bottom-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .contact-page-hero {
        width: calc(100% - 40px);
        min-height: auto;
        padding: 145px 0 85px;
    }

    .contact-page-hero h1 {
        font-size: 55px;
        letter-spacing: -3px;
    }

    .contact-page-hero p {
        font-size: 14px;
    }

    .contact-section {
        padding-top: 60px;
    }

    .contact-form-wrapper {
        padding: 20px;
    }

    .form-row {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .contact-bottom-card {
        min-height: 210px;
    }

    .contact-bottom-card h3 {
        margin-top: 55px;
    }
}

/* =========================================================
   KODEX — TECHNOLOGIES PAGE
========================================================= */

.technology-page-hero {
    min-height: 700px;
}

.tech-intro {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
}

.tech-intro p {
    margin-top: 24px;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.8;
}

.tech-category {
    margin-top: 90px;
}

.tech-category-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 35px;
}

.tech-category-header h2 {
    margin-top: 15px;
    font-size: clamp(38px, 5vw, 64px);
    line-height: .95;
    letter-spacing: -3px;
}

.tech-category-header h2 span {
    color: transparent;
    -webkit-text-stroke: 1px rgba(255,255,255,.45);
}

.tech-category-header p {
    max-width: 420px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.8;
}

.tech-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.tech-card {
    position: relative;
    min-height: 230px;
    padding: 26px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    overflow: hidden;
    transition: transform .3s ease, border-color .3s ease, background .3s ease;
}

.tech-card::before {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    right: -110px;
    top: -110px;
    border-radius: 50%;
    background: rgba(132,204,22,.055);
    filter: blur(35px);
    pointer-events: none;
}

.tech-card:hover {
    transform: translateY(-5px);
    border-color: rgba(132,204,22,.3);
    background: var(--surface-light);
}

.tech-number {
    display: block;
    color: var(--accent);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
}

.tech-name {
    margin-top: 48px;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -.7px;
}

.tech-role {
    margin-top: 7px;
    color: #d7d7d7;
    font-size: 12px;
    font-weight: 600;
}

.tech-description {
    margin-top: 14px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.75;
    max-width: 360px;
}

.tech-stack-note {
    margin-top: 90px;
    padding: 30px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255,255,255,.018), transparent 60%), var(--surface);
}

.tech-stack-note .section-label {
    display: block;
}

.tech-stack-note h3 {
    margin-top: 16px;
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1;
    letter-spacing: -2px;
}

.tech-stack-note p {
    max-width: 760px;
    margin-top: 16px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.8;
}

.tech-cta {
    margin-top: 90px;
}

@media (max-width: 900px) {
    .technology-page-hero {
        min-height: 650px;
    }

    .tech-category-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .tech-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 650px) {
    .technology-page-hero {
        min-height: auto;
    }

    .tech-intro {
        text-align: left;
    }

    .tech-category {
        margin-top: 65px;
    }

    .tech-category-header {
        margin-bottom: 25px;
    }

    .tech-category-header h2 {
        font-size: 44px;
        letter-spacing: -2.5px;
    }

    .tech-grid {
        grid-template-columns: 1fr;
    }

    .tech-card {
        min-height: 205px;
    }

    .tech-name {
        margin-top: 38px;
    }
}


/* =========================================================
   PROJECT SEARCH + FILTERS
========================================================= */
.projects-toolbar {
    display: grid;
    gap: 18px;
    margin: 0 0 34px;
}

.projects-search {
    position: relative;
    display: flex;
    align-items: center;
}

.projects-search input {
    width: 100%;
    height: 52px;
    padding: 0 48px 0 44px;
    background: var(--surface);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 10px;
    outline: none;
    transition: .25s ease;
}

.projects-search input::placeholder {
    color: var(--muted);
}

.projects-search input:focus {
    border-color: rgba(132,204,22,.45);
    box-shadow: 0 0 0 4px rgba(132,204,22,.06);
}

.projects-search-icon {
    position: absolute;
    left: 16px;
    color: var(--muted);
    pointer-events: none;
}

.projects-search-clear {
    position: absolute;
    right: 12px;
    width: 30px;
    height: 30px;
    border-radius: 7px;
    color: var(--muted-light);
}

.projects-search-clear:hover {
    background: var(--surface-light);
    color: var(--text-strong);
}

.projects-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.project-filter {
    padding: 9px 14px;
    border: 1px solid var(--border);
    border-radius: 999px;
    color: var(--muted-light);
    font-size: 12px;
    transition: .2s ease;
}

.project-filter:hover,
.project-filter.active {
    color: var(--text-strong);
    border-color: rgba(132,204,22,.35);
    background: rgba(132,204,22,.08);
}

.projects-toolbar-meta {
    color: var(--muted);
    font-size: 12px;
}

.project-filter-hidden {
    display: none !important;
}

.project-filter-empty {
    grid-column: 1 / -1;
    min-height: 180px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    border: 1px dashed var(--border);
    border-radius: 14px;
    color: var(--muted);
    text-align: center;
}

.project-filter-empty strong {
    color: var(--text);
}

.project-filter-empty span {
    font-size: 13px;
}

@media (max-width: 650px) {
    .projects-filters {
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 4px;
        scrollbar-width: none;
    }

    .projects-filters::-webkit-scrollbar {
        display: none;
    }

    .project-filter {
        flex: 0 0 auto;
    }
}


/* =========================================================
   KODEX — PROJECT GALLERY + LIGHTBOX
========================================================= */

.gallery-placeholder-empty,
.gallery-item {
    position: relative;
    min-height: 320px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 14px;
    background:
        radial-gradient(circle at 85% 20%, rgba(132,204,22,.08), transparent 30%),
        linear-gradient(145deg, var(--surface-deep)111, var(--surface-deep) 70%);
    box-shadow: 0 20px 60px rgba(0,0,0,.18);
}

.gallery-item {
    width: 100%;
    padding: 0;
    cursor: zoom-in;
    text-align: left;
    appearance: none;
    -webkit-appearance: none;
    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}

.gallery-item:hover {
    transform: translateY(-4px);
    border-color: rgba(132,204,22,.28);
    box-shadow: 0 24px 70px rgba(0,0,0,.26);
}

.gallery-item img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 320px;
    object-fit: cover;
    background: var(--surface-deep);
}

.gallery-item.image-error { cursor: default; }

.gallery-placeholder-empty {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 10px;
    padding: 28px;
}

.gallery-placeholder-empty::before {
    content: "";
    position: absolute;
    inset: 18px;
    border: 1px dashed rgba(255,255,255,.10);
    border-radius: 10px;
    pointer-events: none;
}

.gallery-placeholder-number,
.gallery-placeholder-title,
.gallery-placeholder-copy {
    position: relative;
    z-index: 1;
}

.gallery-placeholder-number {
    color: #A3E635;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.gallery-placeholder-title {
    color: var(--text);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -.03em;
}

.gallery-placeholder-copy {
    max-width: 340px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.6;
}

.kodex-lightbox {
    position: fixed;
    inset: 0;
    z-index: 3500;
    display: grid;
    place-items: center;
    padding: 30px;
    background: rgba(0,0,0,.84);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease, visibility .2s ease;
}

.kodex-lightbox.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.kodex-lightbox-inner {
    position: relative;
    width: min(1200px, 100%);
    max-height: calc(100vh - 60px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.kodex-lightbox-figure {
    width: min(1040px, calc(100vw - 180px));
    margin: 0;
    text-align: center;
}

.kodex-lightbox-image {
    display: block;
    width: 100%;
    max-height: calc(100vh - 150px);
    object-fit: contain;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 14px;
    background: var(--surface-deep);
    box-shadow: 0 30px 100px rgba(0,0,0,.5);
}

.kodex-lightbox-caption {
    margin-top: 14px;
    color: #a0a0a0;
    font-size: 12px;
}

.kodex-lightbox-close,
.kodex-lightbox-nav {
    position: absolute;
    z-index: 2;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 10px;
    color: var(--text);
    background: rgba(16,16,16,.88);
    cursor: pointer;
    transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.kodex-lightbox-close:hover,
.kodex-lightbox-nav:hover {
    border-color: rgba(132,204,22,.35);
    background: rgba(20,20,20,.98);
}

.kodex-lightbox-close {
    top: -8px;
    right: -8px;
    width: 42px;
    height: 42px;
    font-size: 25px;
}

.kodex-lightbox-nav {
    top: 50%;
    width: 46px;
    height: 46px;
    font-size: 28px;
    transform: translateY(-50%);
}

.kodex-lightbox-nav:hover {
    transform: translateY(calc(-50% - 2px));
}

.kodex-lightbox-prev { left: 0; }
.kodex-lightbox-next { right: 0; }
body.kodex-lightbox-open { overflow: hidden; }

@media (max-width: 800px) {
    .gallery-placeholder-empty,
    .gallery-item,
    .gallery-item img { min-height: 250px; }
    .gallery-placeholder-title { font-size: 20px; }
    .kodex-lightbox { padding: 16px; }
    .kodex-lightbox-figure { width: 100%; }
    .kodex-lightbox-image { max-height: calc(100vh - 120px); border-radius: 10px; }
    .kodex-lightbox-close { top: -4px; right: -4px; width: 38px; height: 38px; }
    .kodex-lightbox-nav { width: 40px; height: 40px; font-size: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .gallery-item,
    .kodex-lightbox,
    .kodex-lightbox-close,
    .kodex-lightbox-nav { transition: none !important; }
}

@media (max-width:650px) {
    .toolpilot-layout {
        grid-template-columns:1fr;
        gap:9px;
    }

    .toolpilot-categories {
        display:grid;
        grid-template-columns:repeat(4,1fr);
    }

    .toolpilot-category {
        min-height:40px;
        justify-content:center;
        padding:7px 6px;
    }

    .toolpilot-category strong {
        display:none;
    }

    .toolpilot-results {
        grid-template-columns:1fr 1fr;
    }

    .toolpilot-searchbar {
        margin-top:22px;
    }
}

/* =========================================================
   HERO TYPOGRAPHY — UNIFIED ACROSS ALL PAGES
   Reprend exactement la hiérarchie visuelle du hero de l'accueil.
========================================================= */

.hero h1,
.page-hero h1,
.contact-page-hero h1,
.project-hero h1,
.estimate-hero h1,
.error-page h1 {
    margin: 0;
    font-size: clamp(55px, 7vw, 92px);
    line-height: .98;
    letter-spacing: -5px;
    font-weight: 800;
}

.hero h1 span,
.page-hero h1 span,
.contact-page-hero h1 span,
.project-hero h1 span,
.estimate-hero h1 span,
.error-page h1 span {
    color: transparent;
    -webkit-text-stroke: 1px rgba(255,255,255,.5);
}

@media (max-width: 650px) {
    .hero h1,
    .page-hero h1,
    .contact-page-hero h1,
    .project-hero h1,
    .estimate-hero h1,
    .error-page h1 {
        font-size: 55px;
        line-height: .98;
        letter-spacing: -3px;
    }
}



/* =========================================================
   KODEX — ESTIMATEUR DE PROJET
========================================================= */
.estimate-page{padding-top:110px}
.estimate-hero{padding:90px 0 55px}
.estimate-hero-inner{max-width:850px}
.estimate-hero h1{font-size:clamp(44px,7vw,86px);line-height:.95;letter-spacing:-.06em;margin:18px 0 24px}
.estimate-hero h1 span{color:var(--accent)}
.estimate-hero p{max-width:680px;color:var(--muted-light);font-size:16px;line-height:1.8}
.estimate-shell{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr);gap:24px;align-items:start;padding-bottom:110px}
.estimate-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:28px}
.estimate-card h2{font-size:24px;letter-spacing:-.03em;margin-bottom:8px}
.estimate-note{color:var(--muted);font-size:12px;line-height:1.6}
.estimate-progress{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:24px 0 28px}
.estimate-step-dot{padding:10px 8px;border:1px solid var(--border);border-radius:10px;color:var(--muted);font-size:11px;text-align:center;transition:.25s ease}
.estimate-step-dot.active{border-color:rgba(132,204,22,.6);color:var(--text-strong);background:rgba(132,204,22,.08)}
.estimate-form-step{display:none;animation:estimateIn .3s ease}
.estimate-form-step.active{display:block}
@keyframes estimateIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.estimate-question{font-size:18px;font-weight:700;margin-bottom:18px;letter-spacing:-.02em}
.estimate-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.estimate-choice{position:relative}
.estimate-choice input{position:absolute;opacity:0;pointer-events:none}
.estimate-choice label{display:block;padding:16px;border:1px solid var(--border);border-radius:13px;cursor:pointer;background:rgba(255,255,255,.015);transition:.22s ease}
.estimate-choice label:hover{border-color:var(--border-strong);transform:translateY(-2px)}
.estimate-choice input:checked + label{border-color:rgba(132,204,22,.72);background:rgba(132,204,22,.08);box-shadow:0 12px 30px rgba(0,0,0,.16)}
.estimate-choice strong{display:block;font-size:14px;margin-bottom:5px}
.estimate-choice span{display:block;color:var(--muted);font-size:11px;line-height:1.5}
.estimate-checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.estimate-check{display:flex;align-items:flex-start;gap:10px;padding:13px;border:1px solid var(--border);border-radius:12px;color:var(--muted-light);font-size:12px;line-height:1.5;cursor:pointer}
.estimate-check input{margin-top:2px;accent-color:var(--accent)}
.estimate-check:has(input:checked){border-color:rgba(132,204,22,.45);background:rgba(132,204,22,.05);color:var(--text-strong)}
.estimate-field{display:grid;gap:7px;margin-bottom:14px}
.estimate-field label{font-size:12px;color:var(--muted-light);font-weight:600}
.estimate-field input,.estimate-field textarea,.estimate-field select{width:100%;border:1px solid var(--border);background:var(--surface-deep);color:var(--text-strong);border-radius:10px;padding:12px 13px;outline:none}
.estimate-field input:focus,.estimate-field textarea:focus,.estimate-field select:focus{border-color:rgba(132,204,22,.55);box-shadow:0 0 0 3px rgba(132,204,22,.06)}
.estimate-actions{display:flex;justify-content:space-between;gap:12px;margin-top:24px}
.estimate-btn{border:1px solid var(--border);border-radius:10px;padding:12px 16px;font-size:12px;font-weight:700;cursor:pointer;transition:.22s ease}
.estimate-btn:hover{transform:translateY(-1px);border-color:var(--border-strong)}
.estimate-btn.primary{background:var(--accent);color:var(--background);border-color:var(--accent)}
.estimate-summary{position:sticky;top:105px}
.estimate-total{margin:20px 0 8px;font-size:clamp(34px,4vw,52px);line-height:1;font-weight:800;letter-spacing:-.05em}
.estimate-total small{display:block;font-size:11px;color:var(--muted);font-weight:600;letter-spacing:0;margin-bottom:8px}
.estimate-range{color:var(--muted-light);font-size:12px;line-height:1.6}
.estimate-recap{display:grid;gap:9px;margin:24px 0}
.estimate-recap-row{display:flex;justify-content:space-between;gap:20px;padding-bottom:9px;border-bottom:1px solid rgba(255,255,255,.06);font-size:12px}
.estimate-recap-row span:first-child{color:var(--muted)}
.estimate-recap-row span:last-child{color:var(--text-strong);text-align:right}
.estimate-disclaimer{padding:13px;border:1px solid rgba(255,255,255,.07);border-radius:12px;color:var(--muted);font-size:10px;line-height:1.6;margin-top:20px}
.estimate-success{display:none;margin-top:18px;padding:14px;border:1px solid rgba(132,204,22,.3);border-radius:12px;background:rgba(132,204,22,.06);color:#dff6b7;font-size:12px;line-height:1.6}
.estimate-success.show{display:block}
@media (max-width:900px){.estimate-shell{grid-template-columns:1fr}.estimate-summary{position:static}.estimate-hero{padding-top:55px}}
@media (max-width:650px){.estimate-card{padding:20px}.estimate-options,.estimate-checks{grid-template-columns:1fr}.estimate-progress{grid-template-columns:repeat(2,1fr)}.estimate-actions{flex-direction:column-reverse}.estimate-btn{width:100%}}

.estimate-success.visible{display:block}


/* Responsive QA — ToolPilot preview fit */
@media (max-width:650px) {
    .project-large .toolpilot-preview {
        height: 360px;
    }
    .toolpilot-result-card {
        min-height: 84px;
        padding: 11px;
    }
    .toolpilot-result-card small {
        margin-top: 11px;
    }
}


/* =========================================================
   KODEX — LOADER + CONSENTEMENT NAVIGATION
========================================================= */

.kodex-loader {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: grid;
    place-items: center;
    background: var(--background);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .35s ease, visibility .35s ease;
}

html.kodex-show-loader .kodex-loader {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.kodex-loader.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.kodex-loader-inner {
    width: min(260px, 70vw);
    text-align: center;
}

.kodex-loader-logo {
    font-size: clamp(28px, 5vw, 42px);
    line-height: 1;
    font-weight: 800;
    letter-spacing: -.06em;
    color: var(--text);
}

.kodex-loader-logo span {
    color: #84CC16;
}

.kodex-loader-line {
    width: 100%;
    height: 2px;
    margin: 24px 0 12px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
}

.kodex-loader-line span {
    display: block;
    width: 42%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #84CC16, #A3E635);
    animation: kodexLoaderProgress 1.05s ease-in-out infinite;
}

.kodex-loader-label {
    color: var(--muted);
    font-size: 10px;
    letter-spacing: .18em;
    text-transform: uppercase;
}

@keyframes kodexLoaderProgress {
    0% { transform: translateX(-120%); }
    50% { transform: translateX(80%); }
    100% { transform: translateX(230%); }
}

.kodex-consent {
    position: fixed;
    left: 22px;
    right: 22px;
    bottom: 22px;
    z-index: 99998;
    display: flex;
    justify-content: center;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
}

.kodex-consent.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(14px);
}

.kodex-consent-card {
    width: min(900px, 100%);
    padding: 20px 20px 17px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 16px;
    background: rgba(16,16,16,.96);
    box-shadow: 0 22px 60px rgba(0,0,0,.48);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.kodex-consent-copy {
    max-width: 760px;
}

.kodex-consent-eyebrow {
    display: inline-block;
    margin-bottom: 7px;
    color: #84CC16;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .16em;
}

.kodex-consent-title {
    margin: 0 0 7px;
    color: var(--text);
    font-size: 16px;
    font-weight: 800;
}

.kodex-consent-text {
    margin: 0;
    color: var(--muted-light);
    font-size: 12px;
    line-height: 1.65;
}

.kodex-consent-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 9px;
    margin-top: 15px;
}

.kodex-consent-btn {
    min-height: 42px;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 10px;
    background: var(--surface-light);
    color: var(--text);
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.kodex-consent-btn:hover {
    transform: translateY(-1px);
    border-color: rgba(255,255,255,.2);
}

.kodex-consent-btn:focus-visible,
.kodex-preferences-close:focus-visible,
.kodex-consent-settings:focus-visible,
.kodex-preference-toggle:focus-visible {
    outline: 2px solid #84CC16;
    outline-offset: 3px;
}

.kodex-consent-btn.primary {
    border-color: #84CC16;
    background: #84CC16;
    color: var(--background);
}

.kodex-consent-btn.primary:hover {
    background: #A3E635;
    border-color: #A3E635;
}

.kodex-consent-settings {
    position: fixed;
    left: 18px;
    bottom: 18px;
    z-index: 99997;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 999px;
    background: rgba(16,16,16,.9);
    color: var(--text);
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(0,0,0,.3);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: scale(.92);
    transition: opacity .25s ease, visibility .25s ease, transform .25s ease, border-color .2s ease;
}

.kodex-consent-settings.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: scale(1);
}

.kodex-consent-settings:hover {
    border-color: rgba(132,204,22,.55);
}

.kodex-preferences {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: grid;
    place-items: center;
    padding: 20px;
    opacity: 1;
    visibility: visible;
    transition: opacity .22s ease, visibility .22s ease;
}

.kodex-preferences.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.kodex-preferences-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.72);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.kodex-preferences-card {
    position: relative;
    width: min(720px, 100%);
    max-height: min(720px, calc(100vh - 40px));
    overflow: auto;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 18px;
    background: var(--surface);
    box-shadow: 0 28px 90px rgba(0,0,0,.58);
}

.kodex-preferences-header {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: flex-start;
}

.kodex-preferences-title {
    margin: 0;
    color: var(--text);
    font-size: 22px;
    font-weight: 800;
}

.kodex-preferences-intro {
    max-width: 600px;
    margin: 8px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.7;
}

.kodex-preferences-close {
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 10px;
    background: var(--surface-light);
    color: var(--text);
    font: inherit;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.kodex-preference-list {
    display: grid;
    gap: 10px;
    margin-top: 22px;
}

.kodex-preference-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 15px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 13px;
    background: var(--surface-alt);
    cursor: pointer;
}

.kodex-preference-row.locked {
    cursor: default;
    background: var(--surface-alt);
}

.kodex-preference-copy {
    display: grid;
    gap: 4px;
}

.kodex-preference-copy strong {
    color: var(--text);
    font-size: 12px;
    font-weight: 800;
}

.kodex-preference-copy span {
    color: #888;
    font-size: 11px;
    line-height: 1.55;
}

.kodex-preference-state {
    flex: 0 0 auto;
    color: #84CC16;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.kodex-preference-toggle {
    appearance: none;
    position: relative;
    width: 42px;
    height: 24px;
    flex: 0 0 auto;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    background: var(--surface-control);
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease;
}

.kodex-preference-toggle::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--muted);
    transition: transform .2s ease, background .2s ease;
}

.kodex-preference-toggle:checked {
    border-color: #84CC16;
    background: rgba(132,204,22,.24);
}

.kodex-preference-toggle:checked::after {
    transform: translateX(18px);
    background: #84CC16;
}

.kodex-preferences-footer {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 9px;
    align-items: center;
    margin-top: 20px;
}

.kodex-preferences-footer-main {
    display: flex;
    gap: 9px;
}

.kodex-preferences-footer .kodex-consent-btn {
    min-width: 145px;
}

@media (max-width: 720px) {
    .kodex-consent {
        left: 12px;
        right: 12px;
        bottom: 12px;
    }

    .kodex-consent-card,
    .kodex-preferences-card {
        padding: 15px;
    }

    .kodex-consent-actions {
        grid-template-columns: 1fr;
    }

    .kodex-preferences {
        padding: 10px;
    }

    .kodex-preferences-card {
        max-height: calc(100vh - 20px);
    }

    .kodex-preference-row {
        align-items: flex-start;
    }

    .kodex-preferences-footer {
        grid-template-columns: 1fr;
    }

    .kodex-preferences-footer-main {
        flex-direction: column;
    }

    .kodex-preferences-footer .kodex-consent-btn {
        width: 100%;
        min-width: 0;
    }

    .kodex-consent-settings {
        left: 12px;
        bottom: 12px;
    }
}



/* =========================================================
   KODEX — USER PREFERENCES / THEMES
========================================================= */
html[data-kodex-theme="light"] {
    --background: #f6f7f5;
    --surface: #ffffff;
    --surface-light: #f0f2ee;
    --surface-alt: #f4f5f3;
    --surface-deep: #ecefea;
    --surface-control: #e4e8e2;
    --border: rgba(15,23,42,.10);
    --border-strong: rgba(15,23,42,.18);
    --border-track: #d7ddd4;
    --text: #101412;
    --text-strong: #0b0d0c;
    --muted: #64706a;
    --muted-light: #47524d;
    --muted-dark: #6f7974;
}

html[data-kodex-theme="light"] body { background:var(--background); color:var(--text); }
html[data-kodex-theme="light"] .navbar.scrolled { background:rgba(246,247,245,.86); }
html[data-kodex-theme="light"] .hero h1 span,
html[data-kodex-theme="light"] .cta-content h2 span,
html[data-kodex-theme="light"] .cta-box h2 span,
html[data-kodex-theme="light"] .project-hero h1 span { -webkit-text-stroke-color:rgba(16,20,18,.35); }
html[data-kodex-theme="light"] .visual-card,
html[data-kodex-theme="light"] .floating-card,
html[data-kodex-theme="light"] .project-card,
html[data-kodex-theme="light"] .stack-item,
html[data-kodex-theme="light"] .process-item,
html[data-kodex-theme="light"] .process-card,
html[data-kodex-theme="light"] .service-card,
html[data-kodex-theme="light"] .pricing-card,
html[data-kodex-theme="light"] .contact-form,
html[data-kodex-theme="light"] .technology-card,
html[data-kodex-theme="light"] .tech-card,
html[data-kodex-theme="light"] .kodex-modal-dialog,
html[data-kodex-theme="light"] .kodex-command-palette,
html[data-kodex-theme="light"] .kodex-consent-card,
html[data-kodex-theme="light"] .kodex-preferences-card { background:var(--surface); color:var(--text); }
html[data-kodex-theme="light"] .meetnote-preview,
html[data-kodex-theme="light"] .servio-preview,
html[data-kodex-theme="light"] .toolpilot-preview,
html[data-kodex-theme="light"] .tibco-preview { background:var(--surface-alt); }
html[data-kodex-theme="light"] .preview-dashboard,
html[data-kodex-theme="light"] .tibco-dashboard,
html[data-kodex-theme="light"] .preview-sidebar,
html[data-kodex-theme="light"] .toolpilot-category,
html[data-kodex-theme="light"] .toolpilot-result-card,
html[data-kodex-theme="light"] .toolpilot-searchbar { background:var(--surface-deep); }
html[data-kodex-theme="light"] .project-preview-overlay { background:rgba(16,20,18,.54); }
html[data-kodex-theme="light"] .project-preview-overlay span { background:rgba(255,255,255,.92); color:#101412; border-color:rgba(16,20,18,.14); }
html[data-kodex-theme="light"] .kodex-loader { background:var(--background); }
html[data-kodex-theme="light"] .kodex-consent-btn,
html[data-kodex-theme="light"] .kodex-preferences-close,
html[data-kodex-theme="light"] .kodex-consent-settings { background:var(--surface-light); color:var(--text); border-color:var(--border); }
html[data-kodex-theme="light"] .kodex-preferences-backdrop { background:rgba(15,23,42,.28); }
html[data-kodex-theme="light"] .mobile-menu { background:rgba(246,247,245,.98); }
html[data-kodex-theme="light"] .menu-button,
html[data-kodex-theme="light"] .menu-toggle { background:rgba(15,23,42,.035); }
html[data-kodex-theme="light"] .menu-button span,
html[data-kodex-theme="light"] .menu-toggle span { background:#101412; }
html[data-kodex-theme="light"] .nav-links a:hover,
html[data-kodex-theme="light"] .nav-links a.active,
html[data-kodex-theme="light"] .secondary-button:hover,
html[data-kodex-theme="light"] .btn-secondary:hover,
html[data-kodex-theme="light"] .secondary-btn:hover { color:var(--text-strong); }
html[data-kodex-theme="light"] .kodex-command-item.active,
html[data-kodex-theme="light"] .kodex-command-item:hover { background:var(--surface-light); }
html[data-kodex-theme="light"] .kodex-command-backdrop { background:rgba(15,23,42,.30); }
html[data-kodex-theme="light"] .kodex-command-input::placeholder { color:#7b847f; }
html[data-kodex-theme="light"] .kodex-lightbox { background:rgba(15,23,42,.72); }

html[data-kodex-accent-effects="off"] .background-glow { opacity:0 !important; }
html[data-kodex-performance="on"] .background-glow { opacity:0 !important; filter:none !important; }
html[data-kodex-performance="on"] * { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; box-shadow:none !important; }
html[data-kodex-performance="on"] .project-card:hover,
html[data-kodex-performance="on"] .stack-item:hover,
html[data-kodex-performance="on"] .process-item:hover,
html[data-kodex-performance="on"] .process-card:hover,
html[data-kodex-performance="on"] .pricing-btn:hover,
html[data-kodex-performance="on"] .primary-button:hover,
html[data-kodex-performance="on"] .btn-primary:hover,
html[data-kodex-performance="on"] .primary-btn:hover { transform:none !important; }
html[data-kodex-animations="off"] * { animation-play-state:paused !important; }
html[data-kodex-animations="off"] .reveal { opacity:1 !important; transform:none !important; }
html[data-kodex-hover="off"] .project-card:hover,
html[data-kodex-hover="off"] .stack-item:hover,
html[data-kodex-hover="off"] .process-item:hover,
html[data-kodex-hover="off"] .process-card:hover,
html[data-kodex-hover="off"] .pricing-btn:hover,
html[data-kodex-hover="off"] .nav-button:hover,
html[data-kodex-hover="off"] .nav-cta:hover,
html[data-kodex-hover="off"] .primary-button:hover,
html[data-kodex-hover="off"] .btn-primary:hover,
html[data-kodex-hover="off"] .primary-btn:hover,
html[data-kodex-hover="off"] .secondary-button:hover,
html[data-kodex-hover="off"] .btn-secondary:hover,
html[data-kodex-hover="off"] .secondary-btn:hover { transform:none !important; }
html[data-kodex-motion="reduced"] * { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
html[data-kodex-motion="reduced"] .background-glow { opacity:.02 !important; filter:none !important; }
html[data-kodex-smooth-scroll="off"] { scroll-behavior:auto !important; }
html[data-kodex-text-size="large"] body { font-size:17px; }
html[data-kodex-text-size="large"] p,
html[data-kodex-text-size="large"] .nav-links a,
html[data-kodex-text-size="large"] .nav-button,
html[data-kodex-text-size="large"] .nav-cta,
html[data-kodex-text-size="large"] .primary-button,
html[data-kodex-text-size="large"] .secondary-button,
html[data-kodex-text-size="large"] .btn,
html[data-kodex-text-size="large"] .project-info p,
html[data-kodex-text-size="large"] .service-card p,
html[data-kodex-text-size="large"] .pricing-description,
html[data-kodex-text-size="large"] .technology-card p,
html[data-kodex-text-size="large"] .tech-card p { font-size:calc(100% + 1px); }
html[data-kodex-contrast="high"] { --border:rgba(15,23,42,.22); --border-strong:rgba(15,23,42,.34); --muted:#47524d; --muted-light:#27312d; }
html[data-kodex-contrast="high"] body { color:var(--text-strong); }
html[data-kodex-contrast="high"] .project-info p,
html[data-kodex-contrast="high"] .service-card p,
html[data-kodex-contrast="high"] .process-item p,
html[data-kodex-contrast="high"] .process-card p,
html[data-kodex-contrast="high"] .hero-description { color:var(--muted-light); }
html[data-kodex-project-view="list"] .projects-grid { grid-template-columns:1fr !important; }
html[data-kodex-project-view="list"] .project-large { grid-column:auto !important; }
html[data-kodex-project-view="list"] .project-card { display:grid; grid-template-columns:minmax(280px, .9fr) 1.1fr; align-items:stretch; }
html[data-kodex-project-view="list"] .project-preview { height:100%; min-height:280px; }
html[data-kodex-project-view="list"] .project-large .project-preview { height:100%; min-height:320px; }

@media (max-width:760px) {
    html[data-kodex-project-view="list"] .project-card { display:block; }
    html[data-kodex-project-view="list"] .project-preview,
    html[data-kodex-project-view="list"] .project-large .project-preview { min-height:300px; height:300px; }
}


/* =========================================================
   KODEX — LOCAL SITE SETTINGS UI
========================================================= */
.kodex-site-settings-trigger {
    position:fixed;
    right:18px;
    bottom:18px;
    z-index:99997;
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border:1px solid var(--border);
    border-radius:999px;
    background:rgba(16,16,16,.90);
    color:var(--text);
    box-shadow:0 10px 30px rgba(0,0,0,.28);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    font-size:16px;
    transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.kodex-site-settings-trigger:hover { transform:translateY(-2px) rotate(18deg); border-color:rgba(132,204,22,.55); }
.kodex-site-settings {
    position:fixed;
    inset:0;
    z-index:100001;
    display:grid;
    place-items:center;
    padding:20px;
    opacity:1;
    visibility:visible;
}
.kodex-site-settings.is-hidden { opacity:0; visibility:hidden; pointer-events:none; }
.kodex-site-settings-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.68); backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); }
.kodex-site-settings-card {
    position:relative;
    width:min(820px,100%);
    max-height:min(820px,calc(100vh - 40px));
    overflow:auto;
    padding:24px;
    border:1px solid var(--border);
    border-radius:20px;
    background:var(--surface);
    color:var(--text);
    box-shadow:0 30px 100px rgba(0,0,0,.5);
}
.kodex-site-settings-header { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; }
.kodex-site-settings-header h2 { margin:0; font-size:25px; letter-spacing:-1px; }
.kodex-site-settings-header p { margin:8px 0 0; color:var(--muted); font-size:12px; line-height:1.7; }
.kodex-site-settings-close { width:36px; height:36px; border:1px solid var(--border); border-radius:10px; background:var(--surface-light); color:var(--text); font-size:23px; line-height:1; }
.kodex-site-settings-sections { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:22px; }
.kodex-site-settings-section { padding:15px; border:1px solid var(--border); border-radius:14px; background:var(--surface-light); }
.kodex-site-settings-section-title { display:block; margin-bottom:10px; color:var(--accent); font-size:9px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.kodex-setting-row,.kodex-setting-control { min-height:54px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:9px 0; border-top:1px solid var(--border); }
.kodex-setting-row:first-of-type,.kodex-setting-control:first-of-type { border-top:0; padding-top:0; }
.kodex-setting-row strong,.kodex-setting-control strong { display:block; font-size:12px; }
.kodex-setting-row small,.kodex-setting-control small { display:block; margin-top:4px; color:var(--muted); font-size:10px; line-height:1.45; }
.kodex-setting-control select { min-width:120px; padding:9px 11px; border:1px solid var(--border); border-radius:9px; background:var(--surface-deep); color:var(--text); outline:none; }
.kodex-setting-toggle { appearance:none; width:42px; height:24px; flex:0 0 auto; position:relative; border:1px solid var(--border); border-radius:999px; background:var(--surface-control); cursor:pointer; }
.kodex-setting-toggle::after { content:""; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%; background:var(--muted); transition:transform .2s ease,background .2s ease; }
.kodex-setting-toggle:checked { border-color:var(--accent); background:rgba(132,204,22,.22); }
.kodex-setting-toggle:checked::after { transform:translateX(18px); background:var(--accent); }
.kodex-setting-toggle:focus-visible,.kodex-site-settings-close:focus-visible,.kodex-site-settings-trigger:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.kodex-site-settings-footer { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:16px; }
.kodex-site-settings-reset { min-height:42px; padding:10px 14px; border:1px solid var(--border); border-radius:10px; background:transparent; color:var(--muted-light); font-size:12px; font-weight:700; }
.kodex-site-settings-reset:hover { border-color:var(--border-strong); color:var(--text); }
html[data-kodex-theme="light"] .kodex-site-settings-backdrop { background:rgba(15,23,42,.28); }
html[data-kodex-theme="light"] .kodex-site-settings-trigger { background:rgba(255,255,255,.9); }

/* Unified cookie/privacy controls inside the main KODEX preferences panel */
.kodex-site-settings-privacy {
    grid-column: 1 / -1;
}
.kodex-site-settings-note {
    margin: 8px 0 0;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.65;
}
.kodex-site-settings-consent-status {
    margin-top: 10px;
    min-height: 18px;
    color: var(--muted-light);
    font-size: 10px;
    font-weight: 700;
}
body.kodex-site-settings-open { overflow:hidden; }

@media (max-width:760px) {
    .kodex-site-settings { padding:10px; }
    .kodex-site-settings-card { max-height:calc(100vh - 20px); padding:16px; border-radius:16px; }
    .kodex-site-settings-sections { grid-template-columns:1fr; }
    .kodex-site-settings-footer { flex-direction:column-reverse; align-items:stretch; }
    .kodex-site-settings-footer button { width:100%; }
    .kodex-site-settings-trigger { right:12px; bottom:12px; }
}


/* =========================================================
   KODEX — POLISH PACK / V6
========================================================= */

:root {
    --kodex-light-bg:#f5f5f3;
    --kodex-light-surface:#ffffff;
    --kodex-light-surface-2:#eeeeeb;
    --kodex-light-border:rgba(0,0,0,.10);
    --kodex-light-text:#111111;
    --kodex-light-muted:#666666;
}

html[data-kodexTheme="light"] body {
    background:var(--kodex-light-bg);
    color:var(--kodex-light-text);
}
html[data-kodexTheme="light"] .navbar {
    background:rgba(245,245,243,.78);
    border-bottom-color:var(--kodex-light-border);
}
html[data-kodexTheme="light"] .project-card,
html[data-kodexTheme="light"] .service-card,
html[data-kodexTheme="light"] .detail-card,
html[data-kodexTheme="light"] .about-final-card,
html[data-kodexTheme="light"] .case-study-step {
    background:var(--kodex-light-surface);
    border-color:var(--kodex-light-border);
    color:var(--kodex-light-text);
}
html[data-kodexTheme="light"] .faq-section,
html[data-kodexTheme="light"] .kodex-faq-item {
    color:var(--kodex-light-text);
}
html[data-kodexTheme="light"] .kodex-faq-item {
    background:var(--kodex-light-surface);
    border-color:var(--kodex-light-border);
}
html[data-kodexTheme="light"] .kodex-faq-item p,
html[data-kodexTheme="light"] .case-study-step p,
html[data-kodexTheme="light"] .project-description-inner p {
    color:var(--kodex-light-muted);
}
html[data-kodexTheme="light"] .section-heading h2,
html[data-kodexTheme="light"] .section-header h2,
html[data-kodexTheme="light"] h1,
html[data-kodexTheme="light"] h2,
html[data-kodexTheme="light"] h3 {
    color:var(--kodex-light-text);
}
html[data-kodexTheme="light"] .background-glow,
html[data-kodexTheme="light"] .glow-one,
html[data-kodexTheme="light"] .glow-two,
html[data-kodexTheme="light"] .cta-glow {
    opacity:.12;
}
html[data-kodexTheme="light"] .kodex-site-settings-card,
html[data-kodexTheme="light"] .kodex-modal-card,
html[data-kodexTheme="light"] .kodex-command-palette {
    background:rgba(255,255,255,.98);
    border-color:rgba(0,0,0,.10);
    color:#111;
}
html[data-kodexTheme="light"] .kodex-command-input,
html[data-kodexTheme="light"] .kodex-site-settings select {
    color:#111;
    background:#f6f6f3;
    border-color:rgba(0,0,0,.12);
}
html[data-kodexTheme="light"] .kodex-command-item-description,
html[data-kodexTheme="light"] .kodex-site-settings-header p,
html[data-kodexTheme="light"] .kodex-setting-control small,
html[data-kodexTheme="light"] .kodex-setting-row small {
    color:#6b6b6b;
}

html[data-kodexContrast="high"] {
    --border:rgba(255,255,255,.24) !important;
}
html[data-kodexTheme="light"][data-kodexContrast="high"] {
    --kodex-light-border:rgba(0,0,0,.22);
}

html[data-kodexTextSize="large"] body {
    font-size:106%;
}
html[data-kodexTextSize="large"] .muted,
html[data-kodexTextSize="large"] p {
    line-height:1.8;
}

html[data-kodexAnimations="off"] *,
html[data-kodexMotion="reduced"] * {
    animation-duration:0.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
    scroll-behavior:auto !important;
}
html[data-kodexHover="off"] *:hover {
    transform:none !important;
}
html[data-kodexAccentEffects="off"] .background-glow,
html[data-kodexAccentEffects="off"] .glow-one,
html[data-kodexAccentEffects="off"] .glow-two,
html[data-kodexAccentEffects="off"] .cta-glow {
    opacity:0 !important;
}
html[data-kodexPerformance="on"] .background-glow,
html[data-kodexPerformance="on"] .cta-glow,
html[data-kodexPerformance="on"] .kodex-loader-line,
html[data-kodexPerformance="on"] .glow-one,
html[data-kodexPerformance="on"] .glow-two {
    opacity:0 !important;
}
html[data-kodexPerformance="on"] * {
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}
html[data-kodexSmoothScroll="on"] {
    scroll-behavior:smooth;
}
html[data-kodexSmoothScroll="off"] {
    scroll-behavior:auto;
}

/* navigation progress */
.kodex-page-progress {
    position:fixed;
    inset:0 0 auto 0;
    height:3px;
    z-index:5000;
    transform:scaleX(0);
    transform-origin:left;
    background:linear-gradient(90deg,#84CC16,#A3E635,#38BDF8);
    box-shadow:0 0 18px rgba(132,204,22,.45);
    opacity:0;
    pointer-events:none;
    transition:transform .35s ease,opacity .2s ease;
}
.kodex-page-progress.active { opacity:1; transform:scaleX(.72); }
.kodex-page-progress.finishing { transform:scaleX(1); }

/* active navigation */
.nav-links a.kodex-current,
.mobile-menu a.kodex-current {
    color:#f5f5f5;
}
.nav-links a.kodex-current::after {
    width:100%;
}
html[data-kodexTheme="light"] .nav-links a.kodex-current { color:#111; }

/* toast system */
.kodex-toast-stack {
    position:fixed;
    right:22px;
    bottom:22px;
    z-index:4800;
    display:flex;
    flex-direction:column;
    gap:10px;
    width:min(360px,calc(100vw - 32px));
    pointer-events:none;
}
.kodex-toast {
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:10px;
    align-items:center;
    padding:13px 14px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:13px;
    background:rgba(16,16,16,.94);
    backdrop-filter:blur(16px);
    color:#f5f5f5;
    box-shadow:0 20px 45px rgba(0,0,0,.24);
    transform:translateY(10px);
    opacity:0;
    transition:.25s ease;
    pointer-events:auto;
    font-size:12px;
}
.kodex-toast.show { opacity:1; transform:translateY(0); }
.kodex-toast-icon { color:#84CC16; font-weight:900; }
.kodex-toast-close { border:0; background:none; color:#888; cursor:pointer; font-size:18px; }
html[data-kodexTheme="light"] .kodex-toast { background:rgba(255,255,255,.96); border-color:rgba(0,0,0,.10); color:#111; }

/* back to top */
.kodex-back-top {
    position:fixed;
    right:22px;
    bottom:92px;
    width:44px;
    height:44px;
    border-radius:12px;
    border:1px solid var(--border);
    background:rgba(16,16,16,.88);
    color:#f5f5f5;
    display:grid;
    place-items:center;
    font-size:17px;
    cursor:pointer;
    z-index:3000;
    opacity:0;
    transform:translateY(10px);
    pointer-events:none;
    transition:.22s ease;
    backdrop-filter:blur(12px);
}
.kodex-back-top.visible { opacity:1; transform:translateY(0); pointer-events:auto; }
html[data-kodexTheme="light"] .kodex-back-top { background:rgba(255,255,255,.94); color:#111; border-color:rgba(0,0,0,.12); }

/* FAQ */
.kodex-faq-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}
.kodex-faq-item {
    border:1px solid var(--border);
    border-radius:14px;
    background:var(--surface);
    overflow:hidden;
}
.kodex-faq-item summary {
    list-style:none;
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding:20px 22px;
    cursor:pointer;
    font-weight:700;
    font-size:14px;
}
.kodex-faq-item summary::-webkit-details-marker { display:none; }
.kodex-faq-item summary span { color:#84CC16; font-size:20px; line-height:1; transition:transform .2s ease; }
.kodex-faq-item[open] summary span { transform:rotate(45deg); }
.kodex-faq-item p { margin:0; padding:0 22px 22px; color:#858585; font-size:13px; line-height:1.7; }

/* case studies */
.project-case-study { padding:110px 6vw 0; }
.case-study-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.case-study-step { padding:28px; border:1px solid var(--border); border-radius:15px; background:var(--surface); }
.case-study-step > span { display:inline-grid; place-items:center; width:40px; height:40px; border:1px solid rgba(132,204,22,.24); border-radius:10px; color:#84CC16; font-size:12px; font-weight:800; }
.case-study-step h3 { margin:22px 0 9px; font-size:21px; }
.case-study-step p { margin:0; color:#858585; line-height:1.7; font-size:13px; }

/* project list view */
html[data-kodexProjectView="list"] .projects-grid { grid-template-columns:1fr; }
html[data-kodexProjectView="list"] .projects-grid .project-card { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(250px,.95fr); align-items:stretch; }
html[data-kodexProjectView="list"] .projects-grid .project-preview { min-height:260px; }

/* 404 search */
.error-search-wrap { width:min(620px,100%); margin:22px auto 0; text-align:left; }
.error-search-wrap label { display:block; margin-bottom:8px; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:#777; }
.error-search { display:grid; grid-template-columns:1fr auto; gap:8px; }
.error-search input { min-height:46px; width:100%; padding:0 14px; border-radius:9px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.03); color:#f5f5f5; outline:none; }
.error-search button { min-height:46px; padding:0 16px; border:1px solid rgba(132,204,22,.25); border-radius:9px; background:#84CC16; color:#050505; font-weight:800; cursor:pointer; }
.error-search-results { display:grid; gap:6px; margin-top:8px; }
.error-search-results a { padding:11px 12px; border-radius:9px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.025); color:#ddd; text-decoration:none; font-size:12px; }
.error-search-results a:hover { border-color:rgba(132,204,22,.28); color:#fff; }

/* mobile polish */
@media (max-width: 760px) {
    .kodex-faq-grid { grid-template-columns:1fr; }
    .case-study-grid { grid-template-columns:1fr; }
    .project-case-study { padding-top:76px; }
    html[data-kodexProjectView="list"] .projects-grid .project-card { grid-template-columns:1fr; }
    .kodex-back-top { right:16px; bottom:84px; }
    .kodex-toast-stack { right:16px; bottom:16px; width:calc(100vw - 32px); }
}
@media (max-width: 520px) {
    .error-search { grid-template-columns:1fr; }
    .error-search button { width:100%; }
}

/* =========================================================
   KODEX — SHARE SECTION
========================================================= */
.share-section { padding-top: 70px; }
.share-box {
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
    gap:50px;
    align-items:center;
    padding:42px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface);
    position:relative;
    overflow:hidden;
}
.share-box::before {
    content:"";
    position:absolute;
    width:380px;
    height:380px;
    right:-140px;
    top:-180px;
    border-radius:50%;
    background:rgba(56,189,248,.06);
    filter:blur(80px);
    pointer-events:none;
}
.share-copy,.share-preview { position:relative; z-index:1; }
.share-copy h2 {
    margin:18px 0 20px;
    font-size:clamp(44px,5vw,68px);
    line-height:.98;
    letter-spacing:-3px;
}
.share-copy h2 span { color:var(--muted); }
.share-copy p { max-width:560px; color:var(--muted); font-size:14px; line-height:1.8; }
.share-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.share-actions button { cursor:pointer; border:0; font:inherit; }
.share-links { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.share-link {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:0 13px;
    border:1px solid var(--border);
    border-radius:999px;
    color:var(--text);
    background:rgba(255,255,255,.025);
    font-size:11px;
    transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.share-link:hover { transform:translateY(-2px); border-color:rgba(132,204,22,.34); background:rgba(132,204,22,.05); }
.share-preview {
    border:1px solid var(--border);
    border-radius:16px;
    overflow:hidden;
    background:var(--surface-light);
    box-shadow:0 18px 60px rgba(0,0,0,.2);
}
.share-preview-top {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    padding:14px 16px;
    border-bottom:1px solid var(--border);
}
.share-preview-brand { display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:700; }
.share-preview-logo { width:24px; height:24px; display:grid; place-items:center; border:1px solid var(--border); border-radius:7px; color:var(--text-strong); font-weight:900; }
.share-preview-domain { color:var(--muted); font-size:10px; }
.share-preview img { display:block; width:100%; aspect-ratio:1200/630; object-fit:cover; }
.share-preview-bottom { display:flex; flex-direction:column; gap:6px; padding:16px; }
.share-preview-bottom strong { font-size:14px; }
.share-preview-bottom span { color:var(--muted); font-size:11px; line-height:1.6; }
html[data-kodexTheme="light"] .share-preview { background:#fff; box-shadow:0 18px 60px rgba(0,0,0,.08); }
html[data-kodexTheme="light"] .share-link { background:rgba(0,0,0,.018); }
@media (max-width:900px) {
    .share-box { grid-template-columns:1fr; padding:30px; gap:30px; }
}
@media (max-width:650px) {
    .share-section { padding-top:55px; }
    .share-box { padding:22px; border-radius:15px; }
    .share-copy h2 { font-size:42px; letter-spacing:-2.5px; }
    .share-actions { flex-direction:column; }
    .share-actions button { width:100%; }
    .share-preview-domain { display:none; }
}
