/*
Theme Name: Icicles
Theme URI: https://iciclescreamroll.com
Author: Icicles
Description: Custom theme for Icicles rolled ice cream — handcrafted rolled ice cream, Bay Area & Sacramento. Faithful conversion of the seven-page static design into a WordPress theme with a shared header/footer and one template per page. Fonts: Fraunces + Karla. Signature pastel gradient header, six-color stripe footer, circular photo crops.
Version: 2.7.0
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: icicles
*/

/* ---------- Base (was the first <style> block on every page) ---------- */
body{margin:0;background:#FDFCFF;-webkit-font-smoothing:antialiased}
a{color:#4B3F72;text-decoration:none}
a:hover{color:#A99AD8}
@keyframes panspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.pan-ring{animation:none !important}}

/* Fallback body typography (mirrors the inline wrapper on each page so the
   design still holds if the wrapper div is ever missing) */
body{font-family:'Karla',Helvetica,Arial,sans-serif;color:#4B3F72;font-size:17px;line-height:1.65}

/* ---------- Hover helpers ----------
   In the static export each page defined its own .h0–.h5 rules, and the SAME
   class name meant different things on different pages. To avoid collisions in
   one shared stylesheet, every page-specific rule below is namespaced by the
   body class that functions.php adds (ic-home, ic-menu, ic-catering, …).
   .h0 and .h1 were identical on every page, so they stay global. */

.h0:hover{color:#A99AD8}
.h1:hover{color:#FFFFFF;transform:translateY(-2px)}

/* Shared footer links — on every page in the export the footer link hover
   resolved to the same pale yellow, so it is one global rule here. */
.ic-foot:hover{color:#FCEFC0}

/* Footer social icons */
.ic-social{display:inline-flex;opacity:.9;transition:opacity .15s ease, transform .15s ease}
.ic-social:hover{opacity:1;transform:translateY(-2px)}

/* Home "Find us" grid: 2 per row on phones, an even 4 per row on desktop. */
.ic-find-grid{grid-template-columns:repeat(2,1fr)}
@media (min-width:760px){.ic-find-grid{grid-template-columns:repeat(4,1fr)}}

/* Locations page store cards: 2 per row on phones, 4 per row on desktop. */
.ic-loc-grid{grid-template-columns:repeat(2,1fr)}
@media (min-width:820px){.ic-loc-grid{grid-template-columns:repeat(4,1fr)}}

/* Floating eGift-card button, on every page. */
.ic-gift-fab{
  position:fixed;right:18px;bottom:18px;z-index:9999;
  display:inline-flex;align-items:center;gap:9px;
  background:#4B3F72;color:#FFFFFF !important;
  font-family:'Karla',Helvetica,Arial,sans-serif;font-weight:700;font-size:13px;
  letter-spacing:.09em;text-transform:uppercase;
  padding:14px 22px;border-radius:100px;
  box-shadow:0 8px 22px rgba(75,63,114,.38);
  transition:transform .18s ease, box-shadow .18s ease;
  animation:ic-fab-in .5s ease both, ic-fab-pulse 2.8s ease-in-out 1.2s 3;
}
.ic-gift-fab:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(75,63,114,.45);color:#FFFFFF !important}
@keyframes ic-fab-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes ic-fab-pulse{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media (max-width:520px){.ic-gift-fab{right:12px;bottom:12px;padding:12px 18px;font-size:12px}}
@media (prefers-reduced-motion:reduce){.ic-gift-fab{animation:none}}

/* Home (front-page.php) */
.ic-home .h2:hover{background:#DCD5EF;color:#2F6296;transform:translateY(-2px)}
.ic-home .h3:hover{background:#DCD5EF;transform:translateY(-2px)}
.ic-home .h4:hover{background:#CFE2F3;transform:translateY(-2px)}
.ic-home .h5:hover{color:#FCEFC0}

/* Menu */
.ic-menu .h2:hover{color:#FCEFC0}

/* Catering */
.ic-catering .h2:hover{background:#DCD5EF;transform:translateY(-2px)}
.ic-catering .h3:hover{color:#2F6296}
.ic-catering .h4:hover{color:#FCEFC0}

/* Fundraising */
.ic-fundraising .h2:hover{transform:translateY(-2px)}
.ic-fundraising .h3:hover{color:#2F6296}
.ic-fundraising .h4:hover{color:#FCEFC0}

/* Locations */
.ic-locations .h2:hover{border-color:#A99AD8}
.ic-locations .h3:hover{background:#DCD5EF;transform:translateY(-2px)}
.ic-locations .h4:hover{color:#FCEFC0}

/* About */
.ic-about .h2:hover{background:#DCD5EF;transform:translateY(-2px)}
.ic-about .h3:hover{color:#FCEFC0}

/* FAQ */
.ic-faq .h2:hover{background:#DCD5EF;transform:translateY(-2px)}
.ic-faq .h3:hover{color:#FCEFC0}