:root,
[data-theme="dark"] {
    --color-bg: #0A1628;
    --color-surface: #0f1e38;
    --color-surface-2: #132240;
    --color-surface-offset: #1a2d52;
    --color-divider: #1f2e48;
    --color-border: #243356;
    --color-text: #e8edf5;
    --color-text-muted: #8fa3c4;
    --color-text-faint: #4d6289;
    --color-primary: #C8843A;
    --color-primary-hover: #d9944a;
    --color-primary-highlight: rgba(200,132,58,0.12);
    --color-cyan: #00C8FF;
    --color-cyan-dim: rgba(0,200,255,0.15);
    --color-purple: #7B4FD4;
    --color-pink: #A066C8;
    --shadow-lg: 0 12px 40px rgba(0,0,0,0.5);
    --shadow-glow: 0 0 40px rgba(0,200,255,0.12);
    --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
    --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
    --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
    --text-lg: clamp(1.125rem, 1rem + 0.75vw, 1.5rem);
    --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
    --text-2xl: clamp(2rem, 1.2rem + 2.5vw, 3.5rem);
    --text-3xl: clamp(2.5rem, 1rem + 4vw, 5rem);
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;
    --radius-sm: 0.375rem;
    --radius-md: 0.5rem;
    --radius-lg: 0.75rem;
    --radius-xl: 1rem;
    --radius-2xl: 1.5rem;
    --radius-full: 9999px;
    --font-display: 'Cabinet Grotesk', 'Helvetica Neue', sans-serif;
    --font-body: 'Satoshi', 'Inter', sans-serif;
    --transition: 180ms cubic-bezier(0.16,1,0.3,1);
    --content-wide: 1200px;
}

[data-theme="light"] {
    --color-bg: #f0f4fa;
    --color-surface: #f7f9fd;
    --color-surface-2: #ffffff;
    --color-surface-offset: #e8eef7;
    --color-divider: #d0d8ea;
    --color-border: #c4cedf;
    --color-text: #0f1d35;
    --color-text-muted: #4a5e7a;
    --color-text-faint: #8fa3bf;
    --color-cyan: #0099cc;
    --color-cyan-dim: rgba(0,153,204,0.12);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:80px;}
body{min-height:100dvh;line-height:1.6;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg);text-align:center;overflow-x:hidden;}
img,svg{display:block;max-width:100%;height:auto;margin-inline:auto;}
ul[role="list"],ol[role="list"]{list-style:none;}
input,button,textarea,select{font:inherit;color:inherit;}
h1,h2,h3,h4{line-height:1.15;font-family:var(--font-display);text-wrap:balance;}
p,li{text-wrap:pretty;max-width:72ch;margin-inline:auto;}
button{cursor:pointer;background:none;border:none;}
a{color:inherit;text-decoration:none;transition:color var(--transition);}
::selection{background:rgba(200,132,58,0.25);color:var(--color-text);}
:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm);}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;transition-duration:0.01ms!important;scroll-behavior:auto!important;}}

.container{max-width:var(--content-wide);margin-inline:auto;padding-inline:clamp(var(--space-4),4vw,var(--space-6));text-align:left;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}

.nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:var(--space-4) 0;transition:background var(--transition),box-shadow var(--transition);isolation:isolate;}
.nav.scrolled{background:var(--color-bg);box-shadow:0 1px 0 var(--color-divider);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;max-width:var(--content-wide);margin-inline:auto;padding-inline:clamp(var(--space-4),4vw,var(--space-6));gap:var(--space-4);}
.nav-logo{display:flex;align-items:center;gap:var(--space-3);min-width:0;}
.nav-logo img{width:36px;height:36px;object-fit:contain;border-radius:var(--radius-md);flex-shrink:0;}
.nav-logo-text{font-family:var(--font-display);font-weight:800;font-size:var(--text-lg);color:var(--color-text);white-space:nowrap;}
.nav-logo-text span{color:var(--color-primary);}
.nav-links{display:flex;align-items:center;gap:var(--space-6);flex-wrap:wrap;justify-content:center;}
.nav-links a{font-size:var(--text-sm);font-weight:500;color:var(--color-text-muted);white-space:nowrap;}
.nav-links a:hover{color:var(--color-text);}
.nav-cta{display:flex;align-items:center;gap:var(--space-3);flex-shrink:0;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;font-family:var(--font-body);transition:all var(--transition);}
.btn-primary{background:var(--color-primary);color:#fff;}
.btn-primary:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 4px 16px rgba(200,132,58,0.3);}
.btn-ghost{color:var(--color-text-muted);border:1px solid var(--color-border);}
.btn-ghost:hover{color:var(--color-text);border-color:var(--color-text-muted);}
.nav-mobile-toggle{display:none;width:40px;height:40px;align-items:center;justify-content:center;color:var(--color-text);}
.mobile-menu{display:none;position:fixed;inset:0;z-index:99;background:var(--color-bg);padding:var(--space-20) var(--space-6) var(--space-6);flex-direction:column;gap:var(--space-4);overflow:auto;}
.mobile-menu.open{display:flex;}
.mobile-menu-header{display:flex;align-items:center;gap:var(--space-3);padding-bottom:var(--space-6);border-bottom:1px solid var(--color-divider);margin-bottom:var(--space-2);}
.mobile-menu-header img{width:40px;height:40px;object-fit:contain;border-radius:var(--radius-md);}
.mobile-menu-brand{font-family:var(--font-display);font-weight:800;font-size:var(--text-lg);color:var(--color-text);}
.mobile-menu-brand span{color:var(--color-primary);}
.mobile-menu a{font-size:var(--text-xl);font-family:var(--font-display);font-weight:700;color:var(--color-text);padding:var(--space-3) 0;border-bottom:1px solid var(--color-divider);}
.mobile-menu a:hover{color:var(--color-primary);}

.hero-intro{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding-block:clamp(var(--space-16),10vw,var(--space-24));padding-top:calc(clamp(var(--space-16),10vw,var(--space-24)) + 80px);}
.hero-bg{position:absolute;inset:0;z-index:0;}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(var(--color-divider) 1px,transparent 1px),linear-gradient(90deg,var(--color-divider) 1px,transparent 1px);background-size:60px 60px;opacity:.3;}
.hero-glow{position:absolute;top:-20%;right:-10%;width:70%;height:80%;background:radial-gradient(ellipse,rgba(0,200,255,0.08) 0%,transparent 70%);pointer-events:none;}
.hero-glow-2{position:absolute;bottom:-20%;left:-10%;width:60%;height:70%;background:radial-gradient(ellipse,rgba(200,132,58,0.06) 0%,transparent 70%);pointer-events:none;}
.hero-intro-content{position:relative;z-index:1;text-align:center;max-width:900px;margin-inline:auto;}
.hero-intro-title{font-family:var(--font-display);font-size:clamp(2.25rem,1.2rem + 4vw,5rem);font-weight:900;line-height:1.05;color:var(--color-text);margin-bottom:var(--space-8);text-wrap:balance;}
.hero-intro-title .accent{color:var(--color-primary);}
.hero-intro-title .glow{color:var(--color-cyan);text-shadow:0 0 30px rgba(0,200,255,0.4);}
.hero-intro-desc{font-size:var(--text-lg);color:var(--color-text-muted);max-width:70ch;margin:0 auto var(--space-10);line-height:1.7;text-align:center;}
.hero-intro-actions{display:flex;gap:var(--space-4);flex-wrap:wrap;justify-content:center;margin-bottom:var(--space-10);}
.hero-intro-actions .btn{min-width:200px;}
.hero-intro-social{display:flex;gap:var(--space-4);align-items:center;flex-wrap:wrap;justify-content:center;}
.hero-intro-social .hero-social-label{font-size:var(--text-xs);color:var(--color-text-faint);text-transform:uppercase;letter-spacing:.1em;}
.hero-intro-social a{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--color-text-muted);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);border:1px solid var(--color-border);transition:all var(--transition);}
.hero-intro-social a:hover{color:var(--color-text);border-color:var(--color-text-muted);}

.section{padding-block:clamp(var(--space-12),8vw,var(--space-24));}
.section-tag{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--color-primary);margin-bottom:var(--space-4);}
.section-tag::before{content:'';width:20px;height:2px;background:var(--color-primary);}
.section-title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:900;color:var(--color-text);margin-bottom:var(--space-4);text-align:center;margin-inline:auto;}
.section-desc{font-size:var(--text-base);color:var(--color-text-muted);max-width:52ch;margin-bottom:var(--space-12);line-height:1.7;text-align:center;margin-inline:auto;}

.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: clamp(var(--space-4), 2vw, var(--space-5));
    width: 100%;
    justify-items: center;
    align-items: stretch;
}

.services-grid > :only-child {
    grid-column: 1 / -1;
    justify-self: center;
}

.services-grid > .service-card:only-child {
    max-width: 400px;
}

.service-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: clamp(var(--space-5), 3vw, var(--space-6));
    transition: all var(--transition);
    position: relative;
    overflow: hidden;
    width: 100%;
    max-width: 400px;
    align-self: stretch;
    margin-inline: auto;
}

.service-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--card-accent, var(--color-primary));
    opacity: 0;
    transition: opacity var(--transition);
}

.service-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    border-color: var(--card-accent, var(--color-primary));
}

.service-card:hover::before {
    opacity: 1;
}

.service-icon {
    width: 48px;
    height: 48px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--space-5);
    font-size: 1.5rem;
    background: var(--card-bg, var(--color-primary-highlight));
}

.service-title {
    font-family: var(--font-display);
    font-size: var(--text-lg);
    font-weight: 800;
    color: var(--color-text);
    margin-bottom: var(--space-3);
    text-align: center;
}

.service-desc {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: 1.6;
    text-align: center;
}

.service-tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: var(--space-4);
    justify-content: center;
}

.tag {
    font-size: var(--text-xs);
    padding: 2px 10px;
    border-radius: var(--radius-full);
    background: var(--color-surface-offset);
    color: var(--color-text-muted);
    border: 1px solid var(--color-divider);
}

.formation-teaser {
    background: linear-gradient(135deg, rgba(123,79,212,0.1) 0%, rgba(160,102,200,0.05) 100%);
    border: 1px solid rgba(123,79,212,0.3);
    border-radius: var(--radius-2xl);
    padding: var(--space-8);
    margin-top: var(--space-12);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    align-items: center;
    text-align: center;
}

.formation-teaser h3 {
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: 800;
    color: var(--color-text);
}

.formation-teaser p {
    color: var(--color-text-muted);
    max-width: 60ch;
}

.formation-btn {
    background: var(--color-purple);
    color: white;
    padding: var(--space-3) var(--space-6);
    border-radius: var(--radius-full);
    font-weight: 700;
    margin-top: var(--space-2);
    transition: all var(--transition);
}

.formation-btn:hover {
    background: #9065e0;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(123,79,212,0.4);
}

.why-section {
    background: var(--color-surface);
    border-top: 1px solid var(--color-divider);
    border-bottom: 1px solid var(--color-divider);
}

.why-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(var(--space-8), 6vw, var(--space-16));
    align-items: center;
    width: 100%;
    justify-items: center;
}

.why-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.why-item {
    display: flex;
    gap: var(--space-4);
    align-items: flex-start;
}

.why-icon {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md);
    background: var(--color-primary-highlight);
    border: 1px solid rgba(200,132,58,0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.1rem;
}

.why-text strong {
    display: block;
    font-weight: 700;
    font-size: var(--text-base);
    color: var(--color-text);
    margin-bottom: var(--space-1);
}

.why-text p {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: 1.6;
    max-width: 100%;
}

.why-visual {
    background: var(--color-surface-2);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    padding: var(--space-8);
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
    width: 100%;
    margin-inline: auto;
}

.zone-title {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: var(--text-lg);
    color: var(--color-text);
    margin-bottom: var(--space-1);
}

.zone-sub {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin-bottom: var(--space-5);
}

.zone-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    justify-content: center;
}

.zone-item {
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: 600;
    border: 1px solid var(--color-border);
    background: var(--color-surface-offset);
    color: var(--color-text-muted);
}

.zone-item.primary {
    background: var(--color-primary-highlight);
    border-color: rgba(200,132,58,0.3);
    color: var(--color-primary);
}

.pricing-preview {
    padding: var(--space-5);
    background: var(--color-surface);
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border);
}

.pricing-title {
    font-size: var(--text-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--color-text-faint);
    margin-bottom: var(--space-4);
}

.pricing-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--color-divider);
    font-size: var(--text-sm);
}

.pricing-row:last-child {
    border-bottom: none;
}

.pricing-row .label {
    color: var(--color-text-muted);
}

.pricing-row .price {
    font-family: var(--font-display);
    font-weight: 800;
    color: var(--color-text);
}

.pricing-note {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    margin-top: var(--space-3);
    text-align: center;
}

.process-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
    gap: var(--space-5);
    width: 100%;
    justify-items: center;
}

.process-step {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    align-self: stretch;
    margin-inline: auto;
    width: 100%;
    max-width: 300px;
}

.step-num {
    font-family: var(--font-display);
    font-size: var(--text-3xl);
    font-weight: 900;
    color: var(--color-primary);
    opacity: .3;
    line-height: 1;
}

.step-title {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: var(--text-lg);
    color: var(--color-text);
}

.step-desc {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: 1.6;
}

.contact-section {
    background: linear-gradient(135deg, var(--color-surface) 0%, var(--color-surface-2) 100%);
    border-top: 1px solid var(--color-divider);
}

.contact-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(var(--space-8), 6vw, var(--space-16));
    align-items: start;
    width: 100%;
    justify-items: center;
}

.contact-methods {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin-top: var(--space-8);
    align-items: center;
}

.contact-card {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    background: var(--color-surface-offset);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    transition: all var(--transition);
    width: 100%;
    max-width: 350px;
    margin-inline: auto;
}

.contact-card:hover {
    border-color: var(--color-primary);
    background: var(--color-primary-highlight);
}

.contact-card-icon {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-lg);
    background: var(--color-primary-highlight);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}

.contact-card-label {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 2px;
}

.contact-card-value {
    font-weight: 700;
    font-size: var(--text-base);
    color: var(--color-text);
}

.form-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-2xl);
    padding: clamp(var(--space-6), 4vw, var(--space-8));
    width: 100%;
    max-width: 560px;
    margin-inline: auto;
}

.form-group {
    margin-bottom: var(--space-5);
}

.form-label {
    display: block;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-text);
    margin-bottom: var(--space-2);
}

.form-input {
    width: 100%;
    padding: var(--space-3) var(--space-4);
    background: var(--color-surface-offset);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    color: var(--color-text);
    font-size: var(--text-sm);
    transition: all var(--transition);
}

.form-input:focus {
    outline: none;
    border-color: var(--color-primary);
    background: var(--color-surface-2);
    box-shadow: 0 0 0 3px var(--color-primary-highlight);
}

.form-input::placeholder {
    color: var(--color-text-faint);
}

select.form-input {
    cursor: pointer;
}

textarea.form-input {
    resize: vertical;
    min-height: 120px;
}

.form-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--space-4);
}

.form-submit {
    width: 100%;
    padding: var(--space-4) var(--space-6);
    background: var(--color-primary);
    color: white;
    border-radius: var(--radius-md);
    font-size: var(--text-base);
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    transition: all var(--transition);
    border: none;
    margin-top: var(--space-2);
}

.form-submit:hover {
    background: var(--color-primary-hover);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(200,132,58,0.35);
}

.form-submit:active {
    transform: translateY(0);
}

.form-submit:disabled {
    opacity: .7;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.success-msg, .error-msg {
    display: none;
    padding: var(--space-4);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    text-align: center;
    margin-top: var(--space-4);
}

.success-msg {
    background: rgba(74,222,128,0.1);
    border: 1px solid rgba(74,222,128,0.3);
    color: #4ade80;
}

.error-msg {
    background: rgba(239,68,68,0.1);
    border: 1px solid rgba(239,68,68,0.3);
    color: #fca5a5;
}

.footer {
    padding-block: var(--space-10);
    border-top: 1px solid var(--color-divider);
    background: var(--color-bg);
}

.footer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--space-8);
    margin-bottom: var(--space-8);
}

.footer-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.footer-col h4 {
    color: var(--color-text);
    font-family: var(--font-display);
    font-weight: 800;
    font-size: var(--text-lg);
    margin-bottom: var(--space-4);
}

.footer-col p {
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    line-height: 1.6;
    margin-bottom: var(--space-2);
}

.footer-col ul {
    list-style: none;
}

.footer-col ul li {
    margin-bottom: var(--space-2);
}

.footer-col a {
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    transition: color var(--transition);
}

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

.footer-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
    width: 100%;
}

.footer-brand img {
    width: 32px;
    height: 32px;
    object-fit: contain;
    border-radius: var(--radius-sm);
    flex-shrink: 0;
}

.footer-brand-text {
    display: block;
    width: 100%;
    text-align: center;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: var(--text-lg);
    color: var(--color-text);
    line-height: 1;
    white-space: nowrap;
}

.footer-brand-text span {
    color: var(--color-primary);
}

.footer-info p {
    text-align: center;
}

.copyright {
    text-align: center;
    padding-top: var(--space-8);
    border-top: 1px solid var(--color-divider);
    color: var(--color-text-faint);
    font-size: var(--text-xs);
}

.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .6s ease, transform .6s ease;
}

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

.services-grid, .why-grid, .process-grid, .contact-grid {
    justify-items: center;
    width: 100%;
    margin-inline: auto;
}

.service-card, .process-step, .contact-card, .why-visual, .form-card, .info-box {
    margin-inline: auto;
    width: 100%;
}

.service-card ul {
    padding-left: 1.25rem;
    text-align: left;
    margin-inline: 0;
}

.service-card .price-tag,
.service-card .price-detail,
.service-card .service-subtitle,
.service-card .service-title {
    text-align: center;
}

.section > .container,
.section .container {
    display: block;
}

.section > .container > .reveal,
.section > .container > .info-box,
.section > .container > .services-grid,
.section > .container > .why-grid,
.section > .container > .process-grid,
.section > .container > .contact-grid {
    width: 100%;
    margin-inline: auto;
}

.why-grid > *,
.contact-grid > *,
.process-grid > * {
    margin-inline: auto;
}

.service-card .service-desc,
.service-card .btn {
    text-align: center;
}

@supports (-webkit-touch-callout: none) {
    .hero-intro { min-height: -webkit-fill-available; }
}

@media (max-width: 1024px) {
    .nav-links { gap: var(--space-4); }
    .why-grid, .contact-grid { grid-template-columns: 1fr; }
    .why-visual, .form-card { max-width: 720px; }
}

@media (max-width: 768px) {
    .hero-intro {
        padding-top: calc(var(--space-20) + 72px);
        padding-bottom: var(--space-16);
        min-height: auto;
    }
    .hero-intro-title { font-size: clamp(2rem, 8vw, 3.5rem); }
    .hero-intro-desc { font-size: var(--text-base); }
    .hero-intro-actions {
        flex-direction: column;
        gap: var(--space-3);
        width: 100%;
    }
    .hero-intro-actions .btn {
        width: 100%;
        max-width: 320px;
    }
    .nav-links, .nav-cta .btn-ghost { display: none; }
    .nav-mobile-toggle { display: flex; }
    .theme-toggle { display: none; }
    .nav-inner { position: relative; }
    .nav-logo { order: 1; z-index: 10; position: relative; }
    .nav-cta { order: 2; z-index: 100; position: relative; margin-right: 5px; }
    .nav-mobile-toggle { order: 3; z-index: 999!important; position: relative!important; background: transparent; padding: 5px; }
    .services-grid { grid-template-columns: 1fr; }
    .service-card { max-width: 100%; }
    .form-row { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
    .container { padding-inline: var(--space-4); }
    .nav-logo-text, .mobile-menu-brand, .footer-brand-text { font-size: var(--text-base); }
    .mobile-menu { padding-top: calc(var(--space-16) + 72px); padding-inline: var(--space-4); }
    .mobile-menu a { font-size: clamp(1.5rem, 8vw, 2rem); }
    .hero-intro-social { gap: var(--space-2); }
    .hero-intro-social a { width: 100%; justify-content: center; }
    .section-title { font-size: clamp(1.75rem, 8vw, 2.5rem); }
    .section-desc { margin-bottom: var(--space-10); }
    .service-card, .why-visual, .form-card, .pricing-preview { border-radius: var(--radius-xl); }
    .contact-card { max-width: 100%; }
}