/* Base */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color: #1a1a1a;
  background: #fff;
  line-height: 1.6;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
.container { width: min(1100px, 92%); margin: 0 auto; }

/* Header */
.site-header {
  background: #f26522;
  color: #fff;
  position: sticky;
  top: 0;
  z-index: 1000;
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.6rem 0;
}
.brand img { display: block; max-height: 44px; }

/* Nav */
.nav-toggle { display: none; background: none; border: 0; padding: .5rem; cursor: pointer; }
.nav-toggle .bar { display: block; width: 26px; height: 3px; background: #fff; margin: 5px 0; }

.site-nav ul { list-style: none; display: flex; gap: 1rem; margin: 0; padding: 0; }
.site-nav a { padding: .6rem .8rem; border-radius: 6px; font-weight: 600; }
.site-nav a:hover, .site-nav a.active { background: rgba(255,255,255,.18); }

/* Mobile nav */
@media (max-width: 768px) {
  .nav-toggle { display: inline-block; }
  .site-nav {
    position: fixed; inset: 0 0 0 30%;
    background: #f26522;
    transform: translateX(100%);
    transition: transform .35s ease;
    padding-top: 5rem;
  }
  .site-nav.open { transform: translateX(0); }
  .site-nav ul { flex-direction: column; padding-left: 1rem; }
  body.no-scroll { overflow: hidden; }
}

/* Main sections */
.hero { padding: clamp(2rem, 5vw, 4rem) 0; text-align: center; }
.hero .cta {
  display: inline-block; margin-top: 1rem; background: #0b8f3e; color: #fff;
  padding: .75rem 1.25rem; border-radius: 999px; font-weight: 700;
  transition: transform .2s ease, opacity .2s ease;
}
.hero .cta:hover { transform: translateY(-1px); opacity: .95; }
.page { padding: 2rem 0; }

/* Footer */
.site-footer { background: #072224; color: #d7e2e3; position: relative; padding-top: 2rem; }
.site-footer h4 { margin: 0 0 .6rem; color: #fff; }
.footer-grid {
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: clamp(1rem, 2.5vw, 2rem); padding-bottom: 1rem;
}
.footer-links { list-style: none; margin: 0; padding: 0; }
.footer-links li { margin: .3rem 0; }
.footer-links a { color: #d7e2e3; }
.footer-links a:hover { color: #fff; text-decoration: underline; }
.copyright { border-top: 1px solid rgba(255,255,255,.12); padding: .8rem 0 2.8rem; font-size: .9rem; text-align: center; }

/* Stack footer on mobile */
@media (max-width: 768px) {
  .footer-grid { grid-template-columns: 1fr; }
}

/* Floating buttons */
.fab {
  position: fixed; right: 1rem; bottom: 1rem; width: 54px; height: 54px;
  border-radius: 50%; display: grid; place-items: center;
  background: #25D366; box-shadow: 0 8px 22px rgba(0,0,0,.25);
  transition: transform .2s ease, opacity .2s ease; z-index: 1100;
}
.fab img { filter: invert(1); }
.fab:hover { transform: translateY(-2px); }
.fab:active { transform: translateY(0); }

.fab-top { background: #0b8f3e; bottom: 5.2rem; opacity: 0; pointer-events: none; }
.fab-top.show { opacity: 1; pointer-events: auto; }

/* Focus styles */
a:focus, button:focus { outline: 3px solid rgba(255,255,255,.6); outline-offset: 2px; }


/* Page hero + breadcrumb */
.page-hero { background: #f6f7f8; border-top: 4px solid #f26522; padding: 1.5rem 0; }
.page-hero h1 { margin: 0 0 .25rem; text-align: center; }
.breadcrumb { text-align: center; font-size: .95rem; color: #6b6b6b; }
.breadcrumb a { color: inherit; text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }
.breadcrumb span { margin: 0 .35rem; }

/* Two-column layout */
.page.two-col { display: grid; grid-template-columns: 3fr 1.2fr; gap: 1.5rem; }
.page.two-col .content { background: #fff; padding: 1rem 1.25rem; border: 1px solid #e6e6e6; border-radius: 8px; }
.sidebar .widget { background: #fff; border: 1px solid #e6e6e6; border-radius: 8px; padding: 1rem; margin-bottom: 1rem; }
.sidebar .widget h3 { margin-top: 0; font-size: 1.05rem; }
.sidebar ul { list-style: none; padding: 0; margin: 0; }
.sidebar li { padding: .35rem 0; }
.sidebar a { color: #2b2b2b; }
.sidebar a:hover { text-decoration: underline; }
.muted { color: #8a8a8a; }

/* Sidebar search */
.search-box { display: grid; grid-template-columns: 1fr auto; gap: .5rem; margin-bottom: 1rem; }
.search-box input { border: 1px solid #dadada; border-radius: 6px; padding: .6rem .7rem; }
.search-box button { border: 0; padding: .6rem .9rem; border-radius: 6px; background: #f26522; color: #fff; cursor: pointer; }
.search-box button:hover { filter: brightness(0.95); }

/* Mobile stacking */
@media (max-width: 900px) {
  .page.two-col { grid-template-columns: 1fr; }
}

/* ========== Home hero ========== */
.home-hero {
  position: relative;
 
    /* saffron–green overlay with transparency */
    /* linear-gradient(90deg, rgba(243, 156, 18, 0.5), rgba(46, 125, 50, 0.45)), */
 
  background-size: cover;
  background-position: center;
  min-height: clamp(250px, 38vw, 420px);
  border-top: 4px solid #f26522;
  display: grid;
  place-content: center;
  text-align: center;
  color: #24aa94;
}

/* subtle motion */
@keyframes fadeInHero {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.home-hero__overlay {
  padding: 1rem;
  animation: fadeInHero 1s ease-out forwards;
}

.home-hero__title {
  color:  #2e7d32 !important;
  margin: 0 0 .5rem;
  font-weight: 900;
  letter-spacing: 1px;
  font-size: clamp(1.8rem, 5vw, 3rem);
  text-shadow: 0 3px 8px rgba(0, 0, 0, 0.35);
}

.home-hero__phones {
  color: black;
  margin: 0;
  font-size: clamp(1rem, 2.5vw, 1.2rem);
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}


@keyframes heroPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.02); }
}

 :root {
  --saffron: #f39c12;
  --green: #2e7d32;
  --wa: #25d366;
  --bg: #fff;
  --ink: #111;
  --muted: #666;
}

/* Layout */
.shop-ways {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(18px, 2.5vw, 32px);
  margin: 2rem auto;
  max-width: 1200px;
  padding: 0 1rem;
}

/* Card base */
.shop-card {
  background: var(--bg);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.05);
  border: 1px solid #eaeaea;
  transition: all 0.25s ease;
  cursor: pointer;
  display: flex;
  flex-direction: column;
}
.shop-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.1);
}

/* Image */
.shop-card img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  border-bottom: 1px solid #eee;
}

/* Content */
.shop-card__body {
  text-align: center;
  padding: 1rem 1rem 1.5rem;
}
.shop-card__body h3 {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 0.5rem;
}
.shop-card__body p {
  color: var(--muted);
  line-height: 1.5;
  margin: 0 0 0.5rem;
}
.shop-card__body small {
  color: #7ca;
  font-size: 0.9rem;
  display: block;
  margin-bottom: 1rem;
}

/* Buttons */
.btn {
  border: none;
  padding: 10px 18px;
  border-radius: 999px;
  font-weight: 700;
  cursor: pointer;
  font-size: 0.95rem;
}
.btn-primary {
  background: var(--green);
  color: #fff;
}
.btn-accent {
  background: var(--saffron);
  color: #fff;
}
.btn-wa {
  background: var(--wa);
  color: #fff;
}
.btn:hover {
  opacity: 0.9;
  transform: scale(1.03);
}

/* Responsive */
@media (max-width: 980px) {
  .shop-ways {
    grid-template-columns: 1fr;
  }
  .shop-card img {
    height: 200px;
  }
}


/* Soft blinking for the hero title */
.home-hero__title {
  color:#fff;                      /* keep solid white text */
  text-shadow: 0 2px 10px rgba(0,0,0,.35);
  /* animation: blinkFade 1.2s ease-in-out infinite; */
}

@keyframes blinkFade {
  0%, 100% { opacity: 1 }
  50%      { opacity: .35 }        /* how “blinky” it feels */
}

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce){
  .home-hero__title { animation: none }
}

/* ===== CONTACT PAGE BRAND STYLING ===== */
.page-hero {
  background: linear-gradient(90deg, #f39c12 0%, #2e7d32 100%);
  color: #fff;
  padding: 2rem 1rem;
  border-bottom: 3px solid #e2e2e2;
}
.page-hero h1 {
  margin: 0;
  font-weight: 800;
  font-size: 2rem;
}
.page-hero .breadcrumb {
  margin-top: .5rem;
  font-size: .95rem;
  color: #fff;
}
.page-hero .breadcrumb a {
  color: #fff;
  text-decoration: underline;
}

/* Two-column layout from About page */
.page.two-col {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 2rem;
  margin-top: 2rem;
}
@media (max-width: 900px) {
  .page.two-col { grid-template-columns: 1fr; }
}
/* === Contact page split layout (50/50) === */
.contact-split{
  display:grid;
  grid-template-columns: 1fr 1fr; /* exact half + half */
  gap: clamp(16px, 2.5vw, 32px);
  margin: 2rem 0;
}

/* Card look shared by form and map */
.contact-card{
  background:#fff;
  border:1px solid #eee;
  border-radius:12px;
  box-shadow:0 6px 16px rgba(0,0,0,.06);
  padding: clamp(16px, 2vw, 24px);
}
.contact-card h2{
  margin:0 0 .5rem;
  color:#2e7d32;
}
.muted{ color:#667; margin:0 0 1rem; }

/* Form fields */
.contact-card label{ display:block; margin:.8rem 0 .35rem; font-weight:600; color:#333; }
.contact-card input,
.contact-card textarea{
  width:100%; padding:.65rem .8rem; border:1px solid #ccc; border-radius:8px;
  font:inherit; transition:border-color .2s, box-shadow .2s;
}
.contact-card input:focus,
.contact-card textarea:focus{
  border-color:#2e7d32; outline:none; box-shadow:0 0 0 3px rgba(46,125,50,.15);
}
.btn.primary{
  margin-top:1rem; background:#2e7d32; color:#fff; border:none; padding:.7rem 1.6rem;
  border-radius:999px; font-weight:700; cursor:pointer; transition:background .25s, transform .2s;
}
.btn.primary:hover{ background:#f39c12; transform:translateY(-2px); }

/* Map box */
.map-box iframe{
  width:100%; height:420px; border:0; border-radius:10px;
}

/* Stack on mobile */
@media (max-width: 900px){
  .contact-split{ grid-template-columns: 1fr; }
  .map-box iframe{ height:340px; }
}

.fab-whatsapp img { filter:none; }

/* Shop Rotator (unchanged basics) */
.shopline{
  display:block; text-align:center; text-decoration:none; color:#111;
  font-weight:900; letter-spacing:.4px; font-size:clamp(1.2rem,3.6vw,1.9rem);
  margin:8px auto 14px;
}
.shopline__inner{ display:inline-flex; align-items:baseline; gap:.5rem; will-change:transform,opacity; }
.shopline__icon{ width:1.15em; height:1.15em; object-fit:contain; order:2; }
.shopline.left{ text-align:left; }
.shopline.disabled{ cursor:default; pointer-events:none; text-decoration:none; }

/* Roll animations (now used for EVERY slide transition) */
.shopline.roll-out #shop-rotator-inner{ animation: rollOut .32s ease both; }
.shopline.roll-in  #shop-rotator-inner{ animation: rollIn  .32s ease both; }
@keyframes rollOut{ from{transform:translateY(0);opacity:1} to{transform:translateY(-65%);opacity:0} }
@keyframes rollIn { from{transform:translateY(65%);opacity:0}  to{transform:translateY(0);opacity:1} }

/* Typewriter for the intro line */
.shopline__text.typing::after{
  content:"▌"; margin-left:2px; animation: caret .9s steps(1) infinite;
}
@keyframes caret{ 50%{opacity:0} }

@media (prefers-reduced-motion:reduce){
  .shopline #shop-rotator-inner{ animation:none !important; }
  .shopline__text.typing::after{ animation:none }
}


/* === Premium “Shop” Rotator === */
@import url('https://fonts.googleapis.com/css2?family=SF+Pro+Display:wght@400;600;700;900&display=swap');

.shopline {
  display: block;
  text-align: center;
  text-decoration: none;
  color: #111;
  font-family: 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-weight: 700;
  letter-spacing: 0.2px;
  font-size: clamp(1rem, 3vw, 1.4rem); /* small enough for mobile */
  margin: 1rem auto;
  line-height: 1.4;
  user-select: none;
}

.shopline__inner {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  will-change: transform, opacity;
}

.shopline__icon {
  width: 1.1em;
  height: 1.1em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Typewriter Intro */
.shopline__text.typing::after {
  content: "▌";
  margin-left: 3px;
  animation: caretBlink 0.8s steps(1) infinite;
}
@keyframes caretBlink { 50% { opacity: 0; } }

/* Roll Animation for CTAs */
.shopline.roll-out #shop-rotator-inner { animation: rollOut 0.32s ease both; }
.shopline.roll-in #shop-rotator-inner  { animation: rollIn  0.32s ease both; }
@keyframes rollOut {
  from { transform: translateY(0); opacity: 1; }
  to   { transform: translateY(-65%); opacity: 0; }
}
@keyframes rollIn {
  from { transform: translateY(65%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

/* Links and hover */
.shopline.disabled { cursor: default; pointer-events: none; }
.shopline:hover:not(.disabled) { opacity: 0.9; transition: opacity 0.2s ease; }

/* Responsive */
@media (max-width: 600px) {
  .shopline { font-size: 1rem; }
}

/* Emoji-style icon sizing & alignment */
.shopline__icon{
  /* keep icon on the right of text */
  order: 2;

  /* make it text-sized and crisp */
  display:inline-block;
  font-size: 1.1em;     /* slightly larger than text */
  line-height: 1;
  width: auto;          /* not a fixed box */
  height: auto;

  /* align baseline nicely with text */
  vertical-align: -0.12em;
  margin-left: .35rem;
}


 
 
/* container + spacing */
.socials {
  display: flex;
  gap: 10px;                 /* space between icons */
  align-items: center;
}

/* circle buttons */
.socials a {
  width: 27px;      /* was 40px */
  height: 27px;     /* was 40px */
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #fff;               /* icon color on colored bg */
  transition: transform .1s ease, filter .1s ease;
}

.socials a i { font-size: 13px; }

/* brand colors */
.socials a.facebook  { background:#1877F2; }
.socials a.instagram { 
  background: radial-gradient(circle at 30% 107%,
    #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}
.socials a.whatsapp  { background:#25D366; }
.socials a.youtube   { background:#FF0000; }
.socials a.x         { background:#000000; }
.socials a.linkedin  { background:#0A66C2; }
.socials a.google    { background:#4285F4; }

/* hover */
.socials a:hover { filter: brightness(0.9); transform: translateY(-1px); }



.offer-banner {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #cf2e1a;
  padding: 10px 0;
}

.offer-banner img {
  width: 92vw;      /* small screens: almost full width */
  max-width: 520px; /* cap on very small desktops too */
  height: auto;
  display: block;
  border: 0;
}

@media (min-width: 768px) {
  .offer-banner img { max-width: 700px; }   /* tablets */
}

@media (min-width: 1024px) {
  .offer-banner img { max-width: 820px; }   /* desktops */
}



.container.page { max-width: 1100px; margin: 24px auto; padding: 0 16px; }
.breadcrumbs { font-size: .9rem; margin-bottom: 12px; opacity: .8; }
.grid { display: grid; gap: 16px; }
.grid.roles { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.grid.testimonials { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.card { background: #fff; border-radius: 12px; padding: 16px 18px; box-shadow: 0 4px 12px rgba(0,0,0,.06); }
.link-list { line-height: 2; }

/* ===============================
   GRAMIQ — Category Belt + Offer
   Tweakable variables
=================================*/
:root{
  --belt-height: 68px;
  --scroll-duration: 35s;          /* speed of category scroll (lower = faster) */
  --cat-font-min: .78rem;
  --cat-font-max: .9rem;
  --cat-icon: 32px;
  --cat-pad-x: 22px;               /* space so divider never hits text */
  --divider-color: rgba(0,0,0,.14);
  --divider-shadow: rgba(0,0,0,.05);

  --offer-font-min: 1.4rem;
  --offer-font-max: 2rem;          /* offer text size */
  --offer-bg-1: #fff8e6;           /* soft cream */
  --offer-bg-2: #ffeec7;           /* soft warm */
  --offer-glow: rgba(214,146,0,.55);
}

/* ===============================
   Belt container
=================================*/
.grq-cat-offer-belt{
  position: relative;
  overflow: hidden;
  background: #fff;
  height: var(--belt-height);
  border-top: 1px solid #f2f2f2;
  border-bottom: 1px solid #f2f2f2;
  display: flex;
  align-items: center;
  justify-content: center;
  isolation: isolate;              /* ensure overlay blends cleanly */
}

/* ===============================
   Categories scroller
=================================*/
.grq-belt{ width: 100%; overflow: hidden; }

.grq-track{
  display: inline-flex;
  align-items: center;
  animation: grq-scroll var(--scroll-duration) linear infinite;
  will-change: transform;
}

@keyframes grq-scroll{
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }   /* duplicate list in JS for seamless loop */
}

/* Category item */
.grq-cat{
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 var(--cat-pad-x);           /* creates safe area for the divider */
  white-space: nowrap;
  color: #222;
  font-weight: 600;
  font-size: clamp(var(--cat-font-min), 1.7vw, var(--cat-font-max));
  line-height: 1.12;
}

.grq-cat img{
  width: var(--cat-icon);
  height: auto;
  object-fit: contain;
  flex: 0 0 var(--cat-icon);
}

/* Divider — short, centered line that never overlaps text */
.grq-cat:not(:first-child)::before{
  content: "";
  position: absolute;
  left: 0;                            /* sits inside the left padding */
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 26px;
  background: var(--divider-color);
  box-shadow: -0.5px 0 0 var(--divider-shadow);
  pointer-events: none;
}

/* ===============================
   Offer overlay (fades in, blinks twice, fades out)
=================================*/
.grq-offer-text{
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: linear-gradient(90deg, var(--offer-bg-1), var(--offer-bg-2));
  border-top: 1px solid #f3c26a;
  border-bottom: 1px solid #efb75b;
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s ease;
  z-index: 1;
}

.grq-offer-text.show{ opacity: 1; }

.grq-offer-text span{
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .65px;
  font-size: clamp(var(--offer-font-min), 3.1vw, var(--offer-font-max));
  /* rich amber gradient text with subtle glow */
  background: linear-gradient(90deg, #d97a00, #b86300, #d97a00);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow:
    0 1px 0 rgba(255,255,255,.35),
    0 0 14px var(--offer-glow);
}

/* Double-blink (gentle) — sync duration with JS timeout if you change it */
.grq-offer-text.blink span{
  animation: grq-blink-twice 3s ease-in-out;
}

@keyframes grq-blink-twice{
  0%, 100% { opacity: 1; text-shadow: 0 1px 0 rgba(255,255,255,.4), 0 0 14px var(--offer-glow); }
  25%      { opacity: .55; text-shadow: 0 0 26px rgba(214,146,0,.95); }
  50%      { opacity: 1; }
  75%      { opacity: .55; text-shadow: 0 0 26px rgba(214,146,0,.95); }
}

/* ===============================
   Responsive tweaks
=================================*/
@media (max-width: 640px){
  :root{
    --belt-height: 62px;
    --cat-icon: 28px;
    --cat-pad-x: 18px;
    --offer-font-min: 1.2rem;
    --offer-font-max: 1.6rem;
  }
}

/* Respect “reduce motion” */
@media (prefers-reduced-motion: reduce){
  .grq-track{ animation-duration: 0s; }
  .grq-offer-text.blink span{ animation: none; }
}

/* Mobile tweaks – place AFTER the main CSS */

/* ≤640px */
@media (max-width: 640px){
  :root{
    --belt-height: 60px;          /* optional: a bit shorter */
    --offer-font-min: .8rem;    /* ↓ was 1.2rem */
    --offer-font-max: 1rem;    /* ↓ was 1.6rem */
  }
  .grq-offer-text span{
    letter-spacing: .45px;        /* tighter so it fits nicer */
    text-shadow: 0 1px 0 rgba(255,255,255,.25), 0 0 10px rgba(214,146,0,.45);
  }
}

/* ≤400px (very small phones) */
@media (max-width: 400px){
  :root{
    --belt-height: 56px;
    --offer-font-min: .8rem;
    --offer-font-max: 1rem;
  }
  .grq-offer-text span{ letter-spacing: .35px; }
}

/* Promo visibility */
#ghm-promo[aria-hidden="true"] { display: none; }
#ghm-promo[aria-hidden="false"] { display: block; }

/* Fullscreen container */
#ghm-promo { position: fixed; inset: 0; z-index: 999999; }

/* Backdrop */
.ghm-backdrop {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.55);
  backdrop-filter: saturate(110%) blur(1px);
}

/* Modal card */
.ghm-modal {
  position: absolute; inset: 0;
  margin: auto; width: min(92vw, 520px); max-height: 90vh;
  background: #002b80; /* safe fallback behind rounded image edges */
  border-radius: 16px; overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  display: flex; align-items: center; justify-content: center;
}

/* Promo image */
.ghm-promo-img { width: 100%; height: auto; display: block; }

/* Close (X) */
.ghm-close {
  position: absolute; top: 8px; right: 8px;
  width: 36px; height: 36px; border-radius: 50%;
  border: 0; cursor: pointer; font-size: 26px; line-height: 1;
  color: #fff; background: rgba(0,0,0,.45);
  display: grid; place-items: center;
}
.ghm-close:hover { background: rgba(0,0,0,.6); }

/* Confetti canvas covers the card */
.ghm-confetti { position: absolute; inset: 0; pointer-events: none; }

/* Logo pinned to bottom-center */
.ghm-logo {
  position: absolute; left: 50%; bottom: 8px; transform: translateX(-50%);
  width: 120px; height: auto;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.35));
}

/* Prevent background scroll when modal open */
body.ghm-lock { overflow: hidden; touch-action: none; }