/* Landing-page conversion and accessibility refinements. */
:root { --muted: #62625c; }
html { scroll-padding-top: 24px; }
body { overflow-wrap: break-word; }
em { color: #67675f; }
.skip-link { position: fixed; top: 12px; left: 16px; z-index: 20; padding: 14px 20px; background: var(--ink); color: white; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid #676000; outline-offset: 5px; }
main:focus { outline: none; }
.topbar nav a, .nav-link, .underlined, .button { font-size: 12px; }
.topbar nav a, .nav-link { display: inline-flex; align-items: center; min-height: 44px; }
.topbar nav { gap: 24px; }
.eyebrow { font-size: 11px; }
.hero { gap: 56px; align-items: center; min-height: 0; padding: 64px 0 72px; }
.hero h1 { font-size: clamp(40px, 4.4vw, 60px); line-height: 1.06; letter-spacing: -.065em; }
.hero .lead { max-width: 450px; font-size: 16px; line-height: 1.7; margin: 24px 0 28px; }
.hero .lead strong { color: var(--ink); white-space: nowrap; }
.hero .actions { gap: 20px; }
.hero .underlined { display: inline-flex; align-items: center; min-height: 44px; }
.hero .trust { font-size: 12px; line-height: 1.7; color: #62625c; margin: 24px 0 0; }
.hero-visual { position: relative; margin: 0; min-width: 0; background: #e8e0d3; }
.hero-visual > img { display: block; width: 100%; height: 440px; object-fit: cover; object-position: 52% center; }
.hero-visual figcaption { display: grid; gap: 8px; background: var(--yellow); padding: 22px 24px; }
.hero-visual figcaption > span { font: 11px 'DM Mono', monospace; letter-spacing: .06em; }
.hero-visual figcaption strong { font-size: 21px; line-height: 1.3; letter-spacing: -.04em; }
.hero-visual figcaption a { justify-self: start; display: inline-flex; gap: 18px; align-items: center; min-height: 44px; color: var(--ink); font-size: 13px; text-underline-offset: 5px; }
.package > p { font-size: 14px; }
.package small, .package-list li { color: #595952; }
.package .price { margin-top: auto; }
.package-select { margin-top: 22px; width: 100%; background: var(--ink); color: white; text-align: center; }
.package-select:hover { background: #444; }
.package.featured .package-select { color: var(--ink); background: var(--yellow); }
.package.featured .package-select:hover { background: #e1b911; }
.section-title > p:last-child, .contact p:not(.eyebrow) { font-size: 16px; }
.rules li { font-size: 14px; }
.about > div:last-child > p:not(.eyebrow) { font-size: 16px; color: #c3c2b9; }
.about em { color: #c3c2b9; }
.about .eyebrow { color: #b5b4aa; }
.contact label { color: #595952; font-size: 12px; line-height: 1.5; }
.contact input, .contact select { min-height: 48px; font-size: 16px; }
.contact input::placeholder { color: #686861; opacity: 1; }
.contact .form-hint { margin: 0; max-width: none; font: 13px/1.6 Manrope, Arial, sans-serif; color: #595952; }
.contact .form-status { margin: 0; max-width: none; font: 14px/1.6 Manrope, Arial, sans-serif; color: #595952; }
.form-status:empty { display: none; }
.contact button:disabled { cursor: wait; opacity: .65; }
.contact .city-option { min-height: 44px; margin-top: 0; font-size: 16px; }
.city-options { scroll-margin: 16px; }
.carousel-dots button { min-height: 44px; }
.carousel { padding-bottom: 50px; }
.footer p, .footer .social-link { font-size: 12px; line-height: 1.6; }
.footer .social-link { min-height: 44px; }
@media (min-width: 801px) and (max-width: 1100px) {
  .hero { gap: 28px; }
  .hero h1 { font-size: 44px; }
  .hero-visual > img { height: 420px; }
  .package { padding: 20px; }
  .package-head { flex-wrap: wrap; gap: 8px; }
  .rules, .about, .contact { gap: 48px; }
}
@media (max-width: 800px) {
  .hero { padding: 40px 0 48px; gap: 32px; }
  .hero h1 { font-size: clamp(36px, 7vw, 52px); }
  .hero .lead { margin-top: 20px; }
  .hero .trust { margin-top: 20px; }
  .hero-visual > img { height: auto; aspect-ratio: 4 / 3; }
  .hero-visual figcaption { padding: 20px; }
  .nav-link { max-width: 165px; text-align: right; line-height: 1.5; }
  .logo img { max-width: 128px; height: auto; }
  .package-select { width: 100%; }
  /* Keep the floating WhatsApp clear of the copyright without a blank bottom band. */
  .footer p { padding-right: 64px; }
  .whatsapp { right: 16px; bottom: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .carousel .projects, .carousel .project, .project img, .whatsapp { transition: none; }
  .project:hover img, .carousel .project.active { transform: none; }
}
@media (max-width: 400px) {
  .carousel { padding-bottom: 94px; }
  .carousel::before, .carousel::after { bottom: 94px; }
  .carousel-dots { flex-wrap: wrap; }
  .carousel-button { top: calc((100% - 94px) / 2 - 18px); }
}