/* SocialBar public-site redesign layer
   Shared by the storefront bundle and the PHP route family.
   Content, checkout logic and route behavior remain unchanged. */

:root {
  --sb-redesign-ink: #1d1a17;
  --sb-redesign-ink-soft: #4e4943;
  --sb-redesign-muted: #756f68;
  --sb-redesign-paper: #f5f4f9;
  --sb-redesign-surface: #ffffff;
  --sb-redesign-surface-2: #e9e7f1;
  --sb-redesign-line: rgba(25, 21, 49, 0.14);
  --sb-redesign-accent: #7657d9;
  --sb-redesign-accent-dark: #4d369f;
  --sb-redesign-accent-soft: rgba(118, 87, 217, 0.14);
  --sb-redesign-radius-sm: 8px;
  --sb-redesign-radius-md: 14px;
  --sb-redesign-radius-lg: 22px;
  --sb-redesign-shadow: 0 18px 50px rgba(43, 32, 91, 0.14);
  --sb-redesign-font-body: "Manrope", "Plus Jakarta Sans", sans-serif;
  --sb-redesign-font-display: "Space Grotesk", "Manrope", sans-serif;
}

html {
  scroll-behavior: smooth;
  background: var(--sb-redesign-paper);
}

body {
  font-family: var(--sb-redesign-font-body);
  color: var(--sb-redesign-ink);
  background:
    radial-gradient(circle at 8% 0%, rgba(118, 87, 217, 0.09), transparent 32rem),
    var(--sb-redesign-paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.3'/%3E%3C/svg%3E");
}

body > * { position: relative; z-index: 1; }

h1, h2, h3, h4, h5, h6,
.sb-logo__text,
.priya-page-hero h1,
.priya-editorial-grid h2 {
  font-family: var(--sb-redesign-font-display);
  letter-spacing: -0.045em;
  text-wrap: balance;
}

p, li, td, th, label, .form-control, .form-select {
  line-height: 1.65;
}

p, .prose, .page-description, .priya-page-hero p {
  max-width: 68ch;
}

a {
  color: var(--sb-redesign-accent-dark);
  text-underline-offset: 0.18em;
  transition: color 180ms ease, opacity 180ms ease;
}

a:hover { color: var(--sb-redesign-accent); }

:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid rgba(118, 87, 217, 0.42);
  outline-offset: 3px;
}

/* Legacy shell: replace the purple/lime treatment with a quieter editorial rail. */
body.sb-shell {
  color: var(--sb-redesign-ink);
  background: var(--sb-redesign-paper);
}

.sb-sidebar {
  background: #0d0b14 !important;
  border-right: 1px solid rgba(255, 248, 239, 0.12) !important;
  box-shadow: 12px 0 36px rgba(30, 20, 68, 0.22) !important;
}

.sb-sidebar__header { border-bottom-color: rgba(255, 248, 239, 0.13) !important; }
.sb-logo__text, .sb-sidebar .sb-item { color: #fbf6ef !important; }
.sb-sidebar .sb-group__label, .sb-sidebar .sb-item__icon, .sb-sidebar .sb-item__caret { color: #bdb1a3 !important; }
.sb-sidebar .sb-item:hover { background: rgba(255, 255, 255, 0.08) !important; color: #ffffff !important; }
.sb-sidebar .sb-item[aria-current="page"] {
  background: var(--sb-redesign-accent) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 18px rgba(201, 95, 45, 0.22) !important;
}
.sb-sidebar .sb-item[aria-current="page"] .sb-item__icon,
.sb-sidebar .sb-item[aria-current="page"] .sb-item__caret { color: #ffffff !important; }
.sb-theme-toggle, .sb-rail-toggle {
  color: #f8eee4 !important;
  background: rgba(255, 248, 239, 0.07) !important;
  border-color: rgba(255, 248, 239, 0.16) !important;
}
.sb-theme-toggle:hover, .sb-rail-toggle:hover { border-color: var(--sb-redesign-accent) !important; }

.sb-topbar {
  background: rgba(245, 244, 249, 0.9) !important;
  border-bottom: 1px solid var(--sb-redesign-line) !important;
  box-shadow: 0 8px 26px rgba(43, 32, 91, 0.08) !important;
  backdrop-filter: blur(18px);
}

/* Shared page surfaces and content rhythm. */
.container { width: min(1180px, calc(100% - 40px)); }
.section { padding-top: clamp(56px, 8vw, 104px); padding-bottom: clamp(64px, 9vw, 120px); }
.section.alt { background: rgba(235, 228, 219, 0.52); }
.priya-page-hero {
  background:
    radial-gradient(circle at 78% 16%, rgba(118, 87, 217, 0.22), transparent 25rem),
    #0d0b14 !important;
  color: #ffffff !important;
  padding-block: clamp(70px, 10vw, 136px) !important;
}
.priya-page-hero h1 { font-size: clamp(2.8rem, 6vw, 6.4rem) !important; line-height: 0.96 !important; }
.priya-page-hero p { color: #c9c4d9 !important; font-size: 1.08rem; }
.priya-page-kicker, .priya-page-hero span { color: #a99bf5 !important; letter-spacing: 0.12em; }
.priya-page-portrait { border-radius: var(--sb-redesign-radius-lg) !important; box-shadow: var(--sb-redesign-shadow) !important; overflow: hidden; }
.priya-page-actions { gap: 12px !important; }

.btn, button, input[type="submit"], input[type="button"] {
  font-family: var(--sb-redesign-font-body);
  border-radius: var(--sb-redesign-radius-sm);
  transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.btn-primary, .btn.btn-primary, button.btn-primary {
  background: var(--sb-redesign-accent) !important;
  border-color: var(--sb-redesign-accent) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 22px rgba(118, 87, 217, 0.25) !important;
}
.btn-primary:hover, .btn.btn-primary:hover, button.btn-primary:hover {
  background: #8b6bea !important;
  border-color: #8b6bea !important;
  transform: translateY(-1px);
}
.btn:active, button:active, input[type="submit"]:active { transform: translateY(1px) scale(0.985); }
.btn-ghost, .btn.btn-ghost {
  color: inherit !important;
  background: transparent !important;
  border: 1px solid currentColor !important;
}

.card, .panel, .feature-box, .mfeature-box, .priya-editorial-grid article,
.table-responsive, .contact-card, .faq-item {
  border: 1px solid var(--sb-redesign-line);
  border-radius: var(--sb-redesign-radius-md);
  background: rgba(255, 253, 249, 0.78);
  box-shadow: 0 8px 28px rgba(43, 32, 91, 0.07);
}
.priya-editorial-grid { gap: clamp(16px, 3vw, 28px) !important; }
.priya-editorial-grid article { padding: clamp(24px, 4vw, 42px) !important; }
.priya-editorial-grid article > span { color: var(--sb-redesign-accent-dark); letter-spacing: 0.08em; font-size: 0.78rem; }

input:not([type="checkbox"]):not([type="radio"]), select, textarea, .form-control, .form-select {
  border: 1px solid var(--sb-redesign-line) !important;
  border-radius: var(--sb-redesign-radius-sm) !important;
  background: var(--sb-redesign-surface) !important;
  color: var(--sb-redesign-ink) !important;
  min-height: 44px;
}
input:not([type="checkbox"]):not([type="radio"]):focus, select:focus, textarea:focus, .form-control:focus, .form-select:focus {
  border-color: var(--sb-redesign-accent) !important;
  box-shadow: 0 0 0 3px var(--sb-redesign-accent-soft) !important;
}

table { border-collapse: separate; border-spacing: 0; overflow: hidden; border-radius: var(--sb-redesign-radius-md); }
thead th { background: #0d0b14 !important; color: #ffffff !important; letter-spacing: 0.04em; }
tbody tr { transition: background-color 160ms ease; }
tbody tr:hover { background: rgba(201, 95, 45, 0.06); }

.alert, .notice, .toast, .sb-toast {
  border-radius: var(--sb-redesign-radius-sm);
  border-left: 3px solid var(--sb-redesign-accent);
}

/* Public-service cards: variable-height editorial grid, restrained elevation. */
article.ig-home-service-card, .ig-card {
  border-radius: var(--sb-redesign-radius-md) !important;
  border-color: var(--sb-redesign-line) !important;
  background: var(--sb-redesign-surface) !important;
  box-shadow: 0 8px 24px rgba(43, 32, 91, 0.07) !important;
}
article.ig-home-service-card:hover, .ig-card:hover {
  border-color: rgba(118, 87, 217, 0.52) !important;
  box-shadow: 0 18px 36px rgba(43, 32, 91, 0.13) !important;
}
.ig-boost-btn, .ig-boost-cta, .ig-home-service-card .btn {
  background: var(--sb-redesign-accent) !important;
  border-color: var(--sb-redesign-accent) !important;
  color: #ffffff !important;
}

footer, .site-footer { background: #0d0b14 !important; color: #c9c4d9 !important; }
footer a, .site-footer a { color: #a99bf5 !important; }

@media (max-width: 992px) {
  body.sb-shell { padding-top: var(--sb-topbar-h); }
  .container { width: min(100% - 28px, 760px); }
  .section { padding-top: 52px; padding-bottom: 68px; }
  .priya-page-hero h1 { font-size: clamp(2.5rem, 13vw, 4.8rem) !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* Storefront bundle: the same system must win over its generated inline theme. */
html:has(.ig-stage), body:has(.ig-stage), #root:has(.ig-stage) {
  background: var(--sb-redesign-paper) !important;
}
.ig-stage.ig-light,
.ig-stage.ig-dark {
  --ig-page-bg: var(--sb-redesign-paper) !important;
  --ig-bg-base: var(--sb-redesign-paper) !important;
  --ig-bg-glow1: rgba(118, 87, 217, 0.12) !important;
  --ig-bg-glow2: rgba(118, 87, 217, 0.06) !important;
  --ig-text: var(--sb-redesign-ink) !important;
  --ig-text-strong: var(--sb-redesign-ink) !important;
  --ig-text-soft: var(--sb-redesign-ink-soft) !important;
  --ig-text-mute: var(--sb-redesign-muted) !important;
  --ig-tile-bg: var(--sb-redesign-surface) !important;
  --ig-edge: var(--sb-redesign-line) !important;
  --ig-edge-strong: rgba(118, 87, 217, 0.28) !important;
  --ig-accent: var(--sb-redesign-accent) !important;
  --ig-accent-deep: var(--sb-redesign-accent-dark) !important;
  --ig-ink-btn-grad: #0d0b14 !important;
  color: var(--sb-redesign-ink) !important;
  background: var(--sb-redesign-paper) !important;
}
.ig-rail {
  background: #0d0b14 !important;
  border-right-color: rgba(255, 248, 239, 0.12) !important;
}
.ig-nav-item { color: #cfc1b4 !important; }
.ig-nav-item:hover, .ig-nav-item.ig-active { color: #ffffff !important; background: rgba(118, 87, 217, 0.24) !important; }
.ig-bazaar .ig-hero {
  background: #0d0b14 !important;
  box-shadow: 0 24px 54px rgba(43, 32, 91, 0.24) !important;
}
.ig-bazaar .ig-hero h1 em { color: #a99bf5 !important; }
.ig-bazaar .ig-hero-cta { background: var(--sb-redesign-accent) !important; color: #ffffff !important; }
.ig-bazaar .ig-hero-cta.ghost { background: rgba(255, 255, 255, 0.08) !important; border-color: rgba(255, 255, 255, 0.25) !important; }
.ig-bazaar .ig-card,
.ig-bazaar .ig-home-service-card {
  background: var(--sb-redesign-surface) !important;
  border-color: var(--sb-redesign-line) !important;
  box-shadow: 0 8px 24px rgba(43, 32, 91, 0.08) !important;
}
.ig-bazaar .ig-card:hover,
.ig-bazaar .ig-home-service-card:hover {
  border-color: rgba(118, 87, 217, 0.52) !important;
  box-shadow: 0 18px 36px rgba(43, 32, 91, 0.13) !important;
}
.ig-bazaar .ig-card-headline,
.ig-bazaar .ig-home-service-card h3,
.ig-bazaar .ig-card-price,
.ig-bazaar .ig-home-price strong { color: var(--sb-redesign-ink) !important; }
.ig-bazaar .ig-boost-btn,
.ig-bazaar .ig-boost-cta,
.ig-bazaar .ig-growth-cta { background: var(--sb-redesign-accent) !important; box-shadow: 0 10px 22px rgba(118, 87, 217, 0.25) !important; }
.ig-bazaar .ig-category { background: var(--sb-redesign-surface) !important; border-color: var(--sb-redesign-line) !important; }
.ig-bazaar .ig-category:hover, .ig-bazaar .ig-category.ig-active { border-color: var(--sb-redesign-accent) !important; box-shadow: 0 8px 18px rgba(118, 87, 217, 0.14) !important; }
.ig-bazaar .ig-category.active { background: #0d0b14 !important; color: #ffffff !important; border-color: var(--sb-redesign-accent) !important; box-shadow: 0 8px 18px rgba(118, 87, 217, 0.2) !important; }
.ig-bazaar .ig-search, .ig-bazaar .ig-input, .ig-bazaar .ig-textarea { background: var(--sb-redesign-surface) !important; border-color: var(--sb-redesign-line) !important; color: var(--sb-redesign-ink) !important; }
.ig-bazaar .ig-footer { background: #0d0b14 !important; color: #c9c4d9 !important; }
.ig-bazaar .ig-footer a { color: #a99bf5 !important; }

@media (max-width: 700px) {
  .ig-bazaar .ig-hero { border-radius: 16px !important; }
  .ig-bazaar .ig-grid { gap: 12px !important; }
}