/* Shared visual language for the three public marketing pages. */
:root {
  --bg: #f5f5f4;
  --paper: #f7f7f6;
  --surface: #fff;
  --ink: #202529;
  --muted: #5c6166;
  --deep: #282d31;
  --deep-2: #202529;
  --deep-dark: #171a1d;
  --line: #dedfe0;
  --wine: #a43a30;
  --danger: #a43a30;
  --page-bg: #f6f6f5;
  --page-surface: #fff;
  --page-line: #dedfe0;
  --cta-primary: linear-gradient(125deg, #b94735, #932d27 64%, #b74735);
  --cta-calc: linear-gradient(125deg, #b94735, #932d27 64%, #b74735);
  --gradient-portfolio: linear-gradient(125deg, #45494b, #282c2f);
  --cta: var(--cta-primary);
  --call: var(--gradient-portfolio);
}

:root[data-daypart="morning"] { --page-bg: #f7f6f4; --page-surface: #fff; --page-line: #e1dfdc; }
:root[data-daypart="day"] { --page-bg: #f6f6f5; --page-surface: #fff; --page-line: #dedfe0; }
:root[data-daypart="evening"] { --page-bg: #f6f4f4; --page-surface: #fff; --page-line: #e1dcdd; }
:root[data-daypart="night"] { --page-bg: #f2f3f4; --page-surface: #fcfcfd; --page-line: #dbdde0; }

html { background: var(--page-bg); }
body { letter-spacing: 0; }
/* Clip wide decoration without creating a second scroll container for sticky headers. */
.page-park2 { overflow-x: clip; overflow-y: visible; }
.eyebrow { letter-spacing: 0; font-weight: 650; }
.topbar {
  background: rgba(250, 249, 247, .97);
  border-color: #e2e1df;
  box-shadow: 0 4px 20px rgba(0, 0, 0, .07);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}
.main-brand, .page-park2 .brand { color: #19242b; font-weight: 800; }
.page-main .topbar-inner, .page-park2 .topbar-inner {
  grid-template-columns: minmax(0, 1fr) auto minmax(360px, 430px);
  gap: 24px;
}
.site-header-phone {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  color: #19242b;
  font-size: 15px;
  font-weight: 650;
  white-space: nowrap;
  text-decoration: none;
}
.site-header-phone svg { width: 18px; height: 18px; }
.site-mobile-cta { display: none; }

.page-main .top-actions a, .page-park2 .quick-actions a {
  min-height: 40px;
  border: 1px solid #d8d6d3;
  border-radius: 8px;
  color: #252b30;
  background: linear-gradient(135deg, #fff, #f1f0ee);
  box-shadow: inset 0 1px 0 #fff, 0 3px 9px rgba(0, 0, 0, .06);
  font-size: 13px;
  font-weight: 600;
  animation: none;
}
.page-main .top-actions .top-contact, .page-park2 .quick-actions .call {
  background: var(--cta-primary);
  border-color: #c76755;
  color: #fff;
}
.page-main .top-actions .max, .page-park2 .quick-actions a[href*="t.me"] {
  background: var(--gradient-portfolio);
  color: #fff;
  border-color: #5c6062;
}
.page-main .top-actions a::before, .page-park2 .quick-actions a::after { display: none; }

.page-main .hero {
  min-height: 0;
  isolation: isolate;
  background: #292a28;
}
/* Sharpen only the photograph; overlays and text retain their original rendering. */
.page-main .hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: url('/assets/optimized/main-hero.webp') center 48% / cover no-repeat;
  filter: url('#hero-photo-detail') contrast(1.08) saturate(1.04);
}
.page-main .hero-inner { z-index: 2; min-height: 0; padding-top: 64px; padding-bottom: 72px; }
.page-main .hero-layout { row-gap: 18px; align-items: start; }
.page-main #hero-title { font-size: 64px; }
.page-main .brand-subtitle { font-size: 34px; }
.page-main .hero-kicker { font-size: 12px; margin-bottom: 12px; }
.page-main .hero-phone-row { margin: 12px 0 14px; }
.page-main .hero-tags { margin: 16px 0 18px; }
.page-main .hero-offer {
  grid-template-columns: minmax(0, 1fr);
  width: min(100%, 360px);
  gap: 8px;
  margin: 20px 0 18px;
}
.page-main .hero-price, .page-main .hero-postpay {
  min-height: 48px;
  padding: 6px 12px;
}
.page-main .hero-metrics { padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .24); }
.page-main .hero::before {
  z-index: 1;
  background: linear-gradient(0deg, rgba(0, 0, 0, .35), transparent 55%),
    linear-gradient(96deg, rgba(0, 0, 0, .68), rgba(0, 0, 0, .28) 50%, rgba(0, 0, 0, .06));
}
.page-park2 .hero { min-height: 560px; }
.page-park2 .hero::before {
  background: linear-gradient(90deg, rgba(0, 0, 0, .76), rgba(0, 0, 0, .45) 48%, rgba(0, 0, 0, .18)),
    url('/assets/optimized/park2-hero.webp') center top / cover no-repeat;
}
.page-main .hero-tags span {
  color: #fff;
  border-color: rgba(255, 255, 255, .4);
  background: rgba(25, 27, 29, .68);
  font-weight: 600;
  text-shadow: none;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.page-main .metric {
  text-shadow: 0 1px 4px rgba(0, 0, 0, .65);
  min-height: 0;
  padding: 0 14px;
  background: transparent;
  border: 0;
  border-left: 1px solid rgba(255, 255, 255, .22);
  border-radius: 0;
  box-shadow: none;
}
.page-main .metric:first-child { border-left: 0; padding-left: 0; }
.page-main .metric strong { color: #f3d4a2; font-size: 28px; font-weight: 700; }
.page-main .metric span { font-size: 12px; font-weight: 450; }
.page-main .hero-kicker, .page-main .brand-subtitle { letter-spacing: 0; }
.page-main .brand-subtitle { text-shadow: 0 2px 10px rgba(0, 0, 0, .18); }
.hero-price, .hero-postpay {
  background: linear-gradient(125deg, rgba(255, 255, 255, .97), rgba(240, 239, 235, .95));
  border-color: rgba(255, 255, 255, .6);
  border-left-color: #c2614b;
  box-shadow: inset 0 1px 0 #fff, 0 6px 20px rgba(0, 0, 0, .16);
  color: #252a2d;
}
.hero-offer strong { color: #963329; font-weight: 750; }
.hero-offer span { font-weight: 600; }

.page-main .button, .page-main .section-cta, .page-park2 .cta,
.page-portfolio .contact-actions .action {
  border: 1px solid #d67c65;
  border-radius: 14px;
  background: var(--cta-primary);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 7px 18px rgba(0, 0, 0, .14);
  font-weight: 600;
  text-shadow: none;
  letter-spacing: 0;
  animation: none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.page-main .button::before, .page-main .section-cta::before,
.page-park2 .cta::before, .page-portfolio .contact-actions .action::before {
  inset: 0;
  width: auto;
  opacity: 1;
  background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .12) 48%, transparent 66%);
  transform: translateX(-125%);
  animation: site-action-shine 8s ease-in-out infinite;
  pointer-events: none;
}
.page-main .hero-actions .button::after, .page-park2 .cta::after { content: none; }
.page-main .button.portfolio-button, .page-park2 .hero .cta.portfolio {
  border-color: rgba(255, 255, 255, .65);
  background: linear-gradient(125deg, rgba(48, 51, 50, .78), rgba(70, 72, 65, .58));
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.page-main .portfolio-preview-footer .section-cta, .page-park2 .cta.portfolio,
.page-portfolio .contact-actions .action.call {
  background: var(--gradient-portfolio);
  border-color: #75797b;
}
.page-main .hero-actions { max-width: 780px; }
.page-main .hero-actions .button {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 20px;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 20px;
  text-align: left;
  white-space: normal;
}
.cta-icon { width: 40px; height: 40px; padding: 8px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 50%; }
.cta-arrow { width: 20px; height: 20px; }
.cta-copy { display: grid; gap: 4px; min-width: 0; }
.page-main .hero-actions .button span { font-size: 15px; line-height: 1.3; font-weight: 650; }
.page-main .hero-actions .button small { min-height: 30px; white-space: normal; font-size: 12px; line-height: 1.35; font-weight: 400; color: #f1edeb; }

.page-main .portfolio-preview-section, .page-main .terms-section {
  min-height: 0;
  display: block;
  padding: 48px 0;
  background: var(--page-bg);
  border-color: var(--page-line);
}
.page-main .terms-section { background: var(--page-surface); }
.portfolio-preview-head h2, .terms-head h2, .page-portfolio .catalog h2 { font-weight: 750; }
.terms-head h2 span {
  color: #a64635;
  background: linear-gradient(110deg, #ac4735, #755249 60%, #42494d);
  background-clip: text;
  -webkit-background-clip: text;
}
.term-card p { color: #555d62; }
.term-number { color: #a43a30; }
.terms-postpay, .page-park2 .section.dark, .page-portfolio .contact-band {
  background: linear-gradient(125deg, #303438, #1c1f22);
  color: #fff;
}
.terms-postpay { border-left-color: #c2614b; }
.terms-flow li::before {
  background: linear-gradient(135deg, #b84c39, #88302a);
  border-color: #da8975;
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 4px 12px rgba(0, 0, 0, .2);
}
.terms-flow li:not(:last-child)::after { color: #d49b85; }
.terms-documents a { color: #963329; font-weight: 600; }
.preview-project, .page-portfolio .project-card {
  background: #fff;
  border-color: #dedfe0;
  box-shadow: 0 6px 20px rgba(25, 28, 31, .07);
}
.preview-project::before { display: none; }
.preview-image::after, .page-portfolio .project-number { background: rgba(25, 28, 31, .75); }
.preview-copy h3, .page-portfolio .project-copy h3 { color: #252b30; font-weight: 700; }
.preview-copy span, .page-portfolio .project-subtitle { color: #60666b; font-weight: 450; }
.page-portfolio .project-media::after { background: transparent; }
.page-portfolio .project-open-label { font-weight: 600; }
.page-portfolio .project-open-label::after { background: #a43a30; box-shadow: none; }
.page-portfolio .filter[aria-pressed="true"], .page-portfolio .filter:hover { background: #303438; box-shadow: 0 3px 9px rgba(0, 0, 0, .12); }
.page-portfolio dialog, .page-portfolio dialog::backdrop { background: #121416; }
.page-portfolio .contact-inner h2 { font-weight: 750; }
.page-park2 .system-strip { background: #eaecee; border-left-color: #ba614d; color: #333a3f; }
.page-park2 .rule-card, .page-park2 .mechanism-card, .page-park2 .park-card { border-color: #dedfe0; box-shadow: 0 6px 20px rgba(25, 28, 31, .06); }
.page-park2 .rule-card b { background: #f4e8e5; color: #963329; border-radius: 6px; font-weight: 650; }
.page-park2 .rule-card strong { color: #252b30; font-weight: 700; text-transform: none; line-height: 1.3; }
.page-park2 .mechanism-card::before { height: 3px; background: #b95844; }
.page-park2 .mechanism-card p strong { font-weight: 750; }
.page-park2 .price-band strong { color: #a43a30; font-weight: 750; }
.page-park2 .steps span { background: #f2f3f4; font-weight: 550; }
.page-park2 .postpay .section-lead, .page-park2 .dark .section-lead { color: #e2e3e4; }
.page-park2 .postpay .terms-flow { border-color: #505458; }
.site-footer { background: #171a1d; border-color: #484446; color: #e5e5e5; }
.site-footer__contacts a { color: #e5e5e5; }
.site-footer__brand span { color: #d8c2a4; }
.site-footer__trust p { color: #c2c5c7; }
.site-footer__legal { color: #aeb3b7; border-color: #3d4247; }

@keyframes site-action-shine {
  0%, 65% { transform: translateX(-125%); }
  90%, 100% { transform: translateX(125%); }
}
@media (hover: hover) {
  .page-main .button:hover, .page-main .section-cta:hover, .page-park2 .cta:hover, .page-portfolio .contact-actions .action:hover {
    transform: translateY(-2px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 12px 24px rgba(0, 0, 0, .2);
  }
}
@media (max-width: 1100px) {
  .site-header-phone { display: none; }
  .page-main .topbar-inner, .page-park2 .topbar-inner { grid-template-columns: minmax(0, 1fr) minmax(360px, 430px); gap: 14px; }
}
@media (min-width: 1001px) and (max-height: 820px) {
  .page-main .hero-inner { padding-top: 48px; padding-bottom: 56px; }
  .page-main #hero-title { font-size: 56px; }
  .page-main .brand-subtitle { font-size: 30px; }
  .page-main .hero-phone-row { margin: 6px 0 10px; }
  .page-main .hero-tags { margin: 10px 0 14px; }
}
@media (max-width: 700px), (orientation: landscape) and (max-height: 500px) and (max-width: 1000px) {
  .page-main .topbar, .page-park2 .topbar { position: sticky; top: 0; overflow: visible; }
  .page-main .topbar-inner, .page-park2 .topbar-inner {
    width: calc(100% - var(--mobile-left) - var(--mobile-right));
    margin-left: var(--mobile-left);
    margin-right: var(--mobile-right);
    padding: 6px 0;
    min-height: 66px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0 10px;
  }
  .page-main .main-brand, .page-park2 .brand { grid-column: 1; grid-row: 1; justify-self: start; align-self: end; font-size: 13px; }
  .page-main .top-actions, .page-park2 .quick-actions { display: none; }
  .site-header-phone { display: inline-flex; grid-column: 1; grid-row: 2; min-height: 28px; gap: 6px; font-size: 12px; }
  .site-header-phone svg { width: 13px; height: 13px; }
  .site-mobile-cta {
    grid-column: 2;
    grid-row: 1 / 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid #c76755;
    border-radius: 8px;
    background: var(--cta-primary);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 4px 10px rgba(112, 32, 25, .18);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    text-decoration: none;
  }
  .site-mobile-cta svg { width: 16px; height: 16px; flex: 0 0 auto; }
  .page-main .hero-actions .button { min-height: 66px; grid-template-columns: 32px minmax(0, 1fr) 16px; gap: 10px; padding: 10px 12px; border-radius: 18px; }
  .page-main .hero-inner { padding-top: 28px; padding-bottom: 44px; }
  .page-park2 .hero { min-height: 0; }
  .page-main .portfolio-preview-section, .page-main .terms-section { padding: 32px 0; }
  .page-main #hero-title { font-size: 44px; }
  .page-main .brand-subtitle { font-size: 26px; }
  .page-main .hero-kicker { font-size: 10.5px; margin-bottom: 10px; }
  .page-main .hero-phone-row { margin: 8px 0 10px; }
  .page-main .hero-tags { margin: 12px 0 16px; }
  .page-main .hero-offer { width: min(100%, 300px); gap: 7px; margin: 16px 0 14px; }
  .page-main .hero-price, .page-main .hero-postpay { min-height: 40px; padding: 6px 10px; }
  .page-main .hero-metrics { gap: 14px 10px; }
  .page-main .metric { padding: 0 8px; }
  .page-main .metric strong { font-size: 22px; }
  .page-main .metric span { font-size: 11px; }
  .page-main .hero-actions .button span { font-size: 13px; }
  .page-main .hero-actions .button small { min-height: 28px; font-size: 10.5px; line-height: 1.3; }
  .cta-icon { width: 32px; height: 32px; padding: 6px; }
  .cta-arrow { width: 16px; height: 16px; }
  .page-main .hero-tags span { font-weight: 600; }
  .page-main .hero { background-position: center, center 48%; }
  .page-main .section-cta, .page-park2 .cta { max-width: 100%; font-size: 13px; }
}
@media (max-width: 350px) {
  .page-main .main-brand, .page-park2 .brand { font-size: 12px; }
  .site-mobile-cta { padding: 10px 8px; gap: 5px; font-size: 11px; }
}
@media (orientation: landscape) and (max-height: 500px) and (min-width: 500px) and (max-width: 1000px) {
  .page-main .topbar-inner, .page-park2 .topbar-inner { min-height: 56px; grid-template-columns: minmax(0, 1fr) auto auto; gap: 14px; }
  .page-main .main-brand, .page-park2 .brand { align-self: center; }
  .site-header-phone { grid-column: 2; grid-row: 1; min-height: 44px; }
  .site-mobile-cta { grid-column: 3; grid-row: 1; }
  .page-main .hero-phone-row, .page-main .hero-tags { margin: 0; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media (forced-colors: active) {
  .terms-head h2 span { background: none; -webkit-text-fill-color: currentColor; }
}

/* The arrow occupies the free space between the label and the next circle. */
@media (min-width: 641px) {
  .terms-flow { gap: 0; }
  .terms-flow li { grid-template-columns: 44px minmax(0, max-content) minmax(36px, 1fr); gap: 0; }
  .terms-flow li:last-child { grid-template-columns: 44px minmax(0, 1fr); }
  .payment-step-text { padding-left: 12px; }
  .terms-flow li:not(:last-child)::after { position: static; transform: none; display: grid; place-items: center; width: auto; }
}
.page-park2 .complex-title { display: block; }
.page-park2 .nowrap-title { white-space: nowrap; }
@media (max-width: 350px) {
  .page-park2 h1 { font-size: 22px; }
}
@media (orientation: landscape) and (max-height: 500px) and (max-width: 700px) {
  .page-park2 h1 { font-size: 20px; }
}
.page-park2 #portfolio { background: #fff; }
.page-park2 #park2 { background: #e9edf0; border-top: 1px solid #dce1e5; }
.page-park2 #postpay { background: #f8f9fa; color: #252b30; border-top: 1px solid #dce1e5; }
.page-park2 #postpay .postpay, .page-park2 #postpay .terms-flow li { color: #252b30; }
.page-park2 #postpay .postpay-kicker { color: #a43a30; }
.page-park2 #postpay .section-lead { color: #50585e; }
.page-park2 #postpay .terms-flow { border-color: #d6dce0; }
.page-park2 #postpay .terms-flow li::after { color: #a43a30; }
.page-park2 .hero-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; max-width: 780px; gap: 14px; }
.page-park2 .hero-actions .portfolio-contact { grid-template-columns: 40px minmax(0, 1fr) 20px; gap: 12px; border-radius: 20px; padding: 14px 16px; }
.page-park2 .hero-actions .portfolio-contact__icon { width: 40px; height: 40px; }
.page-portfolio .contact-inner, .page-park2 .contact-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) 350px; gap: 32px; align-items: center;
  width: min(1180px, calc(100% - 48px)); margin-inline: auto;
}
.page-portfolio .contact-inner { padding: 64px 0; }
.page-portfolio .contact-inner h2 { font-size: 40px; line-height: 1.15; letter-spacing: 0; }
.page-portfolio .contact-inner p, .page-park2 #contact .section-lead { font-size: 16px; line-height: 1.5; color: #e2e3e4; }
.page-portfolio .contact-actions, .page-park2 .contact-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.contact-next-sentence { display: block; margin-top: 8px; }
@media (min-width: 1200px) { .contact-next-sentence { white-space: nowrap; } }
@media (max-width: 800px) {
  .page-portfolio .contact-inner, .page-park2 .contact-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .page-portfolio .contact-inner { padding: 36px 0; }
  .page-portfolio .contact-inner h2 { font-size: 28px; }
  .page-portfolio .contact-actions, .page-park2 .contact-actions { max-width: 380px; width: 100%; }
}
@media (max-width: 700px), (orientation: landscape) and (max-height: 500px) and (max-width: 1000px) {
  .page-park2 .hero-actions { grid-template-columns: minmax(0, 1fr); }
  .page-park2 .hero-actions .portfolio-contact { min-height: 66px; grid-template-columns: 32px minmax(0, 1fr) 16px; gap: 10px; padding: 10px 12px; border-radius: 18px; }
  .page-park2 .hero-actions .portfolio-contact__icon { width: 32px; height: 32px; }
  .page-park2 .hero-actions .portfolio-contact__copy strong { font-size: 13px; }
  .page-park2 .hero-actions .portfolio-contact__copy > span { font-size: 11px; }
}