/*
  DRR DAMSON – STAGE9P FINAL AESTHETIC UI POLISH
  Zakres: czysty frontend/UI. Bez backendu, koszyka, płatności i logiki formularzy.
  Cel: końcowe spasowanie headera, menu, hero, kart, odstępów i mobile.
*/

:root {
  --drr-bg-deep: #071214;
  --drr-bg: #0b1719;
  --drr-bg-panel: rgba(11, 28, 30, 0.92);
  --drr-bg-card: rgba(13, 35, 37, 0.86);
  --drr-bg-card-2: rgba(18, 47, 48, 0.82);
  --drr-gold: #d9b85a;
  --drr-gold-soft: rgba(217, 184, 90, 0.32);
  --drr-turquoise: #14c7bd;
  --drr-laser: #48ffbb;
  --drr-border: rgba(217, 184, 90, 0.22);
  --drr-border-teal: rgba(20, 199, 189, 0.22);
  --drr-text: #f6f2e9;
  --drr-muted: #aebbb8;
  --drr-shadow: 0 24px 60px rgba(0, 0, 0, 0.36);
  --drr-radius-lg: 26px;
  --drr-radius-md: 18px;
  --drr-radius-sm: 12px;
  --drr-container: min(1180px, calc(100% - 42px));
}

html {
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  overflow-x: hidden !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(20, 199, 189, 0.13), transparent 32rem),
    radial-gradient(circle at 86% 12%, rgba(217, 184, 90, 0.08), transparent 34rem),
    linear-gradient(180deg, #061112 0%, #081516 42%, #061010 100%) !important;
  color: var(--drr-text) !important;
  text-rendering: geometricPrecision;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background-image:
    linear-gradient(rgba(255,255,255,0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.014) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.75), rgba(0,0,0,.15));
}

body .container {
  max-width: 1180px;
}

/* ---------- TOPBAR / HEADER ---------- */
.top-bar,
.top-bar.drr-unified-topbar {
  min-height: 30px !important;
  padding: 6px 0 !important;
  background: rgba(4, 13, 14, 0.92) !important;
  border-bottom: 1px solid rgba(217, 184, 90, 0.12) !important;
  color: rgba(246, 242, 233, 0.72) !important;
  font-size: 12px !important;
}

.top-bar .container {
  width: var(--drr-container) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  flex-wrap: wrap !important;
}

.top-bar-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  opacity: .9;
}

.site-header-v2,
.site-header-v2.drr-unified-header {
  background: linear-gradient(180deg, rgba(8, 25, 26, 0.98), rgba(7, 20, 21, 0.95)) !important;
  border-bottom: 1px solid rgba(217, 184, 90, 0.16) !important;
  box-shadow: 0 14px 42px rgba(0,0,0,.24) !important;
  padding: 14px 0 !important;
}

.site-header-v2 > .container,
.site-header-v2 .container {
  width: var(--drr-container) !important;
}

.site-header-v2 .header-v2-inner {
  display: grid !important;
  grid-template-columns: minmax(190px, 255px) minmax(260px, 1fr) auto !important;
  align-items: center !important;
  gap: 22px !important;
}

.site-header-v2 .brand {
  min-width: 0 !important;
  gap: 13px !important;
}

.site-header-v2 .brand img {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 18px rgba(20,199,189,.22));
}

.site-header-v2 .brand span:first-child {
  letter-spacing: .3px !important;
}

.site-header-v2 .search-container {
  height: 44px !important;
  width: min(100%, 520px) !important;
  justify-self: center !important;
  display: grid !important;
  grid-template-columns: 1fr 48px !important;
  align-items: center !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(217,184,90,.34) !important;
  border-radius: 999px !important;
  background: rgba(5, 14, 15, 0.72) !important;
  box-shadow: inset 0 0 0 1px rgba(20,199,189,.06) !important;
}

.site-header-v2 .search-input {
  height: 100% !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: var(--drr-text) !important;
  padding: 0 16px !important;
  min-width: 0 !important;
}

.site-header-v2 .search-input::placeholder {
  color: rgba(246, 242, 233, 0.48) !important;
}

.site-header-v2 .search-btn {
  height: 44px !important;
  width: 48px !important;
  border: 0 !important;
  background: linear-gradient(135deg, #efd16f, #c99a30) !important;
  color: #111 !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  transition: filter .18s ease, transform .18s ease !important;
}

.site-header-v2 .search-btn:hover {
  filter: brightness(1.06) saturate(1.05);
  transform: translateY(-1px);
}

.site-header-v2 .user-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
}

.site-header-v2 .user-actions .action-item {
  min-width: 82px !important;
  height: 48px !important;
  display: inline-flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(20,199,189,.25) !important;
  color: var(--drr-text) !important;
  background: rgba(10, 35, 35, 0.72) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.18) !important;
  font-size: 11px !important;
  line-height: 1.1 !important;
  text-decoration: none !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease !important;
}

.site-header-v2 .user-actions .action-item:hover,
.site-header-v2 .user-actions .action-item:focus-visible {
  transform: translateY(-2px) !important;
  border-color: rgba(217,184,90,.62) !important;
  color: var(--drr-gold) !important;
  background: rgba(14, 48, 47, 0.92) !important;
}

.site-header-v2 .user-actions .action-item i {
  color: var(--drr-gold) !important;
}

/* ---------- NAVIGATION HARD POLISH ---------- */
.main-nav-v2,
.main-nav-v2.drr-nav-stage7w,
.main-nav-v2.drr-nav-stage8m {
  position: relative !important;
  z-index: 80 !important;
  background: rgba(5, 14, 15, 0.86) !important;
  border-top: 1px solid rgba(255,255,255,.035) !important;
  border-bottom: 1px solid rgba(217,184,90,.14) !important;
  backdrop-filter: blur(12px) !important;
}

.main-nav-v2 .container {
  width: var(--drr-container) !important;
}

.main-nav-v2 .nav-v2-list,
.main-nav-v2 .nav-v2-list--rich,
.main-nav-v2 .drr-nav-stage7w__list {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 6px 8px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 11px 0 !important;
}

.main-nav-v2 .nav-v2-list > li,
.main-nav-v2 .drr-nav-stage7w__list > li {
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
}

.main-nav-v2 .nav-v2-list > li::marker,
.main-nav-v2 .drr-nav-stage7w__list > li::marker {
  content: "" !important;
}

.main-nav-v2 .nav-v2-list > li > a,
.main-nav-v2 .drr-nav-stage7w__trigger,
.main-nav-v2 .drr-nav-stage7w__list > li > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 36px !important;
  padding: 9px 13px !important;
  border-radius: 999px !important;
  color: rgba(246,242,233,.86) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  text-transform: none !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease !important;
}

.main-nav-v2 .nav-v2-list > li > a:hover,
.main-nav-v2 .nav-v2-list > li > a:focus-visible,
.main-nav-v2 .drr-nav-stage7w__trigger:hover,
.main-nav-v2 .drr-nav-stage7w__trigger:focus-visible {
  color: var(--drr-gold) !important;
  background: rgba(217,184,90,.10) !important;
  border-color: rgba(217,184,90,.24) !important;
  transform: translateY(-1px) !important;
}

.main-nav-v2 .drr-nav-stage7w__dropdown {
  display: none !important;
  position: absolute !important;
  top: calc(100% + 10px) !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  min-width: 265px !important;
  width: max-content !important;
  max-width: min(92vw, 520px) !important;
  padding: 10px !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(20,199,189,.14), transparent 16rem),
    linear-gradient(180deg, rgba(10,28,30,.98), rgba(6,17,18,.98)) !important;
  border: 1px solid rgba(217,184,90,.26) !important;
  box-shadow: 0 26px 70px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.04) !important;
  z-index: 9999 !important;
}

.main-nav-v2 .drr-nav-stage7w__item:hover > .drr-nav-stage7w__dropdown,
.main-nav-v2 .drr-nav-stage7w__item:focus-within > .drr-nav-stage7w__dropdown {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 4px !important;
}

.main-nav-v2 .drr-nav-stage7w__dropdown a {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  width: 100% !important;
  min-height: 36px !important;
  padding: 9px 12px !important;
  border-radius: 12px !important;
  color: rgba(246,242,233,.86) !important;
  background: transparent !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  transition: background .18s ease, color .18s ease, transform .18s ease !important;
}

.main-nav-v2 .drr-nav-stage7w__dropdown a:hover,
.main-nav-v2 .drr-nav-stage7w__dropdown a:focus-visible {
  background: rgba(20,199,189,.10) !important;
  color: var(--drr-gold) !important;
  transform: translateX(2px) !important;
}

.main-nav-v2 .drr-nav-stage7w__dropdown::before {
  content: "";
  position: absolute;
  top: -7px;
  left: 50%;
  width: 12px;
  height: 12px;
  transform: translateX(-50%) rotate(45deg);
  background: rgba(10,28,30,.98);
  border-left: 1px solid rgba(217,184,90,.22);
  border-top: 1px solid rgba(217,184,90,.22);
}

/* ---------- HERO / PAGE LEAD ---------- */
.hero-v2,
.portraits-hero,
.drr-ai-landing,
.drr-maker-hero,
.page-hero,
.projects-hero,
.drr-hero,
.drr-stage7x-hero {
  position: relative !important;
  overflow: hidden !important;
  width: var(--drr-container) !important;
  max-width: var(--drr-container) !important;
  margin: 34px auto 34px !important;
  padding: clamp(34px, 5vw, 64px) !important;
  border-radius: var(--drr-radius-lg) !important;
  border: 1px solid rgba(217,184,90,.22) !important;
  background:
    linear-gradient(130deg, rgba(8, 25, 26, 0.98), rgba(11, 37, 38, 0.88)),
    radial-gradient(circle at 88% 8%, rgba(217,184,90,.18), transparent 20rem) !important;
  box-shadow: var(--drr-shadow) !important;
}

.hero-v2::before,
.portraits-hero::before,
.drr-ai-landing::before,
.drr-maker-hero::before,
.page-hero::before,
.projects-hero::before,
.drr-stage7x-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 0 38%, rgba(72,255,187,.12) 48%, transparent 57% 100%);
  transform: translateX(-80%);
  animation: drrLaserSweep 8s ease-in-out infinite;
  opacity: .8;
}

@keyframes drrLaserSweep {
  0%, 70% { transform: translateX(-80%); opacity: 0; }
  78% { opacity: .55; }
  100% { transform: translateX(82%); opacity: 0; }
}

.hero-v2 > *,
.portraits-hero > *,
.drr-ai-landing > *,
.drr-maker-hero > *,
.page-hero > *,
.projects-hero > *,
.drr-stage7x-hero > * {
  position: relative;
  z-index: 1;
}

.hero-v2 h1,
.portraits-hero h1,
.drr-ai-landing h1,
.drr-maker-hero h1,
.page-hero h1,
.projects-hero h1 {
  color: #fff !important;
  letter-spacing: -0.035em !important;
  line-height: 1.03 !important;
  text-wrap: balance;
}

.hero-v2 p,
.portraits-hero p,
.drr-ai-landing p,
.drr-maker-hero p,
.page-hero p,
.projects-hero p {
  color: rgba(246,242,233,.78) !important;
  max-width: 760px;
}

.drr-hero-actions,
.cta-container,
.hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  align-items: center !important;
}

.drr-hero-action,
.cta-btn,
.btn-shell,
.drr-stage8l-btn,
.project-card-actions a,
.product-card a,
.card a,
.drr-card a[class*="btn"],
button,
input[type="submit"] {
  border-radius: 999px !important;
}

.drr-hero-action--primary,
.cta-primary,
.btn-shell--primary,
input[type="submit"],
button[type="submit"] {
  background: linear-gradient(135deg, #f1d16f 0%, #d5a63a 55%, #a8781d 100%) !important;
  color: #101010 !important;
  border: 0 !important;
  box-shadow: 0 15px 38px rgba(217,184,90,.22) !important;
}

.drr-hero-action--ghost,
.cta-secondary,
.btn-shell--ghost {
  border: 1px solid rgba(217,184,90,.42) !important;
  color: var(--drr-gold) !important;
  background: rgba(6,17,18,.36) !important;
}

/* ---------- CARDS / GRIDS ---------- */
.drr-audience-card,
.cat-card-v2,
.drr-home-service,
.drr-realization-card,
.drr-trust-card,
.drr-opinion,
.project-card,
.product-card,
.project-category-card,
.seo-category-card,
.seo-static-card,
.tool-card-home,
.tool-card,
.generator-card,
.calculator-card,
.drr-card,
.card,
.drr-seo-card,
.drr-p2-trust__card,
.benefit-card,
.uses-card,
.drr-maker-card,
.drr-ai-landing__card,
.dd-ai-card,
.kubek-card,
.drr-stage7x-card,
.contact-location-card {
  background:
    linear-gradient(180deg, rgba(15, 40, 42, .88), rgba(8, 23, 24, .88)) !important;
  border: 1px solid rgba(217,184,90,.18) !important;
  border-radius: var(--drr-radius-md) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.26) !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
}

.drr-audience-card:hover,
.cat-card-v2:hover,
.drr-home-service:hover,
.drr-realization-card:hover,
.drr-trust-card:hover,
.project-card:hover,
.product-card:hover,
.project-category-card:hover,
.tool-card-home:hover,
.card:hover,
.drr-card:hover,
.benefit-card:hover,
.drr-maker-card:hover,
.drr-ai-landing__card:hover,
.kubek-card:hover,
.drr-stage7x-card:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(217,184,90,.38) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.34), 0 0 0 1px rgba(20,199,189,.06) inset !important;
}

.project-card-thumb,
.product-card img,
.kubek-card img,
.drr-realization-card img,
.cat-card-v2 img,
.card img,
.drr-card img {
  border-radius: 14px !important;
  overflow: hidden !important;
}

section {
  scroll-margin-top: 140px;
}

main > section,
main .drr-stage8l-shell,
main .categories-v2,
main .drr-home-services,
main .drr-realizations,
main .tools-strip-home,
main .drr-seo-section,
main .drr-stage7x-section,
main .portraits-benefits,
main .portraits-faq,
main .portraits-form-section {
  width: var(--drr-container) !important;
  max-width: var(--drr-container) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

h1, h2, h3 {
  text-wrap: balance;
}

h2 {
  letter-spacing: -0.02em !important;
}

p, li, summary, label, input, textarea, select {
  font-feature-settings: "kern" 1;
}

/* Forms */
input, textarea, select {
  border-radius: 14px !important;
  border: 1px solid rgba(217,184,90,.20) !important;
  background: rgba(4, 15, 16, .66) !important;
  color: var(--drr-text) !important;
}

input:focus, textarea:focus, select:focus {
  outline: 2px solid rgba(20,199,189,.35) !important;
  border-color: rgba(20,199,189,.48) !important;
}

/* ---------- MOBILE ---------- */
@media (max-width: 1180px) {
  .site-header-v2 .header-v2-inner {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    text-align: center !important;
  }

  .site-header-v2 .search-container {
    justify-self: center !important;
    width: min(100%, 620px) !important;
  }

  .site-header-v2 .user-actions {
    justify-content: center !important;
    flex-wrap: wrap !important;
  }
}

@media (max-width: 760px) {
  :root {
    --drr-container: min(100% - 26px, 1180px);
  }

  .top-bar .container {
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  .top-bar-item {
    font-size: 11px !important;
  }

  .site-header-v2 {
    padding: 10px 0 !important;
  }

  .site-header-v2 .brand img {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
  }

  .site-header-v2 .user-actions .action-item {
    min-width: auto !important;
    height: 42px !important;
    padding: 7px 10px !important;
    font-size: 10px !important;
  }

  .main-nav-v2 .nav-v2-list,
  .main-nav-v2 .nav-v2-list--rich,
  .main-nav-v2 .drr-nav-stage7w__list {
    justify-content: flex-start !important;
    gap: 6px !important;
  }

  .main-nav-v2 .nav-v2-list > li > a,
  .main-nav-v2 .drr-nav-stage7w__trigger,
  .main-nav-v2 .drr-nav-stage7w__list > li > a {
    font-size: 12px !important;
    min-height: 34px !important;
    padding: 8px 10px !important;
  }

  .main-nav-v2 .drr-nav-stage7w__dropdown {
    position: static !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 6px 0 8px !important;
  }

  .main-nav-v2 .drr-nav-stage7w__dropdown::before {
    display: none !important;
  }

  .hero-v2,
  .portraits-hero,
  .drr-ai-landing,
  .drr-maker-hero,
  .page-hero,
  .projects-hero,
  .drr-stage7x-hero {
    padding: 28px 18px !important;
    border-radius: 20px !important;
  }

  .drr-hero-actions,
  .cta-container,
  .hero-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .drr-hero-action,
  .cta-btn,
  .btn-shell {
    width: 100% !important;
    justify-content: center !important;
  }
}

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