:root{
--accent:#ef4444;
--accent-hover:#dc2626;
--text:#111827;
--text-secondary:#6b7280;
--bg:#fff;
--bg-secondary:#f9fafb;
--border:#e5e7eb;
--shadow:0 2px 8px rgba(0,0,0,.04);
--shadow-lg:0 4px 16px rgba(0,0,0,.08);
--radius:8px;
--radius-sm:4px;
--space-xs:clamp(0.5rem,1vw,0.75rem);
--space-sm:clamp(0.75rem,2vw,1rem);
--space-md:clamp(1rem,3vw,1.5rem);
--space-lg:clamp(1.5rem,4vw,2rem);
--space-xl:clamp(2rem,6vw,3rem);
--space-2xl:clamp(3rem,8vw,5rem);
--font-base:clamp(1rem,0.95rem + 0.25vw,1.125rem);
--font-sm:clamp(0.875rem,0.8rem + 0.375vw,1rem);
--font-lg:clamp(1.125rem,1rem + 0.625vw,1.5rem);
--font-xl:clamp(1.25rem,1.1rem + 0.75vw,1.875rem);
--font-2xl:clamp(1.5rem,1.3rem + 1vw,2.25rem);
--font-3xl:clamp(1.875rem,1.5rem + 1.875vw,3rem);
--font-4xl:clamp(2.25rem,1.8rem + 2.25vw,3.75rem);
--container:clamp(320px,90vw,1200px);
}

*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{scroll-behavior:smooth}
body{font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;font-size:var(--font-base);line-height:1.6;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
img,picture,video,canvas,svg{display:block;max-width:100%}
input,button,textarea,select{font:inherit}
p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}
h1,h2,h3,h4,h5,h6{line-height:1.2;font-weight:700}
h1{font-size:var(--font-4xl)}
h2{font-size:var(--font-3xl)}
h3{font-size:var(--font-xl)}
h4{font-size:var(--font-lg)}
a{color:var(--accent);text-decoration:none;transition:color .2s}
a:hover{color:var(--accent-hover)}
a:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}

.skip-link{position:absolute;top:-40px;left:0;background:var(--accent);color:#fff;padding:8px 16px;z-index:9999;text-decoration:none}
.skip-link:focus{top:0}

.container{width:var(--container);max-width:100%;margin-inline:auto;padding-inline:var(--space-md)}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.flow>*+*{margin-top:var(--flow-space,1em)}

.grid{display:grid;gap:var(--space-lg)}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr))}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr))}

.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xl);align-items:center}
@media(max-width:768px){
.two-col{grid-template-columns:1fr}
.two-col-reverse{direction:rtl}
.two-col-reverse>*{direction:ltr}
}

.section{padding:var(--space-2xl) 0}
.section-title{text-align:center;margin-bottom:var(--space-xl)}

.bg-secondary{background:var(--bg-secondary)}
.bg-accent{background:var(--accent);color:#fff}
.text-center{text-align:center}

.btn{display:inline-block;padding:12px 24px;border-radius:var(--radius);font-weight:600;text-decoration:none;border:none;cursor:pointer;transition:all .2s;font-size:var(--font-base);line-height:1}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 4px 12px rgba(239,68,68,.3)}
.btn-secondary{background:transparent;color:var(--accent);border:2px solid var(--accent);padding:10px 22px}
.btn-secondary:hover{background:var(--accent);color:#fff}
.btn-tertiary{background:transparent;color:var(--text);padding:0}
.btn-tertiary:hover{color:var(--accent)}
.btn-white{background:#fff;color:var(--accent)}
.btn-white:hover{background:#f9fafb}
.btn-large{padding:16px 32px;font-size:var(--font-lg)}
.btn-block{display:block;width:100%;text-align:center}

.card{background:var(--bg);border-radius:var(--radius);padding:var(--space-lg);box-shadow:var(--shadow);transition:all .2s;text-align:center}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.card-icon{width:48px;height:48px;margin:0 auto var(--space-md);color:var(--accent)}
.card h3{margin-bottom:var(--space-sm)}
.card p{color:var(--text-secondary);font-size:var(--font-sm)}

.badge{display:inline-block;background:var(--accent);color:#fff;padding:4px 12px;border-radius:var(--radius-sm);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}

.blog-card{background:var(--bg);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:all .2s;text-align:left}
.blog-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.blog-card img{width:100%;height:200px;object-fit:cover}
.blog-card .badge{margin:var(--space-md) 0 var(--space-sm)}
.blog-card h3{margin-bottom:var(--space-sm)}
.blog-card h3 a{color:var(--text);text-decoration:none}
.blog-card h3 a:hover{color:var(--accent)}
.blog-card p{color:var(--text-secondary);font-size:var(--font-sm);margin-bottom:var(--space-md)}
.blog-card>*:not(img){padding-inline:var(--space-md)}
.blog-card>*:last-child{padding-bottom:var(--space-md)}

.link-arrow{color:var(--accent);font-weight:600;display:inline-flex;align-items:center;gap:4px}
.link-arrow::after{content:'→';transition:transform .2s}
.link-arrow:hover::after{transform:translateX(4px)}

.header{background:var(--bg);box-shadow:var(--shadow);position:sticky;top:0;z-index:100;transition:all .2s}
.header.scrolled{box-shadow:var(--shadow-lg)}
.header-container{display:flex;align-items:center;justify-content:space-between;padding-block:var(--space-md)}
.logo img{height:60px;width:auto}
.nav-list{display:flex;gap:var(--space-lg);list-style:none;padding:0;margin:0}
.nav-list a{color:var(--text);font-weight:500;text-decoration:none}
.nav-list a:hover{color:var(--accent)}
.has-dropdown{position:relative}
.nav-dropdown-toggle{background:none;border:none;color:var(--text);font-weight:500;cursor:pointer;padding:0;display:flex;align-items:center;gap:4px}
.nav-dropdown-toggle::after{content:'▾';font-size:12px;transition:transform .2s}
.nav-dropdown-toggle[aria-expanded="true"]::after{transform:rotate(180deg)}
.dropdown-menu{position:absolute;top:100%;left:0;background:var(--bg);border-radius:var(--radius);box-shadow:var(--shadow-lg);list-style:none;padding:var(--space-sm);margin:var(--space-xs) 0 0;min-width:200px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:all .2s}
.dropdown-menu[aria-hidden="false"]{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown-menu a{display:block;padding:var(--space-sm);color:var(--text);border-radius:var(--radius-sm)}
.dropdown-menu a:hover{background:var(--bg-secondary);color:var(--accent)}
.header-cta{display:flex;gap:var(--space-sm)}
.mobile-menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px}
.hamburger{display:block;width:24px;height:2px;background:var(--text);position:relative}
.hamburger::before,.hamburger::after{content:'';position:absolute;width:24px;height:2px;background:var(--text);left:0;transition:all .2s}
.hamburger::before{top:-8px}
.hamburger::after{top:8px}
.mobile-menu-toggle[aria-expanded="true"] .hamburger{background:transparent}
.mobile-menu-toggle[aria-expanded="true"] .hamburger::before{transform:rotate(45deg);top:0}
.mobile-menu-toggle[aria-expanded="true"] .hamburger::after{transform:rotate(-45deg);top:0}

.mobile-menu{position:fixed;top:0;right:0;width:min(320px,80vw);height:100vh;background:var(--bg);box-shadow:-4px 0 16px rgba(0,0,0,.1);transform:translateX(100%);transition:transform .3s;z-index:200;overflow-y:auto}
.mobile-menu[aria-hidden="false"]{transform:translateX(0)}
.mobile-menu-content{padding:var(--space-lg)}
.mobile-menu-close{position:absolute;top:var(--space-md);right:var(--space-md);background:none;border:none;font-size:32px;cursor:pointer;color:var(--text);padding:0;width:32px;height:32px;line-height:1}
.mobile-menu nav ul{list-style:none;padding:0;margin:var(--space-xl) 0}
.mobile-menu nav a{display:block;padding:var(--space-md);color:var(--text);font-weight:500;border-radius:var(--radius)}
.mobile-menu nav a:hover{background:var(--bg-secondary);color:var(--accent)}
.mobile-menu-cta{display:flex;flex-direction:column;gap:var(--space-sm);margin-top:var(--space-xl)}

@media(max-width:1024px){
.nav,.header-cta{display:none}
.mobile-menu-toggle{display:block}
}

.hero{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;padding:clamp(80px,15vw,160px) 0;text-align:center;position:relative}
.hero-title{margin-bottom:var(--space-md)}
.hero-subtitle{font-size:var(--font-xl);margin-bottom:var(--space-xl);opacity:.9}

.footer{background:#1f2937;color:#fff;padding:var(--space-2xl) 0 var(--space-lg)}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-xl);margin-bottom:var(--space-xl)}
.footer-section h3{margin-bottom:var(--space-md);font-size:var(--font-lg)}
.footer-section ul{list-style:none;padding:0}
.footer-section a{color:#9ca3af;display:block;margin-bottom:var(--space-sm)}
.footer-section a:hover{color:#fff}
.footer-agency{margin-bottom:var(--space-md)}
.footer-agency h4{font-size:var(--font-base);margin-bottom:var(--space-xs)}
.footer-agency p{color:#9ca3af;font-size:var(--font-sm);margin-bottom:var(--space-xs)}
.social-links{display:flex;gap:var(--space-md)}
.social-links a{color:#9ca3af;transition:color .2s}
.social-links a:hover{color:#fff}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:var(--space-lg);border-top:1px solid #374151;flex-wrap:wrap;gap:var(--space-md)}
.footer-legal{display:flex;gap:var(--space-md);flex-wrap:wrap}
.footer-legal a{color:#9ca3af;font-size:var(--font-sm)}
.footer-legal a:hover{color:#fff}
.copyright{color:#9ca3af;font-size:var(--font-sm)}

.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s,transform .6s}
.reveal.revealed{opacity:1;transform:translateY(0)}

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

.form-group{margin-bottom:var(--space-md)}
.form-label{display:block;margin-bottom:var(--space-xs);font-weight:600;color:var(--text)}
.form-label .required{color:var(--accent)}
.form-input,.form-textarea,.form-select{width:100%;padding:12px 16px;border:1px solid var(--border);border-radius:var(--radius);font-size:var(--font-base);transition:border-color .2s}
.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(239,68,68,.1)}
.form-textarea{min-height:120px;resize:vertical}
.form-error{color:var(--accent);font-size:var(--font-sm);margin-top:var(--space-xs);display:none}
.form-group.error .form-error{display:block}
.form-group.error .form-input,.form-group.error .form-textarea,.form-group.error .form-select{border-color:var(--accent);background:#fef2f2}
.form-success{background:#d1fae5;border:1px solid #10b981;color:#065f46;padding:var(--space-md);border-radius:var(--radius);margin-bottom:var(--space-md);display:none}
.form-success.show{display:block}
.form-checkbox{display:flex;align-items:flex-start;gap:var(--space-sm)}
.form-checkbox input{margin-top:4px}

.accordion-item{border:1px solid var(--border);border-radius:var(--radius);margin-bottom:var(--space-sm);overflow:hidden}
.accordion-button{width:100%;padding:var(--space-md);background:var(--bg-secondary);border:none;text-align:left;font-weight:600;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:background .2s}
.accordion-button:hover{background:#f3f4f6}
.accordion-button::after{content:'▾';transition:transform .2s}
.accordion-button[aria-expanded="true"]::after{transform:rotate(180deg)}
.accordion-content{padding:0 var(--space-md);max-height:0;overflow:hidden;transition:max-height .3s,padding .3s}
.accordion-content[aria-hidden="false"]{padding:var(--space-md);max-height:500px}

.carousel{position:relative}
.carousel-track{display:flex;overflow:hidden}
.carousel-slide{min-width:100%;transition:transform .3s}
.carousel-controls{display:flex;justify-content:center;gap:var(--space-md);margin-top:var(--space-md)}
.carousel-btn{background:var(--bg);border:1px solid var(--border);border-radius:50%;width:40px;height:40px;cursor:pointer;transition:all .2s}
.carousel-btn:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.carousel-indicators{display:flex;justify-content:center;gap:var(--space-sm);margin-top:var(--space-sm)}
.carousel-indicator{width:8px;height:8px;border-radius:50%;background:var(--border);border:none;cursor:pointer;transition:background .2s}
.carousel-indicator.active{background:var(--accent)}
