/* The Aussie Sharmas — shared custom styles (on top of Tailwind CDN) */

body {
  background-color: #fbf9f8;
  color: #1b1c1c;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

/* Nav links (keeps page markup clean) */
.nav-link { font-size: 16px; line-height: 1.6; color: #444748; transition: color .3s; }
.nav-link:hover, .nav-link:focus-visible { color: #8a6d00; }
.nav-link[aria-current="page"] { color: #8a6d00; }

.mobile-nav-link { display: block; padding: 12px 0; font-size: 16px; color: #444748; transition: color .3s; }
.mobile-nav-link:hover, .mobile-nav-link:focus-visible { color: #8a6d00; }

/* Placeholder image treatment — these are TEMPORARY scaffolding stand-ins.
   Every one must be replaced with a real, candid Glen Eira family photo before launch. */
.placeholder-img { position: relative; }
.placeholder-img::after {
  content: "Placeholder — replace with real photo";
  position: absolute; top: 8px; left: 8px;
  font-family: Inter, sans-serif; font-size: 10px; letter-spacing: .1em; text-transform: uppercase;
  background: rgba(27,28,28,.6); color: #fff; padding: 3px 8px; border-radius: 9999px;
  pointer-events: none;
}

/* Scroll-reveal */
.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .9s ease, transform .9s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

/* Temporary photo-editor UI (removed when photos are final) */
.placeholder-img.has-image::after { display: none; }
.img-edit-btn {
  position: absolute; bottom: 10px; right: 10px; z-index: 30;
  background: #8a6d00; color: #fff; border: none;
  font: 600 12px/1 Inter, sans-serif; letter-spacing: .08em; text-transform: uppercase;
  padding: 9px 14px; border-radius: 9999px; cursor: pointer;
  box-shadow: 0 2px 10px rgba(0,0,0,.35);
}
.img-edit-btn:hover { background: #5c4900; }
.img-edit-btn:disabled { opacity: .7; cursor: default; }
.img-edit-flash {
  position: absolute; inset: 0; z-index: 35; display: flex; align-items: center; justify-content: center;
  background: rgba(138,109,0,.85); color: #fff; font: 600 16px Inter, sans-serif; letter-spacing: .05em;
}
.edit-banner {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 100;
  background: #1b1c1c; color: #fff; text-align: center; padding: 12px 16px;
  font: 400 13px/1.5 Inter, sans-serif;
}
.edit-banner strong { color: #e9c349; }
.edit-banner a { color: #e9c349; text-decoration: underline; margin-left: 8px; }

/* Accessible focus + reduced motion */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid #8a6d00; outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .animate-bounce { animation: none; }
}