/* Folya hero: one clear product hierarchy — editor, brand card, contact card. */
.hero-product { isolation: isolate; min-height: 600px; }
.hero-product .hero-halo { z-index: 0; top: -16px; right: -5%; width: 91%; height: 104%; border-radius: 49% 51% 50% 47%; background: #fbefc1; transform: none; }
.hero-product .admin-preview { z-index: 1; top: 18px; right: 0; width: 630px; height: 452px; border-color: #e4e4e2; border-radius: 14px; box-shadow: 0 18px 42px rgba(26, 29, 34, .08); }
.hero-product .share-card { z-index: 3; top: 270px; left: 45%; width: 252px; min-height: 320px; padding: 17px; border-radius: 15px; box-shadow: 0 18px 35px rgba(21, 29, 39, .13); transform: rotate(6deg); }
.hero-product .share-card .avatar.portrait { width: 68px; height: 68px; margin: 16px auto 10px; border-width: 5px; }
.hero-product .share-card > strong { font-size: 16px; }
.hero-product .share-card > small { margin-top: 2px; }
.hero-product .share-card .contact-lines { gap: 5px; margin: 15px 0 12px; }
.hero-product .share-card .save-contact { padding: 8px 6px; }
.hero-product .share-card .card-actions { display: none; }
.hero-product .brand-card { z-index: 2; top: 160px; left: 3%; width: 275px; height: 438px; padding: 24px; border-radius: 16px; box-shadow: 0 24px 38px rgba(68, 58, 25, .16); transform: rotate(-8deg); }
.hero-product .brand-card-head { font-size: 29px; }
.hero-product .brand-card p { max-width: 180px; margin-top: 112px; font-size: 33px; }
.hero-product .brand-card > small { font-size: 10px; }
.hero-product .brand-card-avatar { top: 65px; right: 24px; width: 78px; height: 78px; border-width: 5px; }
.hero-product .brand-card-footer { bottom: 21px; left: 24px; }
.hero-product .mini-qr { width: 50px; height: 50px; }

@media (max-width: 1120px) {
  .hero-product { min-height: 555px; }
  .hero-product .admin-preview { right: -18%; transform: scale(.9); transform-origin: top right; }
  .hero-product .brand-card { top: 146px; left: 1%; transform: scale(.87) rotate(-8deg); transform-origin: top left; }
  .hero-product .share-card { top: 248px; left: 43%; transform: scale(.86) rotate(6deg); transform-origin: top left; }
}

@media (max-width: 820px) {
  .hero-product { min-height: 560px; }
  .hero-product .admin-preview { top: 5px; right: -9%; transform: scale(.78); transform-origin: top right; }
  .hero-product .brand-card { top: 130px; left: 6%; transform: scale(.82) rotate(-8deg); }
  .hero-product .share-card { top: 250px; left: 48%; transform: scale(.8) rotate(6deg); }
}

@media (max-width: 560px) {
  .hero-product { min-height: 690px; margin-right: 0; margin-left: 0; }
  .hero-product .hero-halo { top: 20px; right: -14%; width: 112%; height: 570px; }
  .hero-product .admin-preview { display: none; }
  .hero-product .brand-card { top: 28px; left: calc(50% - 112px); transform: scale(.8) rotate(-8deg); }
  .hero-product .share-card { top: 420px; left: calc(50% - 103px); transform: scale(.8) rotate(6deg); }
}

/* The public homepage uses the same quiet product language as the portal.
   Nothing in the hero is clipped: the yellow brand card remains the focal
   point and the product editor sits behind it as context, not decoration. */
.site-header { background: #fff; color: #101114; border-bottom: 1px solid #e7e8eb; }
.site-nav { color: #4f535c; font-weight: 700; }
.site-nav a:hover, .login-link:hover { color: #101114; }
.header-cta { background: #101114; color: #fff; border-radius: 12px; }
.header-cta:hover { background: #2a2d34; }

@media (min-width: 1121px) {
  .hero { grid-template-columns: minmax(380px, .84fr) minmax(0, 1.16fr); min-height: 650px; gap: 20px; padding-top: 92px; padding-bottom: 62px; }
  .hero h1 { max-width: 530px; font-size: clamp(60px, 5.4vw, 82px); line-height: .93; }
  .hero-copy > p { margin-bottom: 25px; }
  .hero-proof { margin-top: 30px; }
  .hero-product { min-width: 0; min-height: 490px; transform: scale(.88); transform-origin: top left; }
  .hero-product .hero-halo { top: 30px; right: 4%; width: 560px; height: 420px; opacity: .78; }
  .hero-product .share-card { z-index: 3; top: 42px; left: 0; width: 236px; min-height: 408px; transform: rotate(-2deg); }
  .hero-product .brand-card { z-index: 4; top: 58px; left: 252px; width: 246px; height: 390px; transform: rotate(4deg); }
  .hero-product .brand-card p { margin-top: 90px; font-size: 31px; }
  .hero-product .brand-card-avatar { top: 55px; right: 21px; width: 74px; height: 74px; }
  .hero-product .admin-preview { z-index: 1; top: 48px; right: 0; width: 610px; height: 435px; transform: scale(.67); transform-origin: top right; }
}

@media (min-width: 721px) and (max-width: 1120px) {
  .site-header { padding: 0 34px; }
  .hero { width: calc(100% - 68px); grid-template-columns: minmax(360px, .9fr) minmax(0, 1.1fr); min-height: 600px; gap: 6px; padding: 76px 0 48px; }
  .hero h1 { font-size: clamp(54px, 5.4vw, 68px); }
  .hero-product { min-width: 0; transform: scale(.70); transform-origin: top left; }
  .hero-product .hero-halo { right: 0; }
  .hero-product .share-card { left: 0; }
  .hero-product .brand-card { left: 252px; }
}

@media (max-width: 560px) {
  .site-header { padding: 0 18px; }
  .header-cta { background: #101114; color: #fff; }
}