/* Main stylesheet for Promepy MVP */
:root {
  --bg: #ffffff;
  --text: #1f2937;
  --accent: #6366f1;
  --accent-hover: #4f46e5;
  --muted: #6b7280;
  --border: #e5e7eb;
  --surface: #f9fafb;
  --radius: 8px;
  --warn: #d97706;
  --primary: #3B82F6;
  --primary-foreground: #ffffff;
  --secondary: #eef2ff;
  --secondary-foreground: #1f2937;
  --gradient-blue: linear-gradient(135deg,#eff6ff,#eef2ff 55%);
  --transition: .18s cubic-bezier(.4,0,.2,1);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.06); 
  --shadow-md: 0 4px 12px -2px rgba(0,0,0,.08),0 2px 4px -2px rgba(0,0,0,.06);
  --shadow-focus: 0 0 0 3px rgba(99,102,241,.35);
  --code-bg: #111827;
}
/* Dark mode tokens */
.dark {
  --bg: #0f172a;
  --text: #f1f5f9;
  --accent: #6366f1;
  --accent-hover: #818cf8;
  --muted: #94a3b8;
  --border: #1e293b;
  --surface: #1e293b;
  --secondary: #1e293b;
  --secondary-foreground: #e2e8f0;
  --primary: #3B82F6;
  --primary-foreground: #ffffff;
  --gradient-blue: linear-gradient(135deg,#1e293b,#0f172a 55%);
  --code-bg: #0a0f1c;
}
html {box-sizing: border-box;} *,*::before,*::after {box-sizing: inherit;}
body {margin:0;font-family: system-ui,-apple-system,Segoe UI,Roboto,Inter,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;}
img {max-width:100%;display:block;}
a {color:var(--accent);text-decoration:none;} a:hover{color:var(--accent-hover);} 

/* Layout */
.wrap {width:100%;max-width:1100px;margin:0 auto;padding:2.5rem 1.5rem;}
.wrap.narrow {max-width:820px;}
.site-header {background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50;}
.dark .site-header {background:#0f172a;border-color:var(--border);}
.nav {display:flex;align-items:center;justify-content:space-between;max-width:1100px;margin:0 auto;padding:.85rem 1.25rem;}
.logo {font-weight:600;font-size:1.15rem;letter-spacing:.5px;}
.nav-links {list-style:none;display:flex;gap:1.25rem;margin:0;padding:0;}
.nav-links a {padding:.35rem .5rem;border-radius:6px;font-size:.95rem;color:var(--text);}
.nav-links a.active, .nav-links a:hover {background:var(--surface);color:var(--accent);}

.site-footer {background:#fff;border-top:1px solid var(--border);text-align:center;padding:2.5rem 1rem;margin-top:3rem;font-size:.85rem;color:var(--muted);} 
.dark .site-footer {background:#0f172a;color:var(--muted);}
.site-footer a {color:var(--muted);} .site-footer a:hover {color:var(--accent);} 

/* Hero */
.hero {padding:5rem 1.5rem 4rem;background:linear-gradient(135deg,#eef2ff,#ffffff 55%);} 
.dark .hero {background:var(--gradient-blue);}
.hero-inner {max-width:1000px;margin:0 auto;display:grid;gap:2.5rem;grid-template-columns:1fr;}
.hero-copy h1 {font-size:clamp(2.3rem,6vw,3.4rem);line-height:1.05;margin:0 0 1.25rem;font-weight:700;}
.hero-copy p.sub {font-size:clamp(1.05rem,2vw,1.25rem);color:var(--muted);max-width:640px;}
.actions {margin-top:1.75rem;display:flex;flex-wrap:wrap;gap:1rem;}
.btn {display:inline-block;font-weight:500;padding:.85rem 1.25rem;border-radius:var(--radius);font-size:.95rem;transition:.2s;background:var(--surface);color:var(--text);border:1px solid var(--border);} 
.btn.primary {background:var(--accent);color:#fff;border-color:var(--accent);} 
.btn.primary:hover {background:var(--accent-hover);} 
.btn.outline {background:#fff;} .btn.outline:hover {background:var(--surface);} 

/* Sections */
.tagline {color:var(--muted);font-size:1.05rem;margin-top:.35rem;}
.tiers-grid {display:grid;gap:1.5rem;margin:2.5rem 0;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));}
.tier {background:var(--surface);padding:1.25rem 1.25rem 1.5rem;border:1px solid var(--border);border-radius:var(--radius);} 
.tier h2 {margin-top:0;font-size:1.1rem;}
.tier ul {padding-left:1.1rem;margin:.75rem 0 0;}

.cards {display:grid;gap:1.5rem;margin:2rem 0;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.card {background:var(--surface);padding:1.25rem 1.25rem 1.4rem;border:1px solid var(--border);border-radius:var(--radius);display:flex;flex-direction:column;gap:.5rem;}
.dark .card {background:#162132;border-color:var(--border);}
.card.placeholder {opacity:.6;}
.card h2 {margin:.25rem 0 .35rem;font-size:1.05rem;}
.card ul {margin:.35rem 0 .5rem;padding-left:1.1rem;}
.meta.small {font-size:.7rem;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);} 

/* Blog list (note: legacy .post-roadmap removed in purge) */
.note {font-size:.85rem;color:var(--muted);}

/* PURGE 2025-09-08: Removed unused legacy selectors (.post-roadmap, .testimonials-grid, .testimonial, .cta-inline, .legal, .form-embed, .alt-contact) to reduce CSS. Retained core legacy layout classes to avoid breaking untouched legacy pages. */

/* CTA blocks */
.cta-block {background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;padding:2.25rem 1.75rem;border-radius:var(--radius);margin:3rem 0 2rem;}
.dark .cta-block {background:linear-gradient(135deg,#4f46e5,#4338ca);}
.cta-block h2 {margin-top:0;font-size:1.6rem;}
.cta-block .btn {background:#fff;color:#111827;border-color:#fff;} .cta-block .btn:hover {background:var(--surface);} 

/* Inline CTA (removed) */
/* Legacy Legal + Form embed styles removed in purge. */
.small {font-size:.75rem;color:var(--muted);} 

/* Utilities */
.placeholder {--alpha:.25;}
.placeholder {position:relative;}
.placeholder::after {content:"Placeholder";position:absolute;top:8px;right:10px;font-size:.6rem;letter-spacing:1px;background:#111827;color:#fff;padding:.2rem .45rem;border-radius:4px;opacity:.55;}

/* Responsive adjustments */
@media (min-width:800px){
  .hero-inner {grid-template-columns:repeat(2,1fr);align-items:center;}
}

/* Utility subset (minimal) */
.flex{display:flex;} .inline-flex{display:inline-flex;} .items-center{align-items:center;} .justify-center{justify-content:center;} .justify-between{justify-content:space-between;} .gap-2{gap:.5rem;} .gap-4{gap:1rem;} .mx-auto{margin-left:auto;margin-right:auto;} .text-center{text-align:center;} .hidden{display:none;} .block{display:block;} .w-full{width:100%;}
.p-2{padding:.5rem;} .p-4{padding:1rem;} .p-6{padding:1.5rem;} .px-4{padding-left:1rem;padding-right:1rem;} .py-2{padding-top:.5rem;padding-bottom:.5rem;} .py-4{padding-top:1rem;padding-bottom:1rem;} .py-6{padding-top:1.5rem;padding-bottom:1.5rem;} .py-8{padding-top:2rem;padding-bottom:2rem;} .py-12{padding-top:3rem;padding-bottom:3rem;}
.rounded{border-radius:var(--radius);} .rounded-full{border-radius:9999px;} .shadow-sm{box-shadow:var(--shadow-sm);} .shadow-md{box-shadow:var(--shadow-md);} .ring-focus:focus{box-shadow:var(--shadow-focus);} .transition{transition:var(--transition);} .text-sm{font-size:.875rem;} .text-lg{font-size:1.125rem;} .font-bold{font-weight:700;} .font-semibold{font-weight:600;} .uppercase{text-transform:uppercase;letter-spacing:.05em;}
.bg-primary{background:var(--primary);color:var(--primary-foreground);} .bg-secondary{background:var(--secondary);color:var(--secondary-foreground);} .hover\:bg-primary:hover{background:var(--accent-hover);} .border{border:1px solid var(--border);} .border-dashed{border-style:dashed;}

/* Header (new responsive + toggle) */
.new-header {background:var(--bg);border-bottom:1px solid var(--border);} .dark .new-header {background:#0f172a;}
.new-header-inner {max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:.9rem 1rem;}
.site-brand {font-size:1.3rem;font-weight:700;color:var(--primary);}
.primary-nav {display:none;gap:1.5rem;align-items:center;}
.primary-nav a {font-size:.9rem;color:var(--muted);padding:.4rem .5rem;border-radius:6px;transition:var(--transition);} 
.primary-nav a.active, .primary-nav a:hover {color:var(--accent);background:var(--surface);} 
.nav-cta {background:var(--primary);color:#fff;padding:.55rem .95rem;border-radius:6px;font-size:.8rem;font-weight:600;display:inline-flex;align-items:center;gap:.35rem;}
.nav-cta:hover {background:var(--accent-hover);} 
.mobile-toggle {background:var(--surface);border:1px solid var(--border);width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:8px;cursor:pointer;}
.dark .mobile-toggle {background:#162132;}
.mobile-menu {display:none;border-top:1px solid var(--border);padding:1rem 1rem 1.25rem;}
.mobile-menu a, .mobile-menu button {display:block;width:100%;text-align:left;padding:.6rem .75rem;border-radius:6px;font-size:.9rem;color:var(--muted);background:transparent;border:0;cursor:pointer;}
.mobile-menu a:hover, .mobile-menu button:hover {background:var(--surface);color:var(--accent);} 

@media (min-width:820px){
  .primary-nav {display:flex;}
  .mobile-toggle {display:none;}
  .mobile-menu {display:none !important;}
}

/* Footer (new grid style placeholder) */
.footer-grid {display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));text-align:left;margin-bottom:2rem;}
.footer-col h3 {margin:.15rem 0 .75rem;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);}
.footer-col a, .footer-col button {display:block;margin:.4rem 0;font-size:.85rem;color:var(--muted);text-decoration:none;background:none;border:0;padding:0;cursor:pointer;text-align:left;}
.footer-col a:hover, .footer-col button:hover {color:var(--accent);} 
.social-row {display:flex;gap:.75rem;}
.social-icon {width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:8px;color:var(--muted);transition:var(--transition);background:var(--surface);}
.dark .social-icon {background:#162132;}
.social-icon:hover {color:var(--accent);}

/* Dark mode toggle button */
.theme-toggle {background:var(--surface);border:1px solid var(--border);width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--transition);}
.theme-toggle:hover {background:var(--secondary);} .dark .theme-toggle {background:#162132;} .dark .theme-toggle:hover {background:#1e293b;}

/* Inline SVG icon sizing */
.icon {width:18px;height:18px;display:block;}

/* Accessibility helpers */
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* Form enhancements (for future contact page rebuild) */
.form-grid {display:grid;gap:1rem;} @media (min-width:760px){.form-grid.cols-2 {grid-template-columns:repeat(2,1fr);} }
.input {width:100%;padding:.7rem .85rem;border:1px solid var(--border);border-radius:6px;background:var(--surface);font:inherit;} .input:focus{outline:none;box-shadow:var(--shadow-focus);}
.textarea {width:100%;padding:.75rem .85rem;border:1px solid var(--border);border-radius:6px;resize:vertical;min-height:140px;background:var(--surface);font:inherit;} .textarea:focus{outline:none;box-shadow:var(--shadow-focus);}

/* Buttons (extended) */
.btn.new {display:inline-flex;align-items:center;gap:.45rem;font-weight:600;line-height:1;border-radius:6px;padding:.75rem 1.1rem;font-size:.9rem;background:var(--primary);color:#fff;border:1px solid var(--primary);} .btn.new:hover {background:var(--accent-hover);} 
.btn.outline-new {background:transparent;border:1px solid var(--border);color:var(--text);} .btn.outline-new:hover {background:var(--surface);} .dark .btn.outline-new:hover {background:#162132;}

/* Gradient card placeholder */
.gradient-card {background:linear-gradient(135deg,#eff6ff,#fff);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;} .dark .gradient-card {background:linear-gradient(135deg,#1e293b,#162132);}

/* Animation small */
@keyframes fadeIn {from {opacity:0;transform:translateY(6px);} to {opacity:1;transform:translateY(0);} }
.fade-in {animation:fadeIn .5s ease;}

/* Projects Page */
.projects-grid {display:grid;gap:1.5rem;margin-top:1.75rem;} @media (min-width:900px){.projects-grid {grid-template-columns:repeat(3,1fr);} }
.project-card {background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1.25rem 1.4rem;display:flex;flex-direction:column;gap:.75rem;transition:var(--transition);} .project-card:hover {box-shadow:var(--shadow-md);} .dark .project-card {background:#162132;}
.badge.small {font-size:.55rem;padding:.3rem .5rem;}

/* Blog Page */
.category-grid {display:grid;gap:1rem;margin-top:1.25rem;} @media (min-width:680px){.category-grid {grid-template-columns:repeat(4,1fr);} }
.category-card {background:var(--surface);border:1px solid var(--border);padding:1rem .75rem;border-radius:var(--radius);text-align:center;transition:var(--transition);} .category-card:hover {box-shadow:var(--shadow-sm);} .dark .category-card {background:#162132;}
.post-grid {display:grid;gap:1.5rem;margin-top:1.5rem;} @media (min-width:760px){.post-grid {grid-template-columns:repeat(2,1fr);} }
.post-card {background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;display:flex;flex-direction:column;gap:.85rem;transition:var(--transition);} .post-card:hover {box-shadow:var(--shadow-md);transform:translateY(-3px);} .dark .post-card {background:#162132;}
.chip {display:inline-block;font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;padding:.35rem .55rem;border:1px solid var(--border);border-radius:999px;background:var(--secondary);color:var(--text);} .dark .chip {background:#162132;color:var(--muted);}
.topics {display:flex;flex-wrap:wrap;gap:.4rem;}
.newsletter-card {background:linear-gradient(90deg,#3B82F6,#6366f1);color:#fff;padding:2.5rem 1.75rem;border-radius:var(--radius);text-align:center;}
.philosophy-grid {display:grid;gap:1.5rem;margin-top:2rem;} @media (min-width:760px){.philosophy-grid {grid-template-columns:repeat(3,1fr);} }
.philosophy-item {text-align:center;padding:1.5rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);} .dark .philosophy-item {background:#162132;}

/* Contact Page */
.contact-methods {display:grid;gap:1.5rem;margin-top:2rem;} @media (min-width:900px){.contact-methods {grid-template-columns:repeat(3,1fr);} }
.method-card {background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;position:relative;text-align:center;display:flex;flex-direction:column;gap:.75rem;} .method-card.recommended {box-shadow:0 0 0 2px var(--primary);} .dark .method-card {background:#162132;}
.benefits-grid {display:grid;gap:1rem;margin-top:1.25rem;} @media (min-width:880px){.benefits-grid {grid-template-columns:repeat(2,1fr);} }
.faq-list {display:grid;gap:1rem;margin-top:1.25rem;}
.faq-item {background:var(--surface);border:1px solid var(--border);padding:1rem 1rem 1.1rem;border-radius:var(--radius);} .dark .faq-item {background:#162132;}

/* Legal Pages */
.legal-wrap {max-width:880px;margin:0 auto;padding:3.5rem 1.25rem;}
.legal-wrap h1 {font-size:2.4rem;margin:0 0 1rem;font-weight:700;}
.legal-wrap h2 {font-size:1.35rem;margin:2.25rem 0 1rem;font-weight:600;}
.legal-card {background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:2.25rem 1.75rem;} .dark .legal-card {background:#162132;}

/* Homepage extracted layout sections */
.section {padding:4rem 1.25rem;} @media (min-width:900px){.section {padding:5rem 1.5rem;}}
.section.alt {background:var(--surface);} .dark .section.alt {background:#162132;}
.max {max-width:1200px;margin:0 auto;}
.center {text-align:center;}
.lead {font-size:1.125rem;line-height:1.55;color:var(--muted);max-width:820px;margin:.75rem auto 0;}
.badge {display:inline-flex;align-items:center;gap:.4rem;font-size:.65rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;background:var(--secondary);color:var(--accent-hover);padding:.4rem .65rem;border-radius:999px;border:1px solid var(--border);} .dark .badge {background:#162132;color:var(--muted);}
.grid-3 {display:grid;gap:1.75rem;margin-top:2.25rem;} @media (min-width:880px){.grid-3 {grid-template-columns:repeat(3,1fr);}}
.grid-plat {display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.25rem;}
.pill {background:var(--secondary);color:var(--text);padding:.45rem .75rem;font-size:.7rem;border-radius:999px;border:1px solid var(--border);} .dark .pill {background:#162132;color:var(--muted);}
.quote-cards {display:grid;gap:1.5rem;margin-top:2rem;} @media (min-width:880px){.quote-cards {grid-template-columns:repeat(3,1fr);}}
.quote-card {background:linear-gradient(135deg,#eff6ff,#eef2ff);border:1px dashed var(--border);padding:1.5rem;border-radius:var(--radius);display:flex;flex-direction:column;gap:.9rem;font-size:.9rem;} .dark .quote-card {background:linear-gradient(135deg,#1e293b,#162132);} .quote-card blockquote{margin:0;font-style:italic;line-height:1.5;}
.cta-band {background:var(--primary);color:#fff;padding:4.5rem 1.25rem;margin-top:0;} .cta-band .inner {max-width:880px;margin:0 auto;text-align:center;} .cta-band h2 {font-size:2rem;margin:0 0 1rem;} .cta-band p {margin:0 0 1.5rem;font-size:1.15rem;line-height:1.5;opacity:.9;} .cta-band .btn.new {background:#fff;color:#111827;border-color:#fff;} .cta-band .btn.new:hover {background:var(--secondary);} .dark .cta-band .btn.new {color:#0f172a;}
.hero-new {padding:5.5rem 1.25rem 4.5rem;background:var(--gradient-blue);} .dark .hero-new {background:var(--gradient-blue);} .hero-new h1 {font-size:clamp(2.4rem,6vw,3.6rem);line-height:1.05;margin:0 0 1rem;font-weight:700;}
.actions-row {display:flex;flex-direction:column;gap:1rem;justify-content:center;margin-top:2rem;} @media (min-width:640px){.actions-row {flex-direction:row;}}
.btn.secondary-outline {background:transparent;color:var(--text);border:1px solid var(--border);} .btn.secondary-outline:hover {background:var(--surface);} .dark .btn.secondary-outline:hover {background:#162132;}
