/* ---------------------------------------------------------------------------
   Aadharshila Dream Homes — small additions on top of Tailwind (CDN).
   Only things Tailwind utilities cannot express inline live here.
   ------------------------------------------------------------------------ */

:root {
  --maroon: #841818;
  --maroon-dark: #5e1010;
  --brand-red: #ed1b24;
  --sun: #f5811e;
  --cream: #faf7f2;
  --navy: #1f3b63;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

/* Keep the sticky header from covering in-page anchor targets. */
[id] {
  scroll-margin-top: 6rem;
}

/* Visible, on-brand focus ring for keyboard users. */
:focus-visible {
  outline: 2px solid var(--sun);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Hero band: maroon gradient echoing the logo's deep red. */
.hero-band {
  background:
    radial-gradient(1100px 420px at 12% -10%, rgba(237, 27, 36, 0.42), transparent 60%),
    radial-gradient(760px 360px at 92% 8%, rgba(245, 129, 30, 0.30), transparent 62%),
    linear-gradient(135deg, #5e1010 0%, #841818 52%, #a5292b 100%);
}

/* Subtle diagonal texture used behind the "Why choose us" band. */
.pattern-soft {
  background-color: var(--cream);
  background-image:
    repeating-linear-gradient(45deg, rgba(132, 24, 24, 0.045) 0 1px, transparent 1px 11px);
}

/* Horizontal thumbnail strip in the property gallery. */
.thumb-strip {
  scrollbar-width: thin;
  scrollbar-color: var(--sun) transparent;
}
.thumb-strip::-webkit-scrollbar {
  height: 6px;
}
.thumb-strip::-webkit-scrollbar-track {
  background: transparent;
}
.thumb-strip::-webkit-scrollbar-thumb {
  background: var(--sun);
  border-radius: 999px;
}

/* Clamp long descriptions in list views. */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Long descriptions entered in the admin panel keep their paragraph breaks. */
.prose-brand p {
  margin-bottom: 1rem;
  line-height: 1.75;
}
.prose-brand p:last-child {
  margin-bottom: 0;
}

/* Google Maps iframe fills its rounded container. */
.map-frame {
  width: 100%;
  height: 100%;
  min-height: 320px;
  border: 0;
  display: block;
}

/* iOS Safari zooms the whole page in whenever a focused form control has a
   font smaller than 16px, which then leaves the visitor scrolled sideways.
   Keep the desktop type scale, but bump controls to 16px on phones. */
/* !important is needed because the fields carry Tailwind's .text-sm utility,
   and a class selector otherwise outranks these element selectors. */
@media (max-width: 767px) {
  input:not([type='checkbox']):not([type='radio']):not([type='file']),
  select,
  textarea {
    font-size: 16px !important;
  }
}

/* Print: drop the chrome so a property page prints as a clean sheet. */
@media print {
  header,
  footer,
  .no-print {
    display: none !important;
  }
  body {
    background: #fff;
  }
}

/* Respect a user's reduced-motion preference. */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}