*, *::before, *::after { box-sizing: border-box; }
.wrap { width: auto; max-width: var(--max-w); margin-inline: var(--gutter); }
.site-header { position: sticky; top: 0; z-index: 20; background: var(--c-bg); }
.header-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 4px 10px; max-width: var(--max-w); margin-inline: var(--gutter); min-height: 64px; padding-block: 8px; }
.wordmark { grid-column: 1; }
.header-inner > .lang-switch { grid-column: 2; }
.menu-toggle { grid-column: 3; }
.wordmark { display: inline-flex; flex-direction: column; justify-content: center; align-items: stretch; width: fit-content; max-width: 100%; min-height: 44px; color: var(--c-ink); font-family: "Libre Baskerville", Georgia, serif; font-weight: 700; font-size: 1.35rem; line-height: 1.05; text-decoration: none; }
.deed-rule { display: block; background: var(--c-accent); }
.deed-rule--wordmark { height: 2px; margin-top: 4px; }
.deed-rule--hero { height: 8px; width: 100%; margin-top: 12px; transform-origin: left top; }
.deed-rule--contact { height: 8px; width: 8rem; max-width: 100%; margin-top: 12px; }
.desktop-nav { display: none; }
.desktop-nav a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding-inline: 2px; color: var(--c-ink); font-size: var(--fs-0); text-decoration: none; }
.desktop-nav a:hover { color: var(--c-accent); }
.lang-switch { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; }
.header-inner > .lang-switch { margin-inline-start: 0; justify-content: flex-end; }
.lang-switch a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 6px 2px 4px; border-bottom: 2px solid transparent; color: var(--c-muted); font-size: var(--fs-0); text-decoration: none; }
.lang-switch a[aria-current="true"] { color: var(--c-ink); border-bottom-color: var(--c-accent); }
.lang-switch a:hover { color: var(--c-ink); }
.menu-toggle { margin-inline-start: 4px; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; border: 1px solid var(--c-line); border-radius: var(--r-sm); background: transparent; color: var(--c-ink); }
.icon-button:hover { background: var(--c-tint); }
.icon { width: 24px; height: 24px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 20px; border: 1.5px solid var(--c-accent); border-radius: var(--r-md); background: var(--c-accent); color: var(--c-accent-ink); font: 600 var(--fs-0)/1.3 var(--font-body); text-align: center; text-decoration: none; }
.button:hover { background: #D4B23A; border-color: #D4B23A; color: var(--c-accent-ink); }
.button.secondary { background: transparent; color: var(--c-ink); }
.button.secondary:hover { background: var(--c-tint); border-color: var(--c-accent); color: var(--c-ink); }
a.header-cta { display: none; }

.hero { display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; }
.hero-copy { padding: var(--s-8) var(--gutter) var(--s-6); }
.kicker { margin: 0 0 12px; color: var(--c-muted); font-size: var(--fs-0); font-weight: 600; letter-spacing: 0; }
.hero-subline { margin: 20px 0 0; max-width: 38rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.fact-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 0; padding: 0; list-style: none; }
.fact-chips li { padding: 6px 10px; border: 1px solid var(--c-line); border-radius: var(--r-sm); background: var(--c-tint); color: var(--c-ink); font-size: var(--fs-0); }
.hero-figure picture { display: block; background: var(--c-tint); }
.hero-figure img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: center; }
@media (max-width: 768px) {
  .hero-figure img { aspect-ratio: 4 / 5; }
}

.section { padding-block: var(--s-16); }
.about-section { background: var(--c-surface); }
.about-grid, .contact-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-8); }
.about-grid > *, .contact-grid > * { min-width: 0; }
.prose { margin-top: 20px; max-width: 65ch; }
.prose p { margin: 0; }
.prose p + p { margin-top: 16px; }
.about-figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-sm); background: var(--c-tint); }
.highlights { display: grid; gap: 12px; margin: 28px 0 0; }
.highlights > div { padding: 16px; border: 1px solid var(--c-line); border-radius: var(--r-sm); background: var(--c-tint); }
.highlights dt { color: var(--c-muted); font-size: var(--fs-0); }
.highlights dd { margin: 6px 0 0; font-weight: 600; overflow-wrap: anywhere; }

.services-section { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
.section-intro { max-width: 40rem; color: var(--c-muted); }
.section-intro p { margin: 12px 0 0; }
.service-list { max-width: 40rem; margin: 8px 0 0; padding: 0; list-style: none; }
.service-list li { padding-block: 24px; border-bottom: 2px solid var(--c-line); }
.service-list h3 { font-size: var(--fs-2); }
.service-list p { margin: 8px 0 0; padding-inline-start: var(--s-4); color: var(--c-muted); }
html[data-lang="si"] .service-list li,
html[data-lang="ta"] .service-list li { padding-block: calc(24px + var(--s-2)); }
.services-note { margin: 16px 0 0; color: var(--c-muted); font-size: var(--fs-0); }

.gallery-section h2 + p, .gallery-intro { max-width: 62ch; margin-top: 16px; color: var(--c-muted); }
.gallery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 28px 0 0; padding: 0; list-style: none; }
.gallery-button { position: relative; display: block; width: 100%; padding: 0; border: 0; border-radius: var(--r-sm); overflow: hidden; background: var(--c-tint); color: inherit; cursor: pointer; text-align: start; }
.gallery-button img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.sample-badge { position: absolute; bottom: 8px; left: 8px; max-width: calc(100% - 16px); padding: 3px 6px; border-radius: var(--r-sm); background: rgb(14 26 43 / .88); color: var(--c-ink); font-family: var(--font-body); font-size: 11px; font-weight: 500; line-height: 1.3; pointer-events: none; }

.contact-intro { max-width: 46ch; margin-top: 16px; color: var(--c-muted); }
.contact-details { margin: 24px 0 0; }
.contact-details > div, .hours > div { padding-block: 12px; border-bottom: 1px solid var(--c-line); }
.contact-details dt, .hours dt { color: var(--c-muted); font-size: var(--fs-0); }
.contact-details dd, .hours dd { margin: 4px 0 0; }
.contact-details a, .maps-link { display: inline-flex; align-items: center; min-height: 44px; overflow-wrap: anywhere; }
.phone-numbers { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.hours { margin-top: 8px; }
.hours-label { margin-top: 24px; font-size: var(--fs-1); }
.map-card { display: flex; flex-direction: column; justify-content: flex-end; gap: 12px; width: 100%; aspect-ratio: 4 / 3; min-width: 0; padding: 24px; border: 1px solid var(--c-line); border-radius: var(--r-md); background: var(--c-surface); color: var(--c-ink); text-decoration: none; }
.map-card > * { min-width: 0; }
.map-card-label { display: block; max-width: 100%; font-family: var(--font-display); font-size: var(--fs-2); font-weight: 700; line-height: var(--lh-heading); overflow-wrap: anywhere; }
html[data-lang="si"] .map-card-label, html[data-lang="ta"] .map-card-label { font-weight: 600; }
.map-card-action { color: var(--c-accent); font-weight: 600; }
.map-card:hover { background: var(--c-tint); }
.map-card:hover .map-card-action { color: var(--c-ink); }

.site-footer { padding-block: 40px calc(40px + var(--sticky-cta-h)); }
.footer-top, .footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; }
.footer-top { align-items: center; padding-bottom: 20px; }
.footer-tagline, .footer-bottom, .preview-notice { color: var(--c-muted); font-size: var(--fs-0); }
.footer-bottom { border-top: 1px solid var(--c-line); padding-block: 20px; }
.social-link { display: inline-flex; align-items: center; min-height: 44px; }
.preview-notice { border-top: 1px solid var(--c-line); padding-top: 16px; }
.preview-notice p { margin: 0; max-width: 70ch; }
.offer-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 8px; }
.offer-link[hidden] { display: none; }

.sticky-cta { position: fixed; z-index: 25; right: 0; bottom: 0; left: 0; padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); background: var(--c-bg); border-top: 1px solid var(--c-line); }
.sticky-cta .button { width: 100%; }
body:has(dialog[open]) { overflow: hidden; }
body:has(dialog[open]) .sticky-cta { visibility: hidden; }

section[id] { scroll-margin-top: calc(var(--header-h, 64px) + 12px); }
dialog { padding: 0; border: 0; color: var(--c-ink); background: var(--c-surface); box-shadow: var(--shadow-1); overscroll-behavior: contain; }
dialog::backdrop { background: rgb(14 26 43 / .72); }
.drawer { width: min(100%, 420px); height: 100dvh; max-height: 100%; margin: 0 0 0 auto; padding: 20px var(--gutter) max(24px, env(safe-area-inset-bottom)); overflow-y: auto; }
.drawer-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.drawer-nav { display: grid; gap: 4px; padding-block: 20px; }
.drawer-nav a { display: flex; align-items: center; min-height: 48px; border-bottom: 1px solid var(--c-line); color: var(--c-ink); text-decoration: none; }
.drawer .lang-switch { margin: 0 0 20px; }
.drawer .button { width: 100%; }
.lightbox { width: min(960px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); margin: auto; overflow: auto; border-radius: var(--r-md); }
.viewer-toolbar, .viewer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; }
.viewer-image { background: var(--c-bg); }
.viewer-image img { width: 100%; max-height: min(62dvh, 640px); object-fit: contain; background: var(--c-bg); }
#viewer-caption { margin: 0; max-width: 62ch; }
.viewer-controls { display: flex; align-items: center; gap: 8px; }
.viewer-count { min-width: 4ch; color: var(--c-muted); font-variant-numeric: tabular-nums; text-align: center; }
.image-unavailable { position: relative; min-height: 120px; background: var(--c-tint); }
.image-unavailable img { visibility: hidden; }
.image-unavailable::after { content: attr(data-fallback-label); position: absolute; inset: 0; display: grid; place-items: center; padding: 16px; color: var(--c-muted); text-align: center; }

@media (prefers-reduced-motion: no-preference) {
  .hero-copy { animation: hero-fade 520ms var(--ease) both; }
  .deed-rule--hero { animation: deed-thicken 520ms var(--ease) both; }
}
@keyframes hero-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes deed-thicken { from { transform: scaleY(0.25); } to { transform: scaleY(1); } }

@media (max-width: 359px) {
  .header-inner { grid-template-columns: minmax(0, 1fr) auto; }
  .header-inner > .lang-switch { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; }
  .menu-toggle { grid-column: 2; grid-row: 1; }
}
@media (min-width: 768px) {
  .about-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 48px; }
  .highlights { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .section { padding-block: var(--s-24); }
}
@media (min-width: 1024px) {
  .header-inner { display: flex; flex-wrap: nowrap; align-items: center; gap: 16px; height: 64px; min-height: 64px; padding-block: 0; }
  .desktop-nav { display: flex; flex-wrap: nowrap; gap: 4px 16px; }
  a.header-cta { display: inline-flex; white-space: nowrap; }
  .menu-toggle { display: none; }
  .header-inner > .lang-switch { margin-inline-start: 0; }
  .hero { grid-template-columns: minmax(18rem, 32rem) minmax(0, 1fr); min-height: 78vh; padding-inline-start: max(var(--gutter), calc((100% - var(--max-w)) / 2)); }
  .hero-copy { max-width: 32rem; padding: 6rem 2rem 6rem 0; }
  .hero-figure { height: 100%; min-height: 78vh; }
  .hero-figure picture { height: 100%; }
  .hero-figure img { height: 100%; min-height: 78vh; aspect-ratio: auto; }
  .gallery-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .contact-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 48px; }
  .sticky-cta { display: none; }
  :root { --sticky-cta-h: 0px; }
}