:root {
 --deep-blue: #003380;
 --sport-green: #00875A;
 --turf-green: #36B37E;
 --accent-teal: #00A3A3;
 --navy: #0A1628;
 --dark: #172B4D;
 --slate: #42526E;
 --muted: #6B778C;
 --light: #F4F5F7;
 --white: #FFFFFF;
 --light-green: #79F2C0;
 --green-10: rgba(0, 135, 90, 0.08);
 --green-20: rgba(0, 135, 90, 0.15);
 }

 * { margin: 0; padding: 0; box-sizing: border-box; }
 html { scroll-behavior: smooth; }

 body {
 font-family: 'Plus Jakarta Sans', sans-serif;
 color: var(--dark);
 background: var(--white);
 overflow-x: hidden;
 }

 /* === NAVIGATION === */
 nav {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 z-index: 1000;
 background: rgba(255,255,255,0.92);
 backdrop-filter: blur(20px);
 -webkit-backdrop-filter: blur(20px);
 border-bottom: 1px solid rgba(0,0,0,0.04);
 transition: all 0.3s ease;
 }

 nav.scrolled {
 box-shadow: 0 2px 20px rgba(0,0,0,0.06);
 }

 .nav-inner {
 max-width: 1280px;
 margin: 0 auto;
 padding: 0 40px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 height: 72px;
 }

 .nav-logo {
 display: flex;
 align-items: center;
 text-decoration: none;
 }

 .nav-logo img { width: auto; height: 38px; flex-shrink: 0; }

 .nav-links {
 display: flex;
 align-items: center;
 gap: 8px;
 list-style: none;
 }

 .nav-links li {
 position: relative;
 }

 .nav-dropdown {
 padding-bottom: 10px;
 margin-bottom: -10px;
 }

 .nav-links a {
 text-decoration: none;
 color: var(--slate);
 font-size: 0.875rem;
 font-weight: 500;
 padding: 8px 16px;
 border-radius: 8px;
 transition: all 0.2s;
 }

 .nav-links a:hover {
 color: var(--deep-blue);
 background: var(--green-10);
 }

 .nav-links .cta-btn {
 background: var(--sport-green);
 color: white;
 padding: 10px 24px;
 border-radius: 10px;
 font-weight: 600;
 margin-left: 8px;
 }

 .nav-links .cta-btn:hover {
 background: var(--deep-blue);
 color: white;
 }

 .nav-dropdown > .nav-dropdown-toggle {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 }

 .nav-dropdown > .nav-dropdown-toggle::after {
 content: '▾';
 font-size: 0.72rem;
 color: var(--muted);
 transition: transform 0.2s ease;
 }

 .nav-dropdown:hover > .nav-dropdown-toggle::after,
 .nav-dropdown:focus-within > .nav-dropdown-toggle::after {
 transform: rotate(180deg);
 }

 .nav-dropdown-menu {
 position: absolute;
 top: 100%;
 left: 0;
 min-width: 230px;
 padding: 10px;
 border-radius: 12px;
 border: 1px solid rgba(0, 51, 128, 0.08);
 background: rgba(255, 255, 255, 0.98);
 box-shadow: 0 18px 34px rgba(10, 22, 40, 0.12);
 display: grid;
 gap: 2px;
 opacity: 0;
 visibility: hidden;
 transform: translateY(6px);
 transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
 pointer-events: none;
 z-index: 1200;
 }

 .nav-dropdown-menu a {
 padding: 9px 10px;
 border-radius: 8px;
 font-size: 0.82rem;
 font-weight: 600;
 line-height: 1.35;
 }

 .nav-dropdown:hover .nav-dropdown-menu,
 .nav-dropdown:focus-within .nav-dropdown-menu {
 opacity: 1;
 visibility: visible;
 transform: translateY(0);
 pointer-events: auto;
 }

 .mobile-toggle {
 display: none;
 background: none;
 border: none;
 cursor: pointer;
 padding: 8px;
 }

 .mobile-toggle span {
 display: block;
 width: 22px;
 height: 2px;
 background: var(--dark);
 margin: 5px 0;
 transition: 0.3s;
 }

 /* === HERO === */
 .hero {
 min-height: 100vh;
 display: flex;
 align-items: center;
 position: relative;
 overflow: hidden;
 background: var(--navy);
 }

 .hero-bg {
 position: absolute;
 inset: 0;
 overflow: hidden;
 }

 .hero-bg::before {
 content: '';
 position: absolute;
 top: -50%;
 right: -20%;
 width: 900px;
 height: 900px;
 border-radius: 50%;
 background: radial-gradient(circle, rgba(0,135,90,0.15) 0%, transparent 70%);
 animation: heroGlow 8s ease-in-out infinite alternate;
 }

 .hero-bg::after {
 content: '';
 position: absolute;
 bottom: -30%;
 left: -10%;
 width: 600px;
 height: 600px;
 border-radius: 50%;
 background: radial-gradient(circle, rgba(0,83,204,0.1) 0%, transparent 70%);
 animation: heroGlow 10s ease-in-out infinite alternate-reverse;
 }

 @keyframes heroGlow {
 0% { transform: translate(0, 0) scale(1); }
 100% { transform: translate(30px, -20px) scale(1.1); }
 }

 /* Court line pattern */
 .court-pattern {
 position: absolute;
 inset: 0;
 opacity: 0.04;
 }

 .court-pattern svg { width: 100%; height: 100%; }

 .hero-content {
 position: relative;
 z-index: 2;
 max-width: 1280px;
 margin: 0 auto;
 padding: 140px 40px 80px;
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 60px;
 align-items: center;
 }

 .hero-text h1 {
 font-family: 'Archivo', sans-serif;
 font-size: clamp(2.5rem, 5vw, 4rem);
 font-weight: 900;
 color: var(--white);
 line-height: 1.08;
 letter-spacing: -1px;
 margin-bottom: 24px;
 }

 .hero-text h1 em {
 font-style: normal;
 color: var(--turf-green);
 }

 .hero-text p {
 font-size: 1.1rem;
 color: rgba(255,255,255,0.6);
 line-height: 1.7;
 max-width: 480px;
 margin-bottom: 40px;
 }

 .hero-actions {
 display: flex;
 gap: 16px;
 flex-wrap: wrap;
 }

 .btn-primary {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 16px 32px;
 background: var(--sport-green);
 color: white;
 border: none;
 border-radius: 12px;
 font-family: 'Archivo', sans-serif;
 font-size: 0.95rem;
 font-weight: 700;
 text-decoration: none;
 cursor: pointer;
 transition: all 0.3s ease;
 }

 .btn-primary:hover {
 background: var(--turf-green);
 transform: translateY(-2px);
 box-shadow: 0 8px 24px rgba(0,135,90,0.3);
 }

 .btn-outline {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 16px 32px;
 background: transparent;
 color: rgba(255,255,255,0.8);
 border: 1.5px solid rgba(255,255,255,0.2);
 border-radius: 12px;
 font-family: 'Archivo', sans-serif;
 font-size: 0.95rem;
 font-weight: 600;
 text-decoration: none;
 cursor: pointer;
 transition: all 0.3s ease;
 }

 .btn-outline:hover {
 border-color: var(--turf-green);
 color: var(--turf-green);
 }

 /* Hero visual - large D logo */
 .hero-visual {
 display: flex;
 align-items: center;
 justify-content: center;
 }

 .hero-visual svg {
 width: 100%;
 max-width: 420px;
 opacity: 0.9;
 filter: drop-shadow(0 20px 60px rgba(0,135,90,0.2));
 animation: floatLogo 6s ease-in-out infinite;
 }

 @keyframes floatLogo {
 0%, 100% { transform: translateY(0); }
 50% { transform: translateY(-12px); }
 }

 /* === STATS === */
 .stats-bar {
 background: var(--white);
 border-bottom: 1px solid rgba(0,0,0,0.05);
 }

 .stats-inner {
 max-width: 1280px;
 margin: 0 auto;
 padding: 48px 40px;
 display: grid;
 grid-template-columns: repeat(4, 1fr);
 gap: 32px;
 }

 .stat-item {
 text-align: center;
 }

 .stat-item .number {
 font-family: 'Archivo', sans-serif;
 font-size: 2.5rem;
 font-weight: 900;
 color: var(--deep-blue);
 line-height: 1;
 }

 .stat-item .number span { color: var(--sport-green); }

 .stat-item .label {
 font-size: 0.85rem;
 color: var(--muted);
 margin-top: 6px;
 }

 /* === SECTION === */
 .section {
 padding: 100px 40px;
 max-width: 1280px;
 margin: 0 auto;
 }

 .section-full {
 padding: 100px 0;
 }

 .section-tag {
 font-family: 'Archivo', sans-serif;
 font-size: 0.7rem;
 font-weight: 700;
 text-transform: uppercase;
 letter-spacing: 3px;
 color: var(--sport-green);
 margin-bottom: 16px;
 }

 .section-title {
 font-family: 'Archivo', sans-serif;
 font-size: clamp(1.8rem, 3vw, 2.8rem);
 font-weight: 800;
 color: var(--navy);
 line-height: 1.15;
 margin-bottom: 16px;
 }

 .section-sub {
 font-size: 1.05rem;
 color: var(--slate);
 max-width: 560px;
 line-height: 1.7;
 }

 .section-header {
 text-align: center;
 margin-bottom: 64px;
 }

 .section-header .section-sub {
 margin: 0 auto;
 }

 /* === SERVICES === */
 .services-section {
 background: var(--light);
 }

 .services-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 28px;
 max-width: 1280px;
 margin: 0 auto;
 padding: 0 40px;
 }

 .service-card {
 background: var(--white);
 border-radius: 20px;
 padding: 44px 36px;
 border: 1px solid rgba(0,0,0,0.04);
 text-align: center;
 transition: all 0.35s ease;
 position: relative;
 overflow: hidden;
 }

 .service-card::before {
 content: '';
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 height: 3px;
 background: linear-gradient(90deg, var(--sport-green), var(--accent-teal));
 transform: scaleX(0);
 transform-origin: left;
 transition: transform 0.4s ease;
 }

 .service-card:hover::before {
 transform: scaleX(1);
 }

 .service-card:hover {
 transform: translateY(-4px);
 box-shadow: 0 16px 48px rgba(0,0,0,0.07);
 }

 .service-icon {
 width: 56px;
 height: 56px;
 border-radius: 14px;
 background: var(--green-10);
 display: flex;
 align-items: center;
 justify-content: center;
 margin: 0 auto 24px;
 }

 .service-icon svg {
 width: 28px;
 height: 28px;
 color: var(--sport-green);
 }

 .service-card h3 {
 font-family: 'Archivo', sans-serif;
 font-size: 1.15rem;
 font-weight: 700;
 color: var(--navy);
 margin-bottom: 10px;
 }

 .service-card p {
 font-size: 0.9rem;
 color: var(--slate);
 line-height: 1.65;
 max-width: 320px;
 margin: 0 auto;
 }

 /* === SPORTS === */
 .sports-tabs {
 display: flex;
 justify-content: center;
 gap: 8px;
 margin-bottom: 48px;
 flex-wrap: wrap;
 }

 .sports-tab {
 padding: 10px 20px;
 border-radius: 100px;
 border: 1.5px solid rgba(0,0,0,0.08);
 background: var(--white);
 font-size: 0.85rem;
 font-weight: 600;
 color: var(--slate);
 cursor: pointer;
 transition: all 0.25s;
 }

 .sports-tab:hover, .sports-tab.active {
 background: var(--sport-green);
 color: var(--white);
 border-color: var(--sport-green);
 }

 .sports-tool-link {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 padding: 11px 20px;
 border-radius: 999px;
 background: var(--deep-blue);
 color: var(--white);
 font-size: 0.85rem;
 font-weight: 700;
 text-decoration: none;
 margin-bottom: 20px;
 transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
 }

 .sports-tool-link:hover {
 background: var(--sport-green);
 transform: translateY(-1px);
 box-shadow: 0 10px 24px rgba(0, 135, 90, 0.22);
 }

 .sports-grid {
 display: grid;
 grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
 gap: 20px;
 }

 .sport-card {
 background: var(--light);
 border-radius: 16px;
 padding: 32px 28px;
 text-align: center;
 transition: all 0.3s ease;
 border: 1px solid transparent;
 cursor: pointer;
 text-decoration: none;
 color: inherit;
 display: block;
 }

 .sport-card:hover {
 background: var(--white);
 border-color: var(--sport-green);
 box-shadow: 0 8px 32px rgba(0,135,90,0.08);
 transform: translateY(-2px);
 }

 .sport-emoji {
 width: 48px;
 height: 48px;
 margin: 0 auto 14px;
 display: flex;
 align-items: center;
 justify-content: center;
 background: var(--green-10);
 border-radius: 12px;
 }

 .sport-emoji svg {
 width: 26px;
 height: 26px;
 }

 .sport-card h4 {
 font-family: 'Archivo', sans-serif;
 font-size: 0.95rem;
 font-weight: 700;
 color: var(--navy);
 margin-bottom: 6px;
 }

 .sport-card p {
 font-size: 0.8rem;
 color: var(--muted);
 }

 /* === PROCESS === */
 .process-section {
 background: var(--navy);
 color: var(--white);
 }

 .process-section .section-tag { color: var(--light-green); }
 .process-section .section-title { color: var(--white); }
 .process-section .section-sub { color: rgba(255,255,255,0.5); }

 .process-grid {
 display: grid;
 grid-template-columns: repeat(4, 1fr);
 gap: 32px;
 max-width: 1280px;
 margin: 0 auto;
 padding: 0 40px;
 }

 .process-step {
 position: relative;
 padding: 36px 28px;
 background: rgba(255,255,255,0.04);
 border: 1px solid rgba(255,255,255,0.06);
 border-radius: 16px;
 transition: all 0.3s;
 }

 .process-step:hover {
 background: rgba(255,255,255,0.07);
 border-color: rgba(0,135,90,0.3);
 }

 .step-num {
 font-family: 'Archivo', sans-serif;
 font-size: 3rem;
 font-weight: 900;
 color: rgba(255,255,255,0.06);
 line-height: 1;
 margin-bottom: 16px;
 }

 .process-step h4 {
 font-family: 'Archivo', sans-serif;
 font-size: 1rem;
 font-weight: 700;
 color: var(--turf-green);
 margin-bottom: 10px;
 }

 .process-step p {
 font-size: 0.85rem;
 color: rgba(255,255,255,0.45);
 line-height: 1.6;
 }

/* === INSTAGRAM FEED (temporary) === */
.ig-feed-wrap {
 max-width: 1120px;
 margin: 0 auto;
}

.ig-feed-grid {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 18px;
}

.ig-card {
 display: block;
 border-radius: 16px;
 overflow: hidden;
 border: 1px solid rgba(0, 51, 128, 0.12);
 background: #fff;
 text-decoration: none;
 transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}

.ig-card:hover {
 transform: translateY(-2px);
 border-color: rgba(0, 135, 90, 0.35);
 box-shadow: 0 10px 30px rgba(10,22,40,0.12);
}

.ig-media {
 width: 100%;
 background: #fff;
 padding: 8px 8px 0;
}

.ig-media .instagram-media {
 margin: 0 auto !important;
 min-width: 0 !important;
 width: 100% !important;
 max-width: 100% !important;
}

.ig-body {
 padding: 14px 14px 16px;
}

.ig-type {
 display: inline-block;
 font-size: 0.72rem;
 font-weight: 800;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: #00875A;
 margin-bottom: 8px;
}

.ig-caption {
 color: #42526E;
 font-size: 0.84rem;
 line-height: 1.5;
 margin: 0;
 display: -webkit-box;
 -webkit-line-clamp: 3;
 -webkit-box-orient: vertical;
 overflow: hidden;
}

.ig-open {
 display: inline-block;
 margin-top: 10px;
 font-size: 0.8rem;
 font-weight: 700;
 color: #003380;
 text-decoration: none;
}

.ig-open:hover { color: #00875A; }

.ig-feed-actions {
 margin-top: 18px;
 display: flex;
 gap: 10px;
 justify-content: center;
 flex-wrap: wrap;
}

.ig-feed-actions a {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 padding: 10px 16px;
 border-radius: 999px;
 font-size: 0.84rem;
 font-weight: 700;
 text-decoration: none;
 border: 1px solid rgba(0, 51, 128, 0.16);
 color: #003380;
 background: #fff;
}

.ig-feed-actions a:hover {
 border-color: #00875A;
 color: #00875A;
}

 /* === SURFACES === */
 .surfaces-section { background: var(--light); text-align: center; }

 .surface-categories {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 gap: 28px;
 }

 .surface-group {
 background: var(--white);
 border-radius: 20px;
 padding: 40px;
 border: 1px solid rgba(0,0,0,0.04);
 text-align: center;
 }

 .surface-group h3 {
 font-family: 'Archivo', sans-serif;
 font-size: 1.15rem;
 font-weight: 700;
 color: var(--navy);
 margin-bottom: 8px;
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 10px;
 }

 .surface-group h3 .dot {
 width: 8px;
 height: 8px;
 border-radius: 50%;
 background: var(--sport-green);
 }

 .surface-group p {
 font-size: 0.88rem;
 color: var(--slate);
 line-height: 1.65;
 margin-bottom: 20px;
 }

 .surface-list {
 display: flex;
 flex-wrap: wrap;
 gap: 8px;
 justify-content: center;
 }

 .surface-chip {
 padding: 6px 14px;
 background: var(--green-10);
 border-radius: 100px;
 font-size: 0.78rem;
 font-weight: 600;
 color: var(--sport-green);
 }

 /* === CLIENTS === */
 .clients-section {
 text-align: center;
 }

 .client-sectors {
 display: flex;
 justify-content: center;
 gap: 32px;
 flex-wrap: wrap;
 margin-bottom: 48px;
 }

 .client-sector {
 font-size: 0.85rem;
 color: var(--muted);
 font-weight: 500;
 padding: 10px 20px;
 background: var(--light);
 border-radius: 100px;
 }

 .testimonial-card {
 max-width: 700px;
 margin: 0 auto;
 background: var(--light);
 border-radius: 20px;
 padding: 48px;
 text-align: left;
 position: relative;
 }

 .testimonial-card::before {
 content: '"';
 font-family: 'Archivo', sans-serif;
 font-size: 6rem;
 color: var(--sport-green);
 opacity: 0.15;
 position: absolute;
 top: 16px;
 left: 32px;
 line-height: 1;
 }

 .testimonial-card blockquote {
 font-size: 1.05rem;
 color: var(--dark);
 line-height: 1.75;
 font-style: italic;
 margin-bottom: 24px;
 position: relative;
 z-index: 1;
 }

 .testimonial-author {
 display: flex;
 align-items: center;
 gap: 14px;
 }

 .testimonial-avatar {
 width: 48px;
 height: 48px;
 border-radius: 50%;
 background: var(--green-20);
 display: flex;
 align-items: center;
 justify-content: center;
 font-family: 'Archivo', sans-serif;
 font-weight: 800;
 color: var(--sport-green);
 font-size: 1rem;
 }

 .testimonial-author .name {
 font-weight: 700;
 font-size: 0.95rem;
 color: var(--navy);
 }

 .testimonial-author .role {
 font-size: 0.8rem;
 color: var(--muted);
 }

 /* === WHY === */
 .why-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 28px;
 }

 .why-card {
 padding: 36px 32px;
 border-radius: 16px;
 border: 1px solid rgba(0,0,0,0.06);
 transition: all 0.3s;
 text-align: center;
 }

 .why-card:hover {
 border-color: var(--sport-green);
 box-shadow: 0 8px 32px rgba(0,135,90,0.06);
 }

 .why-card .icon-ring {
 width: 48px;
 height: 48px;
 border-radius: 50%;
 border: 2px solid var(--sport-green);
 display: flex;
 align-items: center;
 justify-content: center;
 margin: 0 auto 20px;
 }

 .why-card h4 {
 font-family: 'Archivo', sans-serif;
 font-weight: 700;
 font-size: 1rem;
 color: var(--navy);
 margin-bottom: 8px;
 }

 .why-card p {
 font-size: 0.85rem;
 color: var(--slate);
 line-height: 1.6;
 }

 /* === CTA === */
 /* FAQ */
 .faq-section { background: var(--white); }
 .faq-list {
 max-width: 800px; margin: 0 auto;
 display: flex; flex-direction: column; gap: 0;
 }
 .faq-item {
 border-bottom: 1px solid var(--line);
 }
 .faq-question {
 display: flex; align-items: center; justify-content: space-between;
 padding: 22px 0; cursor: pointer;
 font-family: 'Archivo', sans-serif; font-size: 1.05rem; font-weight: 700;
 color: var(--navy); list-style: none;
 transition: color 0.2s;
 }
 .faq-question::-webkit-details-marker { display: none; }
 .faq-question::after {
 content: '+'; font-size: 1.4rem; font-weight: 400;
 color: var(--sport-green); transition: transform 0.3s;
 flex-shrink: 0; margin-left: 16px;
 }
 details[open] .faq-question::after { content: '\2212'; }
 .faq-question:hover { color: var(--sport-green); }
 .faq-answer {
 padding: 0 0 22px; color: var(--muted);
 line-height: 1.75; font-size: 0.95rem; max-width: 720px;
 }

 .cta-section {
 background: linear-gradient(135deg, var(--deep-blue) 0%, var(--navy) 100%);
 position: relative;
 overflow: hidden;
 }

 .cta-section::before {
 content: '';
 position: absolute;
 top: -100px;
 right: -100px;
 width: 400px;
 height: 400px;
 border-radius: 50%;
 background: radial-gradient(circle, rgba(0,135,90,0.15) 0%, transparent 70%);
 }

 .cta-inner {
 max-width: 1280px;
 margin: 0 auto;
 padding: 80px 40px;
 text-align: center;
 position: relative;
 z-index: 1;
 }

 .cta-inner h2 {
 font-family: 'Archivo', sans-serif;
 font-size: clamp(2rem, 3.5vw, 3rem);
 font-weight: 900;
 color: var(--white);
 margin-bottom: 16px;
 }

 .cta-inner p {
 font-size: 1.05rem;
 color: rgba(255,255,255,0.5);
 margin-bottom: 36px;
 max-width: 500px;
 margin-left: auto;
 margin-right: auto;
 }

 .cta-actions {
 display: flex;
 justify-content: center;
 gap: 16px;
 flex-wrap: wrap;
 }

 .btn-white {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 16px 32px;
 background: var(--white);
 color: var(--deep-blue);
 border: none;
 border-radius: 12px;
 font-family: 'Archivo', sans-serif;
 font-size: 0.95rem;
 font-weight: 700;
 text-decoration: none;
 cursor: pointer;
 transition: all 0.3s ease;
 }

 .btn-white:hover {
 background: var(--turf-green);
 color: var(--white);
 transform: translateY(-2px);
 }

 /* === CONTACT === */
 .contact-section { background: var(--light); }

 .contact-grid {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 48px;
 max-width: 1280px;
 margin: 0 auto;
 padding: 0 40px;
 }

 .contact-info h3 {
 font-family: 'Archivo', sans-serif;
 font-size: 1.8rem;
 font-weight: 800;
 color: var(--navy);
 margin-bottom: 16px;
 }

 .contact-info > p {
 color: var(--slate);
 line-height: 1.7;
 margin-bottom: 32px;
 }

 .contact-details {
 display: flex;
 flex-direction: column;
 gap: 20px;
 }

 .contact-item {
 display: flex;
 gap: 14px;
 align-items: flex-start;
 }

 .contact-item .ci-icon {
 width: 40px;
 height: 40px;
 min-width: 40px;
 border-radius: 10px;
 background: var(--green-10);
 display: flex;
 align-items: center;
 justify-content: center;
 }

 .contact-item .ci-icon svg {
 width: 18px;
 height: 18px;
 color: var(--sport-green);
 }

 .contact-item .ci-text .ci-label {
 font-size: 0.75rem;
 font-weight: 600;
 color: var(--muted);
 text-transform: uppercase;
 letter-spacing: 1px;
 margin-bottom: 2px;
 }

 .contact-item .ci-text .ci-value {
 font-size: 0.95rem;
 color: var(--navy);
 font-weight: 500;
 }

 .contact-form {
 background: var(--white);
 border-radius: 20px;
 padding: 40px;
 box-shadow: 0 4px 20px rgba(0,0,0,0.04);
 }

 .form-row {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 16px;
 margin-bottom: 16px;
 }

 .form-group {
 margin-bottom: 16px;
 }

 .form-group label {
 display: block;
 font-size: 0.8rem;
 font-weight: 600;
 color: var(--slate);
 margin-bottom: 6px;
 }

 .form-group input,
 .form-group select,
 .form-group textarea {
 width: 100%;
 padding: 12px 16px;
 border: 1.5px solid rgba(0,0,0,0.08);
 border-radius: 10px;
 font-family: 'Plus Jakarta Sans', sans-serif;
 font-size: 0.9rem;
 color: var(--dark);
 background: var(--light);
 transition: border-color 0.2s;
 outline: none;
 }

 .form-group input:focus,
 .form-group select:focus,
 .form-group textarea:focus {
 border-color: var(--sport-green);
 background: var(--white);
 }

 .form-group textarea { resize: vertical; min-height: 100px; }

 .form-submit {
 width: 100%;
 padding: 14px;
 background: var(--sport-green);
 color: white;
 border: none;
 border-radius: 12px;
 font-family: 'Archivo', sans-serif;
 font-size: 0.95rem;
 font-weight: 700;
 cursor: pointer;
 transition: all 0.3s;
 }

.form-submit:hover {
 background: var(--deep-blue);
 }

.form-founder-call {
 display: block;
 width: 100%;
 margin-top: 10px;
 padding: 12px 14px;
 border: 1.5px solid var(--deep-blue);
 border-radius: 12px;
 text-align: center;
 text-decoration: none;
 font-family: 'Archivo', sans-serif;
 font-size: 0.9rem;
 font-weight: 700;
 color: var(--deep-blue);
 background: var(--white);
 transition: all 0.2s;
}

.form-founder-call:hover {
 background: var(--deep-blue);
 color: var(--white);
}

 /* === FOOTER === */
footer {
 background: var(--navy);
 padding: 64px 40px 32px;
 }

 .footer-inner {
 max-width: 1280px;
 margin: 0 auto;
 }

 .footer-grid {
 display: grid;
 grid-template-columns: 2fr 1fr 1fr 1fr;
 gap: 40px;
 margin-bottom: 48px;
 }

 .footer-brand .f-logo {
 display: flex;
 align-items: center;
 margin-bottom: 16px;
 }

 .footer-brand .f-logo img { width: auto; height: 34px; display: block; }

.footer-brand p {
 font-size: 0.85rem;
 color: rgba(255,255,255,0.35);
 line-height: 1.65;
 max-width: 320px;
}

.footer-social {
 display: flex;
 align-items: center;
 gap: 12px;
 margin-top: 14px;
}

.footer-social a {
 width: 34px;
 height: 34px;
 border-radius: 999px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 flex-shrink: 0;
 color: #fff;
 text-decoration: none;
 border: 1px solid rgba(255,255,255,0.22);
 background: rgba(255,255,255,0.04);
 transition: background 0.2s, border-color 0.2s, transform 0.2s;
}

.footer-social a svg {
 width: 16px !important;
 height: 16px !important;
 max-width: 16px;
 max-height: 16px;
 display: block;
 fill: currentColor;
}

.footer-social a:hover {
 background: #36B37E;
 border-color: #36B37E;
 transform: translateY(-1px);
}

 .footer-col h5 {
 font-family: 'Archivo', sans-serif;
 font-size: 0.75rem;
 font-weight: 700;
 text-transform: uppercase;
 letter-spacing: 2px;
 color: rgba(255,255,255,0.5);
 margin-bottom: 20px;
 }

 .footer-col ul {
 list-style: none;
 display: flex;
 flex-direction: column;
 gap: 10px;
 }

 .footer-col a {
 text-decoration: none;
 font-size: 0.88rem;
 color: rgba(255,255,255,0.4);
 transition: color 0.2s;
 }

 .footer-col a:hover { color: var(--turf-green); }

 .footer-bottom {
 border-top: 1px solid rgba(255,255,255,0.06);
 padding-top: 24px;
 display: flex;
 justify-content: space-between;
 align-items: center;
 }

 .footer-bottom p {
 font-size: 0.8rem;
 color: rgba(255,255,255,0.25);
 }

 /* === SCROLL === */
 .reveal {
 opacity: 1;
 transform: none;
 }

 .js .reveal {
 opacity: 0;
 transform: translateY(30px);
 transition: opacity 0.6s ease, transform 0.6s ease;
 }

 .js .reveal.visible {
 opacity: 1;
 transform: translateY(0);
 }

 /* === RESPONSIVE === */
 @media (max-width: 1024px) {
 .hero-content { grid-template-columns: 1fr; text-align: center; }
 .hero-text p { margin-left: auto; margin-right: auto; }
 .hero-actions { justify-content: center; }
 .hero-visual { display: none; }
 .services-grid { grid-template-columns: 1fr 1fr; }
 .process-grid { grid-template-columns: 1fr 1fr; }
 .ig-feed-grid { grid-template-columns: 1fr 1fr; }
 .why-grid { grid-template-columns: 1fr 1fr; }
 .footer-grid { grid-template-columns: 1fr 1fr; }
 }

 @media (max-width: 768px) {
 .nav-links { display: none; }
 .mobile-toggle { display: block; }
 .nav-inner { padding: 0 20px; }
 .hero-content { padding: 120px 20px 60px; }
 .section { padding: 64px 20px; }
 .section-full { padding: 64px 0; }
 .stats-inner {
 grid-template-columns: 1fr 1fr;
 padding: 32px 20px;
 gap: 24px;
 }
 .services-grid { grid-template-columns: 1fr; padding: 0 20px; }
 .process-grid { grid-template-columns: 1fr; padding: 0 20px; }
 .ig-feed-grid { grid-template-columns: 1fr; gap: 12px; }
 .surface-categories { grid-template-columns: 1fr; }
 .why-grid { grid-template-columns: 1fr; }
 .contact-grid { grid-template-columns: 1fr; padding: 0 20px; }
 .footer-grid { grid-template-columns: 1fr; }
 .form-row { grid-template-columns: 1fr; }
 .cta-inner { padding: 60px 20px; }
 footer { padding: 48px 20px 24px; }
 }

 /* === MOBILE === */
 .mobile-menu {
 display: none;
 position: fixed;
 inset: 0;
 background: var(--white);
 z-index: 2000;
 min-height: 100dvh;
 padding: 100px 32px 32px;
 flex-direction: column;
 gap: 4px;
 overflow-y: auto;
 }

 .mobile-menu.open { display: flex; }

 .mobile-menu a {
 display: block;
 padding: 14px 0;
 font-size: 1.1rem;
 font-weight: 600;
 color: var(--navy);
 text-decoration: none;
 border-bottom: 1px solid rgba(0,0,0,0.05);
 }

 .mobile-close {
 position: absolute;
 top: 24px;
 right: 24px;
 background: none;
 border: none;
 font-size: 1.5rem;
 cursor: pointer;
 color: var(--dark);
 }