/* ── Global responsive safety net (all portfolio pages) ───────────────── */
*,*::before,*::after{box-sizing:border-box;}
html,body{max-width:100%;overflow-x:clip;}
img,svg,video,canvas{max-width:100%;}

@media (max-width:600px){
  /* collapse any inline multi-column grid to a single column */
  [style*="grid-template-columns:repeat"],
  [style*="grid-template-columns: repeat"]{grid-template-columns:1fr !important;}
  /* nowrap text must never force horizontal scroll on phones */
  [style*="white-space:nowrap"]{white-space:normal !important;}
  img,svg,video{height:auto !important;}
  /* fluid side padding for big inline-padded sections */
  [style*="padding:0 40px"],[style*="padding: 0 40px"]{padding-left:20px !important;padding-right:20px !important;}
}


/* ── Mobile header: solid so hero content never bleeds through the fixed bar ── */
@media (max-width:960px){
  header{
    background:#FBF0DF !important;
    -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
    box-shadow:0 6px 20px rgba(58,10,36,.12) !important;
    border-bottom:1px solid rgba(176,130,44,.25) !important;
  }
  .thdr-mainbar{ height:58px !important; }
  /* decorative scroll cue overlaps content on short mobile heroes — hide it */
  .hero-scroll-hint{ display:none !important; }
}


/* ── Icons must always be visible (draw animation could get stuck hidden on re-render) ── */
.ricon *{ stroke-dashoffset:0 !important; stroke-dasharray:none !important; animation:none !important; }


/* ── Mobile layout polish: stack content cards & forms to one column ── */
@media (max-width:600px){
  /* 2-col grids the repeat-rule missed (contact form name/mobile, etc.) -> 1 col */
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"]{ grid-template-columns:1fr !important; }
  /* form controls always full width */
  input:not([type=checkbox]):not([type=radio]), select, textarea{ width:100% !important; max-width:100% !important; }
  /* seva list rows -> clean stacked card (name on top, timing/price/Book below) */
  .seva-row{ flex-direction:column !important; align-items:stretch !important; gap:10px !important; }
  .seva-row > div:last-child{ width:100% !important; justify-content:space-between !important; }
}
/* header always solid + above hero content on mobile (no bleed-through on dark heroes) */
@media (max-width:960px){
  header{ background:#FBF0DF !important; z-index:1000 !important; }
}

/* ── Gallery nav dropdown ── */
.nav-dd{position:relative;display:inline-block;}
.nav-dd-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);min-width:176px;background:#FFFBF2;border:1px solid rgba(176,130,44,.3);border-radius:9px;box-shadow:0 14px 34px rgba(58,10,36,.18);padding:6px;opacity:0;visibility:hidden;transition:opacity .2s,transform .2s;z-index:600;}
.nav-dd-menu::before{content:'';position:absolute;top:-10px;left:0;right:0;height:10px;}
.nav-dd:hover .nav-dd-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.nav-dd-menu .dd-item{display:block;padding:9px 14px;border-radius:6px;font-family:'DM Sans',sans-serif;font-size:13px;color:#4A2830;text-decoration:none;white-space:nowrap;}
.nav-dd-menu .dd-item:hover{background:rgba(176,130,44,.1);color:#5C1640;}
.nav-dd-caret{font-size:9px;opacity:.6;margin-left:3px;}
/* ── Footer social icons ── */
.footer-social{display:flex;gap:10px;margin-top:22px;}
.soc-ic{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;border:1px solid rgba(232,199,122,.32);color:#E8C77A;transition:background .2s,border-color .2s,transform .2s;}
.soc-ic svg{width:15px;height:15px;fill:currentColor;}
.soc-ic:hover{background:rgba(232,199,122,.15);border-color:#E8C77A;transform:translateY(-2px);}

/* MOBILE image reveal safety — never leave hero/statues/gopuram hidden behind a JS reveal */
@media (max-width: 768px) {
  #devi-hero-img, #asura-img, #nandi-img, #gopuram-img, #about-gopuram, #about-devi {
    opacity: 1 !important; clip-path: none !important; -webkit-clip-path: none !important; transform: none !important;
  }
  #gopuram-reveal { display: none !important; }
}