/* ========================================================
   GABI GARTENBAU – ULTIMATE PREMIUM WEBSITE
   ======================================================== */
:root {
    --green: #1B5E20;
    --green-light: #2E7D32;
    --green-bright: #43A047;
    --green-accent: #66BB6A;
    --green-glow: rgba(102,187,106,0.35);
    --earth: #5D4037;
    --earth-light: #8D6E63;
    --gold: #C8A96E;
    --gold-light: #D4B982;
    --bg: #0C0F0A;
    --bg-2: #131813;
    --bg-3: #1A211A;
    --bg-light: #F7F9F5;
    --bg-light-2: #EEF2EA;
    --text: #F1F5EC;
    --text-muted: #ccd6c4;
    --text-dim: #a8b59e;
    --border: rgba(255,255,255,0.07);
    --border-light: rgba(0,0,0,0.08);
    --radius: 16px;
    --radius-lg: 24px;
    --font: 'Outfit', -apple-system, sans-serif;
    --font-display: 'Cormorant Garamond', Georgia, serif;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:auto; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
body { font-family:var(--font); background:var(--bg); color:var(--text); overflow-x:hidden; line-height:1.6; font-weight:500; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.container { width:100%; max-width:1240px; margin:0 auto; padding:0 24px; }

/* ---- SCROLL PROGRESS ---- */
.scroll-progress { position:fixed; top:0; left:0; width:0%; height:3px; background:linear-gradient(90deg, var(--green-bright), var(--green-accent)); z-index:10001; }

/* ---- CUSTOM CURSOR ---- */
.cursor,.cursor-follower { position:fixed; border-radius:50%; pointer-events:none; z-index:9999; mix-blend-mode:difference; }
.cursor { width:8px; height:8px; background:#fff; transform:translate(-50%,-50%); }
.cursor-follower { width:36px; height:36px; border:1px solid rgba(255,255,255,0.5); transform:translate(-50%,-50%); transition:width .3s,height .3s,border-color .3s; }
.cursor-follower.hover { width:60px; height:60px; border-color:var(--green-accent); }
@media(hover:none){ .cursor,.cursor-follower{display:none;} }

/* ---- PAGE REVEAL ---- */
.page-reveal { position:fixed; inset:0; z-index:10000; background:var(--bg); display:flex; align-items:center; justify-content:center; pointer-events:none; }
.page-reveal.done { display:none; }
.page-reveal-logo { display:flex; flex-direction:column; align-items:center; gap:8px; opacity:0; transform:scale(0.95); }
.page-reveal-name { font-family:var(--font-display); font-size:clamp(2.2rem,6vw,4rem); font-weight:700; color:#fff; letter-spacing:0.02em; line-height:1; }
.page-reveal-sub { font-family:var(--font); font-size:clamp(0.65rem,1.5vw,0.85rem); font-weight:600; color:var(--green-accent); letter-spacing:0.3em; text-transform:uppercase; }
.page-reveal-line { width:60px; height:2px; background:var(--green-accent); transform:scaleX(0); margin-top:4px; }

/* ---- FULLSCREEN INTRO ---- */
.intro { position:fixed; inset:0; z-index:10000; background:#000; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.intro.hidden { pointer-events:none; }
.intro-video-wrap { position:absolute; inset:0; will-change:transform; }
.intro-video { display:block; width:100%; height:100%; object-fit:cover; }
.intro-video-overlay { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0.25) 0%,rgba(0,0,0,0.55) 100%); transition:backdrop-filter 1s; }
.intro-video-overlay.blurred { backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); background:linear-gradient(180deg,rgba(0,0,0,0.15) 0%,rgba(0,0,0,0.35) 100%); }
.intro-text-layer { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; z-index:2; gap:0; opacity:0; }
.intro-brand { font-family:var(--font-display); font-size:clamp(2.5rem,8vw,5rem); font-weight:700; color:#fff; letter-spacing:0.02em; line-height:1; opacity:0; transform:scale(1.3); text-shadow:0 4px 40px rgba(0,0,0,0.5); text-align:center; }
.intro-tagline { font-family:var(--font); font-size:clamp(0.8rem,2vw,1.2rem); font-weight:500; color:rgba(255,255,255,0.7); letter-spacing:0.15em; text-transform:uppercase; opacity:0; transform:translateY(20px); text-align:center; margin-top:12px; }
.intro-divider { width:60px; height:2px; background:var(--green-accent); margin:16px 0; transform:scaleX(0); box-shadow:0 0 20px var(--green-glow); }
/* Intro Menu */
.intro-menu { position:absolute; bottom:0; left:0; right:0; display:flex; justify-content:center; z-index:3; opacity:0; transform:translateY(100%); pointer-events:none; padding:0 24px 40px; }
.intro-menu.active { pointer-events:auto; }
.intro-menu-inner { display:flex; flex-direction:column; gap:0; width:100%; max-width:480px; padding:24px 24px 16px; background:rgba(0,0,0,0.4); backdrop-filter:blur(28px); -webkit-backdrop-filter:blur(28px); border-radius:20px; border:1px solid rgba(255,255,255,0.1); box-shadow:0 16px 60px rgba(0,0,0,0.5); }
.intro-menu-divider { height:1px; background:rgba(255,255,255,0.1); margin:4px 0; }
.intro-menu-link { display:flex; align-items:center; gap:16px; color:#fff; cursor:pointer; transition:all .3s cubic-bezier(.16,1,.3,1); opacity:0; transform:translateY(20px); padding:14px 14px; border-radius:12px; }
.intro-menu-link:hover { background:rgba(255,255,255,0.08); padding-left:20px; }
.intro-menu-link:hover .intro-menu-text { color:var(--green-accent); }
.intro-menu-link:hover .intro-menu-arrow { color:var(--green-accent); transform:translateX(3px); }
.intro-menu-text { font-family:var(--font); flex:1; font-size:clamp(1rem,2.5vw,1.15rem); font-weight:500; transition:color .3s; }
.intro-menu-home .intro-menu-text { font-family:var(--font-display); font-size:clamp(1.6rem,4vw,2rem); font-weight:700; }
.intro-menu-arrow { color:rgba(255,255,255,0.25); transition:all .3s; }

/* ---- NAVIGATION ---- */
.nav { position:fixed; top:0; left:0; right:0; z-index:100; padding:24px 0; background:linear-gradient(to bottom,rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); transition:all .4s cubic-bezier(.16,1,.3,1); }
.nav.scrolled { background:rgba(10,14,10,0.95); backdrop-filter:blur(24px) saturate(1.4); -webkit-backdrop-filter:blur(24px) saturate(1.4); padding:14px 0; border-bottom:1px solid rgba(255,255,255,0.1); }
.nav-inner { max-width:1240px; margin:0 auto; padding:0 28px; display:flex; align-items:center; justify-content:space-between; }
.nav-logo { display:flex; align-items:center; gap:10px; }
.nav-logo-gg { font-family:var(--font-display); font-weight:700; font-size:34px; color:var(--green-accent); text-shadow:0 2px 12px rgba(102,187,106,0.4); }
.nav-logo-divider { width:1px; height:26px; background:rgba(255,255,255,0.35); }
.nav-logo-text { font-family:var(--font); font-weight:700; font-size:14px; letter-spacing:2px; color:#ffffff; text-transform:uppercase; }
.nav-links { display:flex; gap:4px; background:rgba(0,0,0,0.3); border:1px solid rgba(255,255,255,0.18); border-radius:100px; padding:5px; backdrop-filter:blur(10px); }
.nav-link { font-size:15px; font-weight:700; color:#ffffff; letter-spacing:.3px; transition:all .3s; padding:10px 22px; border-radius:100px; }
.nav-link:hover { color:#fff; background:rgba(255,255,255,0.15); }
.nav-cta { display:flex; align-items:center; gap:8px; font-size:15px; font-weight:700; color:#fff; background:var(--green); border:none; padding:12px 28px; border-radius:100px; transition:all .3s; box-shadow:0 4px 15px rgba(27,94,32,0.4); cursor:pointer; }
.nav-cta:hover { background:var(--green-light); transform:translateY(-1px); box-shadow:0 6px 25px rgba(27,94,32,0.5); }
.nav-cta svg { width:16px; height:16px; }
.nav-burger { display:none; flex-direction:column; gap:6px; background:none; border:none; cursor:pointer; padding:4px; z-index:101; }
.nav-burger span { width:24px; height:2px; background:var(--text); transition:all .3s; }
.nav-burger.active span:first-child { transform:rotate(45deg) translate(3px,3px); }
.nav-burger.active span:last-child { transform:rotate(-45deg) translate(3px,-3px); }
.mobile-menu { position:fixed; inset:0; background:rgba(12,15,10,0.97); backdrop-filter:blur(20px); z-index:99; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .5s; }
.mobile-menu.active { opacity:1; pointer-events:all; }
.mobile-menu-inner { text-align:center; display:flex; flex-direction:column; align-items:center; gap:8px; }
.mobile-link { display:block; font-family:var(--font-display); font-size:28px; font-weight:600; padding:12px 32px; color:var(--text-muted); transition:color .3s,transform .3s; }
.mobile-link:hover { color:var(--text); transform:translateX(4px); }
.mobile-link-cta { color:var(--green-accent); font-family:var(--font); font-size:18px; margin-top:24px; padding:14px 36px; border:1px solid rgba(102,187,106,0.3); border-radius:100px; }

/* ---- HERO ---- */
.hero { position:relative; height:100vh; min-height:700px; display:flex; align-items:center; overflow:hidden; }
.hero-bg { position:absolute; inset:0; }
.hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-img-fallback { z-index:-1; }
.hero-particles { position:absolute; inset:0; z-index:1; pointer-events:none; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(135deg,rgba(12,15,10,0.8) 0%,rgba(0,0,0,0.35) 100%); z-index:1; }
.hero-content { position:relative; z-index:2; max-width:1240px; margin:0 auto; padding:0 24px; padding-top:80px; }
.hero-tag { display:flex; align-items:center; gap:12px; margin-bottom:28px; }
.hero-tag-line { width:40px; height:2px; background:#fff; border-radius:2px; box-shadow:0 0 8px rgba(255,255,255,0.5); }
.hero-tag-text { font-size:14px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:#ffffff; background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.5); padding:8px 22px; border-radius:100px; backdrop-filter:blur(8px); text-shadow:0 1px 6px rgba(0,0,0,0.4); }
.hero-title { font-family:var(--font-display); font-size:clamp(44px,8vw,96px); font-weight:700; line-height:1.05; margin-bottom:24px; color:#fff; }
.hero-title-line { display:block; overflow:hidden; }
.hero-title-word { display:inline-block; }
.hero-title em { font-style:italic; color:var(--green-accent); }
.hero-sub { font-size:18px; font-weight:600; line-height:1.7; color:rgba(255,255,255,0.96); max-width:520px; margin-bottom:12px; }
.hero-typewriter { margin-bottom:28px; display:flex; align-items:center; gap:10px; }
.hero-typewriter-line { width:20px; height:1px; background:var(--green-accent); }
.typewriter-text { font-size:14px; color:var(--green-accent); font-weight:600; letter-spacing:1px; }
.typewriter-cursor { display:inline-block; width:3px; height:1em; background:var(--green-accent); margin-left:2px; vertical-align:text-bottom; animation:blink .8s step-end infinite; }
@keyframes blink { 50%{opacity:0;} }
.hero-actions { display:flex; gap:16px; flex-wrap:wrap; }
.hero-scroll { display:flex; flex-direction:column; align-items:center; gap:6px; }
.hero-scroll span { font-size:10px; letter-spacing:3px; text-transform:uppercase; color:rgba(255,255,255,0.5); }
.hero-scroll-line { width:1px; height:40px; background:linear-gradient(to bottom,var(--green-accent),transparent); animation:scrollLine 2s ease-in-out infinite; }
@keyframes scrollLine { 0%{transform:scaleY(0);transform-origin:top;} 50%{transform:scaleY(1);transform-origin:top;} 51%{transform-origin:bottom;} 100%{transform:scaleY(0);transform-origin:bottom;} }

/* ---- BUTTONS ---- */
.btn { display:inline-flex; align-items:center; gap:10px; padding:15px 34px; font-family:var(--font); font-size:14px; font-weight:600; border-radius:100px; transition:all .4s cubic-bezier(.16,1,.3,1); cursor:pointer; border:none; letter-spacing:.3px; position:relative; overflow:hidden; }
.btn::after { content:''; position:absolute; inset:0; background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,0.15),transparent 60%); opacity:0; transition:opacity .3s; }
.btn:hover::after { opacity:1; }
.btn-primary { background:linear-gradient(135deg,var(--green),var(--green-light)); color:#fff; box-shadow:0 4px 15px rgba(27,94,32,0.35); }
.btn-primary:hover { background:linear-gradient(135deg,var(--green-light),var(--green-bright)); transform:translateY(-2px); box-shadow:0 8px 30px rgba(27,94,32,0.5); }
.btn-ghost { border:1px solid rgba(255,255,255,0.2); color:#fff; background:rgba(255,255,255,0.03); }
.btn-ghost:hover { border-color:#fff; background:rgba(255,255,255,0.1); transform:translateY(-2px); }
.btn-white { background:#fff; color:var(--green); box-shadow:0 4px 15px rgba(0,0,0,0.1); }
.btn-white:hover { transform:translateY(-2px); box-shadow:0 8px 30px rgba(0,0,0,0.15); }
.btn-lg { padding:18px 42px; font-size:15px; }
.btn svg { width:18px; height:18px; }

/* ---- MARQUEE ---- */
.marquee { padding:18px 0; background:var(--bg-2); border-top:1px solid var(--border); border-bottom:1px solid var(--border); overflow:hidden; }
.marquee-track { display:flex; align-items:center; gap:40px; animation:marqueeScroll 30s linear infinite; white-space:nowrap; width:max-content; }
.marquee-track span { font-family:var(--font); font-size:13px; font-weight:600; letter-spacing:4px; color:var(--text-dim); text-transform:uppercase; }
.marquee-dot { width:5px; height:5px; background:var(--green-accent); border-radius:50%; display:inline-block; flex-shrink:0; }
@keyframes marqueeScroll { 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }

/* ---- SECTIONS ---- */
.section { padding:120px 0; position:relative; }
.section-light { background:var(--bg-light); color:#1a1a17; }
.section-tag { display:inline-block; font-size:11px; font-weight:700; letter-spacing:4px; text-transform:uppercase; color:var(--green-accent); margin-bottom:16px; background:rgba(102,187,106,0.08); border:1px solid rgba(102,187,106,0.15); padding:6px 18px; border-radius:100px; }
.section-light .section-tag { color:var(--green); background:rgba(27,94,32,0.06); border-color:rgba(27,94,32,0.12); }
.section-title { font-family:var(--font-display); font-size:clamp(28px,4.5vw,56px); font-weight:700; line-height:1.12; margin-bottom:20px; text-wrap:balance; }
.section-desc { font-size:17px; font-weight:600; line-height:1.7; color:var(--text-muted); max-width:560px; }
.section-light .section-desc { color:#3d4838; }
.section-header { text-align:center; margin-bottom:64px; }
.section-header .section-desc { margin:0 auto; }

/* ---- SERVICES WITH IMAGES ---- */
.services-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.service-card { border-radius:var(--radius-lg); border:1px solid var(--border); transition:border-color .4s,box-shadow .4s; will-change:transform; position:relative; cursor:pointer; perspective:1000px; }
.service-card:hover { border-color:rgba(102,187,106,0.3); box-shadow:0 8px 40px rgba(102,187,106,0.08); }
.service-card-inner { width:100%; transform-style:preserve-3d; position:relative; }
.service-card-front { background:linear-gradient(180deg,var(--bg-2),rgba(19,24,19,0.6)); border-radius:var(--radius-lg); overflow:hidden; backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.service-card-back { position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden; transform:rotateY(180deg); background:linear-gradient(135deg,rgba(18,38,18,0.99),rgba(8,18,8,0.99)); border-radius:var(--radius-lg); display:flex; flex-direction:column; justify-content:center; padding:36px; border:1px solid rgba(102,187,106,0.15); }
.service-card-back-num { font-family:var(--font-display); font-size:56px; font-weight:700; -webkit-text-stroke:1px rgba(102,187,106,0.4); color:transparent; margin-bottom:6px; }
.service-card-back-title { font-family:var(--font-display); font-size:22px; font-weight:700; color:#fff; margin-bottom:16px; }
.service-card-back-desc { font-size:15px; font-weight:600; line-height:1.75; color:#c8dcc4; margin-bottom:28px; flex:1; }
.service-card-back-hint { font-size:11px; letter-spacing:2.5px; text-transform:uppercase; color:rgba(102,187,106,0.6); }
.service-card-glare { position:absolute; inset:0; background:radial-gradient(circle at 50% 50%,rgba(255,255,255,0.2),transparent 60%); opacity:0; pointer-events:none; z-index:10; border-radius:var(--radius-lg); }
.service-card-img { height:220px; position:relative; overflow:hidden; }
.service-card-img img { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.service-card:not(.flipped):hover .service-card-img img { transform:scale(1.08); }
.service-card-img-overlay { position:absolute; inset:0; background:linear-gradient(to top,var(--bg-2) 0%,transparent 50%); }
.service-card-content { padding:28px; position:relative; }
.service-card-num { font-family:var(--font-display); font-size:48px; font-weight:700; position:absolute; top:-24px; right:28px; -webkit-text-stroke:1px var(--text-dim); color:transparent; opacity:0.3; }
.service-card-title { font-family:var(--font-display); font-size:22px; font-weight:700; margin-bottom:10px; }
.service-card-arrow { width:40px; height:40px; border:1px solid var(--border); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--text-muted); transition:all .3s; }
.service-card:not(.flipped):hover .service-card-arrow { background:var(--green-accent); border-color:var(--green-accent); color:#000; }

/* ---- ABOUT ---- */
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.about-img-wrap { position:relative; }
.about-img-inner { border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/5; }
.about-img-inner img { width:100%; height:100%; object-fit:cover; }
.about-img-badge { position:absolute; bottom:-24px; right:-24px; background:var(--green); color:#fff; padding:24px; border-radius:var(--radius); text-align:center; box-shadow:0 8px 30px rgba(27,94,32,0.4); }
.about-img-badge-num { font-family:var(--font-display); font-size:42px; font-weight:700; display:block; }
.about-img-badge-text { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:1px; opacity:0.8; }
.about-team { display:flex; gap:16px; margin-top:20px; }
.about-team-portrait { width:110px; height:110px; border-radius:16px; overflow:hidden; border:2px solid var(--border); transition:border-color .3s,transform .4s,box-shadow .4s; cursor:pointer; }
.about-team-portrait:hover { border-color:var(--green-accent); transform:translateY(-4px); box-shadow:0 12px 40px rgba(102,187,106,0.15); }
.about-team-portrait img { width:100%; height:100%; object-fit:cover; }
.about-desc { font-size:16px; font-weight:600; line-height:1.8; color:var(--text-muted); margin-bottom:14px; }
.section-light .about-desc { color:#3a4232; }
.about-features { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:32px; }
.about-feature { display:flex; align-items:center; gap:12px; font-size:14px; font-weight:600; }
.section-light .about-feature { color:#1a1a17; }
.about-feature-icon { width:34px; height:34px; background:rgba(27,94,32,0.08); border-radius:10px; display:flex; align-items:center; justify-content:center; color:var(--green); flex-shrink:0; }
.about-feature-icon svg { width:18px; height:18px; }

/* ---- PROJECTS ---- */
.projects-filter { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-bottom:40px; }
.filter-btn { padding:8px 22px; font-family:var(--font); font-size:13px; font-weight:600; border:1px solid var(--border); border-radius:100px; background:rgba(255,255,255,0.03); color:var(--text-muted); cursor:pointer; transition:all .3s; }
.filter-btn:hover,.filter-btn.active { background:var(--green); border-color:var(--green); color:#fff; }
.projects-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.project-card { position:relative; border-radius:var(--radius); overflow:hidden; aspect-ratio:4/3; cursor:pointer; }
.project-card img { width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.16,1,.3,1); }
.project-card:hover img { transform:scale(1.1); }
.project-card-overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(12,15,10,0.85) 0%,transparent 60%); opacity:0; transition:opacity .4s; display:flex; align-items:flex-end; padding:24px; }
.project-card:hover .project-card-overlay { opacity:1; }
.project-card-title { color:#fff; font-family:var(--font-display); font-size:18px; font-weight:700; transform:translateY(10px); transition:transform .4s; }
.project-card:hover .project-card-title { transform:translateY(0); }

/* ---- B/A SLIDER ---- */
.ba-section { margin-top:80px; }
.ba-slider { position:relative; max-width:800px; margin:0 auto; border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:16/10; cursor:ew-resize; box-shadow:0 20px 60px rgba(0,0,0,0.3); }
.ba-before,.ba-after { position:absolute; inset:0; }
.ba-before img,.ba-after img { width:100%; height:100%; object-fit:cover; }
.ba-after { clip-path:inset(0 50% 0 0); }
.ba-handle { position:absolute; top:0; bottom:0; left:50%; width:4px; background:#fff; z-index:2; cursor:ew-resize; }
.ba-handle::before { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:44px; height:44px; background:#fff; border-radius:50%; box-shadow:0 2px 10px rgba(0,0,0,0.3); }
.ba-handle::after { content:'↔'; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-size:18px; color:var(--green); z-index:1; }
.ba-label { position:absolute; top:16px; padding:6px 16px; background:rgba(0,0,0,0.5); backdrop-filter:blur(8px); color:#fff; font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; border-radius:100px; z-index:3; }
.ba-label-before { left:16px; }
.ba-label-after { right:16px; }

/* ---- STATS ---- */
.stats { position:relative; overflow:hidden; }
.stats-bg { position:absolute; inset:0; }
.stats-bg-img { position:absolute; inset:0; filter:grayscale(1); opacity:0.12; }
.stats-bg-img img { width:100%; height:100%; object-fit:cover; }
.stats-bg-overlay { position:absolute; inset:0; background:var(--bg); opacity:0.7; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:40px; position:relative; z-index:1; text-align:center; }
.stat-num { font-family:var(--font-display); font-size:clamp(40px,6vw,64px); font-weight:700; color:var(--green-accent); display:inline; }
.stat-suffix { font-family:var(--font-display); font-size:clamp(24px,3vw,36px); font-weight:700; color:var(--green-accent); }
.stat-label { display:block; font-size:15px; font-weight:600; color:var(--text-muted); margin-top:8px; letter-spacing:.5px; }

/* ---- TESTIMONIALS ---- */
.testimonials-track { display:flex; gap:24px; }
.testimonial-card { flex:0 0 380px; background:linear-gradient(160deg,var(--bg-2),rgba(19,24,19,0.5)); border:1px solid var(--border); border-radius:var(--radius-lg); padding:32px; transition:border-color .3s,box-shadow .3s,transform .3s; }
.testimonial-card:hover { border-color:rgba(102,187,106,0.2); box-shadow:0 4px 24px rgba(0,0,0,0.3); transform:translateY(-2px); }
.testimonial-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.testimonial-header .testimonial-stars { margin-bottom:0; }
.google-icon { flex-shrink:0; opacity:0.85; }
.testimonial-cta-card { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:linear-gradient(160deg,var(--bg-3),rgba(27,94,32,0.1)); border-color:rgba(102,187,106,0.15); }
.testimonial-stars { display:flex; gap:4px; margin-bottom:16px; color:#fbbf24; }
.testimonial-stars svg { width:18px; height:18px; fill:currentColor; }
.testimonial-text { font-size:16px; font-weight:600; line-height:1.7; color:var(--text-muted); margin-bottom:20px; font-style:italic; }
.testimonial-author { display:flex; align-items:center; gap:12px; }
.testimonial-avatar { width:44px; height:44px; border-radius:50%; background:var(--bg-3); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:700; font-size:16px; color:var(--green-accent); }
.testimonial-name { font-weight:600; font-size:14px; }
.testimonial-role { font-size:12px; color:var(--text-dim); }
.testimonials-nav { display:flex; gap:12px; margin-top:32px; justify-content:center; }
.test-nav-btn { width:44px; height:44px; border-radius:50%; border:1px solid var(--border); background:transparent; color:var(--text-muted); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .3s; }
.test-nav-btn:hover { background:var(--green); border-color:var(--green); color:#fff; }

/* ---- CTA FORM ---- */
.cta-section { padding:80px 0; }
.cta-box { background:linear-gradient(135deg,var(--bg-2),var(--bg-3)); border:1px solid var(--border); border-radius:var(--radius-lg); padding:64px; text-align:center; position:relative; overflow:hidden; }
.cta-box::before { content:''; position:absolute; inset:0; opacity:0.04; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Ccircle cx='40' cy='40' r='32' fill='none' stroke='%2366BB6A' stroke-width='0.5'/%3E%3C/svg%3E") repeat; background-size:80px; }
.cta-title { font-family:var(--font-display); font-size:clamp(24px,4vw,48px); font-weight:700; margin-bottom:16px; position:relative; }
.cta-desc { font-size:16px; font-weight:600; color:var(--text-muted); max-width:500px; margin:0 auto 24px; line-height:1.7; position:relative; }
.cta-form { max-width:560px; margin:0 auto; text-align:left; position:relative; }
.cta-form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px; }
.cta-input { width:100%; padding:14px 18px; background:rgba(255,255,255,0.05); border:1px solid var(--border); border-radius:var(--radius); color:var(--text); font-family:var(--font); font-size:15px; transition:border-color .3s,background .3s; outline:none; }
.cta-input:focus { border-color:var(--green-accent); background:rgba(102,187,106,0.05); }
.cta-input::placeholder { color:var(--text-dim); }
.cta-textarea { resize:vertical; min-height:80px; margin-bottom:16px; }
.cta-form-actions { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-top:8px; }
.cta-form-success { text-align:center; color:var(--green-accent); font-size:16px; margin-top:24px; font-weight:500; display:none; }
.btn-whatsapp { background:#25D366; color:#fff; }
.btn-whatsapp:hover { background:#1fb855; transform:translateY(-2px); box-shadow:0 6px 20px rgba(37,211,102,0.3); }

/* ---- CONTACT ---- */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:64px; }
.contact-details { margin-top:32px; display:flex; flex-direction:column; gap:24px; }
.contact-detail { display:flex; gap:16px; }
.contact-detail-icon { width:48px; height:48px; background:rgba(102,187,106,0.08); border-radius:14px; display:flex; align-items:center; justify-content:center; color:var(--green-accent); flex-shrink:0; }
.contact-detail-icon svg { width:22px; height:22px; }
.contact-detail strong { display:block; font-size:14px; margin-bottom:2px; }
.contact-detail p,.contact-detail a { font-size:15px; font-weight:600; color:var(--text-muted); line-height:1.5; }
.contact-detail a { color:var(--green-accent); }
.contact-map { border-radius:var(--radius-lg); overflow:hidden; min-height:400px; border:1px solid var(--border); }
.contact-map iframe { width:100%; height:100%; min-height:400px; border:none; filter:invert(0.92) hue-rotate(80deg) saturate(0.3); }

/* ---- FAQ ---- */
.faq-grid { max-width:800px; margin:0 auto; display:flex; flex-direction:column; gap:12px; }
.faq-item { background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:border-color .3s; }
.faq-item:hover { border-color:rgba(102,187,106,0.2); }
.faq-question { width:100%; padding:20px 24px; display:flex; justify-content:space-between; align-items:center; font-family:var(--font); font-size:15px; font-weight:600; background:none; border:none; cursor:pointer; color:var(--text); text-align:left; gap:16px; }
.faq-icon { width:28px; height:28px; border-radius:50%; background:rgba(102,187,106,0.08); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all .3s; position:relative; }
.faq-icon::before,.faq-icon::after { content:''; position:absolute; background:var(--green-accent); border-radius:2px; }
.faq-icon::before { width:12px; height:2px; }
.faq-icon::after { width:2px; height:12px; transition:transform .3s; }
.faq-item.active .faq-icon { background:var(--green-accent); }
.faq-item.active .faq-icon::before,.faq-item.active .faq-icon::after { background:#000; }
.faq-item.active .faq-icon::after { transform:rotate(90deg); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .4s cubic-bezier(.16,1,.3,1); }
.faq-answer-inner { padding:0 24px 20px; font-size:15px; font-weight:500; line-height:1.75; color:var(--text-muted); }

/* ---- FOOTER ---- */
.footer { padding:80px 0 0; border-top:1px solid var(--border); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; padding-bottom:60px; border-bottom:1px solid var(--border); }
.footer-brand-name { font-family:var(--font-display); font-size:28px; font-weight:700; margin-bottom:16px; }
.footer-brand-desc { font-size:14px; font-weight:500; color:var(--text-muted); line-height:1.7; max-width:300px; }
.footer-title { font-weight:700; font-size:12px; margin-bottom:20px; letter-spacing:2px; text-transform:uppercase; color:#c0c9b6; }
.footer-links { display:flex; flex-direction:column; gap:12px; }
.footer-link { font-size:15px; font-weight:600; color:var(--text-muted); transition:color .3s,transform .3s; display:inline-block; }
.footer-link:hover { color:var(--green-accent); transform:translateX(3px); }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; padding:24px 0; flex-wrap:wrap; gap:16px; }
.footer-copyright { font-size:13px; font-weight:500; color:var(--text-muted); }
.footer-bottom-links { display:flex; gap:24px; }
.footer-bottom-links a { font-size:13px; font-weight:500; color:var(--text-muted); transition:color .3s; }
.footer-bottom-links a:hover { color:var(--text-muted); }
.footer-social { display:flex; gap:10px; margin-top:20px; }
.footer-social-link { width:38px; height:38px; background:rgba(255,255,255,0.04); border:1px solid var(--border); border-radius:10px; display:flex; align-items:center; justify-content:center; color:var(--text-muted); transition:all .3s; }
.footer-social-link:hover { background:rgba(102,187,106,0.08); border-color:rgba(102,187,106,0.3); color:var(--green-accent); transform:translateY(-2px); }
.footer-social-link svg { width:18px; height:18px; }

/* ---- FLOATING ---- */
.floating-contact { position:fixed; bottom:32px; left:32px; z-index:90; display:flex; flex-direction:column; gap:12px; }
.floating-btn { width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; box-shadow:0 4px 20px rgba(0,0,0,0.3); transition:all .4s cubic-bezier(.16,1,.3,1); opacity:0; transform:translateY(20px) scale(0.8); position:relative; }
.floating-btn.visible { opacity:1; transform:translateY(0) scale(1); }
.floating-btn:hover { transform:translateY(-4px) scale(1.1); }
.floating-btn svg { width:24px; height:24px; }
.floating-btn-whatsapp { background:#25D366; }
.floating-btn-phone { background:var(--green); }
.floating-btn-instagram { background:linear-gradient(45deg,#f09433,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888); }
.floating-btn-facebook { background:#1877f2; }
.floating-btn-tooltip { position:absolute; left:64px; background:var(--bg-2); border:1px solid var(--border); padding:6px 14px; border-radius:8px; font-size:12px; font-weight:500; white-space:nowrap; opacity:0; pointer-events:none; transform:translateX(-8px); transition:all .3s; }
.floating-btn:hover .floating-btn-tooltip { opacity:1; transform:translateX(0); }
.back-to-top { position:fixed; bottom:32px; right:32px; width:48px; height:48px; background:var(--green-accent); color:#000; border:none; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:0; visibility:hidden; transform:translateY(20px); transition:all .4s; z-index:90; box-shadow:0 4px 20px var(--green-glow); }
.back-to-top.visible { opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top:hover { transform:translateY(-4px); }

/* ---- MOUSE GLOW ---- */
.mouse-glow { position:fixed; width:400px; height:400px; border-radius:50%; background:radial-gradient(circle,rgba(102,187,106,0.06),transparent 70%); pointer-events:none; z-index:0; transform:translate(-50%,-50%); opacity:0; transition:opacity .5s; }
.mouse-glow.visible { opacity:1; }

/* ---- BLUR REVEAL ---- */
.blur-reveal { filter:blur(8px); opacity:0; transform:translateY(20px); transition:filter .8s,opacity .8s,transform .8s; }
.blur-reveal.revealed { filter:blur(0); opacity:1; transform:translateY(0); }

/* ---- LIGHTBOX ---- */
.lightbox { position:fixed; inset:0; background:rgba(0,0,0,0.92); z-index:10000; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .4s; backdrop-filter:blur(8px); }
.lightbox.active { opacity:1; pointer-events:all; }
.lightbox img { max-width:90%; max-height:85vh; border-radius:var(--radius); object-fit:contain; }
.lightbox-close { position:absolute; top:24px; right:24px; width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,0.1); border:none; color:#fff; font-size:24px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.lightbox-nav { position:absolute; top:50%; width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,0.1); border:none; color:#fff; font-size:20px; cursor:pointer; display:flex; align-items:center; justify-content:center; transform:translateY(-50%); }
.lightbox-prev { left:24px; }
.lightbox-next { right:24px; }
.lightbox-counter { position:absolute; bottom:24px; left:50%; transform:translateX(-50%); color:rgba(255,255,255,0.5); font-size:13px; }

/* ---- COOKIE ---- */
.cookie-banner { position:fixed; bottom:24px; left:24px; max-width:440px; background:var(--bg-2); border:1px solid var(--border); border-radius:var(--radius-lg); padding:24px; box-shadow:0 20px 60px rgba(0,0,0,0.4); z-index:9999; transform:translateY(150%); transition:transform .5s cubic-bezier(.16,1,.3,1); }
.cookie-banner.visible { transform:translateY(0); }
.cookie-text { font-size:13px; color:var(--text-muted); line-height:1.6; margin-bottom:16px; }
.cookie-text a { color:var(--green-accent); }
.cookie-actions { display:flex; gap:8px; }
.cookie-btn { padding:10px 22px; border-radius:100px; font-family:var(--font); font-size:13px; font-weight:600; cursor:pointer; transition:all .3s; border:none; }
.cookie-accept { background:var(--green); color:#fff; }
.cookie-accept:hover { background:var(--green-light); }
.cookie-decline { background:var(--bg-3); color:var(--text-muted); border:1px solid var(--border); }

/* ---- RESPONSIVE ---- */
@media(max-width:1024px){
    .services-grid{grid-template-columns:1fr;max-width:540px;margin:0 auto;}
    .about-grid{grid-template-columns:1fr;gap:48px;}
    .stats-grid{grid-template-columns:repeat(2,1fr);}
    .contact-grid{grid-template-columns:1fr;}
    .projects-grid{grid-template-columns:repeat(2,1fr);}
    .footer-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:768px){
    .nav-links,.nav-cta{display:none;}
    .nav-burger{display:flex;}
    .section{padding:80px 0;}
    .hero{min-height:600px;}
    .projects-grid{grid-template-columns:1fr;}
    .about-features{grid-template-columns:1fr;}
    .stats-grid{grid-template-columns:1fr 1fr;gap:24px;}
    .cta-form-row{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr;gap:32px;}
    .footer-bottom{flex-direction:column;text-align:center;}
    .cta-box{padding:40px 24px;}
    .intro-menu{padding:0 16px 24px;}
}
@media(max-width:480px){
    .hero-actions{flex-direction:column;} .hero-actions .btn{width:100%;justify-content:center;}
    .testimonial-card{flex:0 0 calc(100vw - 64px);}
    .stats-grid{grid-template-columns:1fr;}
}
