:root{
  --navy:#20375C;
  --navy-light:#37527d;
  --orange:#944C2C;
  --orange-light:#b05f39;
  --grey-mid:#7C8794;
  --grey-light:#D8DCE1;
  --paper:#FBFAF6;
  --ink:#20242a;
  --steel-dark:#3b424a;
  --steel-mid:#59616a;
  --steel-light:#b0b7bd;

  --font-head:'Poppins', sans-serif;
  --font-body:'Inter', sans-serif;
}

*{box-sizing:border-box; margin:0; padding:0;}
html,body{height:100%;}
html{
  /* always reserve scrollbar space, whether or not the current page needs
     to scroll — otherwise the footer (and everything else) shifts a few
     px sideways when navigating between a scrolling page and a non-scrolling one */
  overflow-y:scroll;
  scrollbar-gutter:stable;
}
body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--paper);
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
h1,h2,h3{font-family:var(--font-head); color:var(--navy); line-height:1.15;}
button{font-family:var(--font-head); cursor:pointer; border:none;}

/* ============ NAV ============ */
.site-nav{
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.9rem 1.6rem;
  background:rgba(251,250,246,.9);
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(32,55,92,.08);
}
.nav-brand{
  display:flex;
  align-items:center;
  gap:.6rem;
}
.nav-logo-icon{
  width:34px; height:34px;
  object-fit:contain;
}
.nav-brand-text{
  font-family:var(--font-head);
  font-weight:600;
  font-size:1.15rem;
  color:var(--navy);
}
.nav-links{
  display:flex;
  align-items:center;
  gap:1.8rem;
}
.nav-links a{
  font-family:var(--font-head);
  font-weight:500;
  font-size:.92rem;
  color:var(--navy);
  opacity:.85;
  transition:opacity .15s ease;
  white-space:nowrap;
}
.nav-links a:hover{opacity:1;}
.nav-links a.active{opacity:1; border-bottom:2px solid var(--orange);}
.nav-cta{
  background:var(--orange);
  color:#fff !important;
  padding:.55rem 1.2rem;
  border-radius:6px;
  opacity:1 !important;
}
.nav-cta:hover{background:var(--orange-light);}

.nav-toggle{
  display:none;
  flex-direction:column;
  gap:5px;
  background:transparent;
  padding:6px;
}
.nav-toggle span{
  width:24px; height:2px; background:var(--navy); border-radius:2px;
}

@media (max-width: 760px){
  .nav-toggle{display:flex;}
  .nav-links{
    position:fixed;
    top:64px; right:0;
    flex-direction:column;
    background:var(--paper);
    padding:1.5rem 2rem;
    gap:1.2rem;
    border-left:1px solid rgba(32,55,92,.08);
    border-bottom:1px solid rgba(32,55,92,.08);
    border-bottom-left-radius:10px;
    transform:translateX(110%);
    transition:transform .3s ease;
  }
  .nav-links.open{transform:translateX(0);}
}

/* ============ PAGE CONTENT ============ */
#app{
  position:relative;
  z-index:1;
  min-height:100vh;
  padding-bottom:56px;
}
.page-section{
  max-width:960px;
  margin:0 auto;
  padding:3rem 1.6rem 5rem;
  padding-top:calc(3rem + 80px); /* clears the fixed nav for normal content pages */
}
.page-section h1{
  font-size:clamp(2rem, 5vw, 2.8rem);
  margin-bottom:1rem;
}
.page-section h2{
  font-size:clamp(1.3rem, 3vw, 1.7rem);
  margin:2.2rem 0 .8rem;
}
.page-section p{
  font-size:1.05rem;
  line-height:1.7;
  color:#45505c;
  margin-bottom:1rem;
}
.eyebrow{
  font-family:var(--font-head);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--orange);
  display:inline-block;
  margin-bottom:1rem;
}

/* Home hero (revealed behind fridge on open) — CSS-built empty fridge
   interior, no image needed, stays crisp at any resolution */
.home-hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:6rem 1.5rem 3rem;
  overflow:hidden;
  background:linear-gradient(180deg, #dbe6ee 0%, #c3d3de 40%, #a9bdc9 100%);
}
.hero-interior{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
}
.hero-wall{
  position:absolute;
  top:0; bottom:0;
  width:16%;
  background:linear-gradient(90deg, #9fb0bc, #cddae2);
}
.hero-wall.left{
  left:0;
  clip-path:polygon(0 0, 100% 6%, 100% 94%, 0 100%);
}
.hero-wall.right{
  right:0;
  background:linear-gradient(270deg, #9fb0bc, #cddae2);
  clip-path:polygon(100% 0, 100% 100%, 0 94%, 0 6%);
}
.hero-light-panel{
  position:absolute;
  top:4%; left:50%;
  transform:translateX(-50%);
  width:34%;
  height:4%;
  min-height:14px;
  background:#fdfefe;
  border-radius:6px;
  box-shadow:0 0 60px 25px rgba(255,255,255,.75);
}
.hero-streak{
  position:absolute;
  top:8%; bottom:10%;
  width:10px;
  background:linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.15));
  border-radius:6px;
  filter:blur(1px);
}
.hero-streak.left{left:19%;}
.hero-streak.right{right:19%;}

.glass-card{
  position:relative;
  z-index:5;
  max-width:600px;
  text-align:center;
  background:rgba(255,255,255,.74);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,.6);
  border-radius:22px;
  padding:2.6rem 2.2rem;
  box-shadow:0 20px 55px rgba(20,35,55,.28);
}
.glass-card .eyebrow{color:var(--orange);}
.glass-card h1{
  font-size:clamp(1.8rem, 5vw, 2.7rem);
  line-height:1.15;
}
.glass-card h1 span{color:var(--orange);}
.glass-card p{
  margin-top:1.1rem;
  font-size:1.02rem;
  line-height:1.65;
  color:#3a4552;
}
.cta-row{
  margin-top:2.2rem;
  display:flex;
  gap:1rem;
  justify-content:center;
  flex-wrap:wrap;
}
.btn{
  font-weight:600;
  font-size:1rem;
  padding:.95rem 1.8rem;
  border-radius:7px;
  transition:transform .15s ease;
  display:inline-block;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--orange); color:#fff;}
.btn-primary:hover{background:var(--orange-light);}
.btn-secondary{background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.55);}

/* generic content page buttons (light bg) */
.page-section .btn-primary{background:var(--orange); color:#fff;}
.page-section .btn-secondary{background:transparent; color:var(--navy); border:1.5px solid var(--navy);}
.glass-card .btn-secondary{background:transparent; color:var(--navy); border:1.5px solid var(--navy);}
.contact-hero-overlay .btn-secondary{
  background:rgba(255,255,255,.82);
  color:var(--navy);
  border:1.5px solid var(--navy);
}
.contact-hero-overlay .btn-secondary:hover{background:#fff;}
.btn-navy-solid{background:var(--navy); color:#fff; border:1.5px solid var(--navy);}
.btn-navy-solid:hover{background:var(--navy-light);}

/* FAQ */
.faq-item{
  border-bottom:1px solid rgba(32,55,92,.12);
  padding:1.1rem 0;
}
.faq-q{
  font-family:var(--font-head);
  font-weight:600;
  color:var(--navy);
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.faq-a{
  max-height:0;
  overflow:hidden;
  transition:max-height .3s ease;
  color:#45505c;
  line-height:1.6;
}
.faq-item.open .faq-a{max-height:300px; margin-top:.7rem;}
.faq-item.open .faq-q .chev{transform:rotate(180deg);}
.chev{transition:transform .2s ease; color:var(--orange);}

/* Pricing card */
.price-card{
  background:#fff;
  border:1px solid rgba(32,55,92,.12);
  border-radius:12px;
  padding:1.8rem;
  margin:1.5rem 0;
  box-shadow:0 8px 24px rgba(32,55,92,.06);
}
.price-amount{
  font-family:var(--font-head);
  font-size:2.4rem;
  font-weight:700;
  color:var(--navy);
}
.price-amount span{font-size:1rem; font-weight:500; color:var(--grey-mid);}

/* Pricing page: map + fee table layout */
.pricing-layout{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:2.5rem;
  align-items:start;
  margin:2rem 0;
}
@media (max-width:800px){
  .pricing-layout{grid-template-columns:1fr;}
}
.pricing-map-wrap{display:flex; justify-content:center;}

/* magnet-clip presentation, reused from the Brands page visual language */
.map-magnet{
  position:relative;
  width:100%;
  max-width:400px;
  background:#fff;
  border-radius:10px;
  padding:.9rem;
  box-shadow:0 10px 26px rgba(32,55,92,.22);
  transform:rotate(-1.2deg);
}
.map-magnet img{width:100%; display:block; border-radius:5px;}
.map-magnet .clip-bar{
  position:absolute; top:-13px; left:50%;
  width:34%; min-width:70px; height:16px;
  transform:translateX(-50%);
  background:linear-gradient(180deg,#eef0f2,#9aa1a8 55%,#787e84);
  border-radius:5px;
  box-shadow:0 3px 5px rgba(0,0,0,.35), inset 0 0 0 1px rgba(0,0,0,.15);
  z-index:2;
}
.map-magnet .clip-knob{
  position:absolute; top:-9px; left:50%;
  width:16px; height:16px;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #d4d7da, #676d73 70%);
  box-shadow:0 1px 3px rgba(0,0,0,.4);
  z-index:3;
}

.fee-table{display:flex; flex-direction:column; gap:.9rem;}
.fee-row{
  display:flex;
  align-items:center;
  gap:.8rem;
  background:#fff;
  border:1px solid rgba(32,55,92,.12);
  border-radius:10px;
  padding:.9rem 1.1rem;
  box-shadow:0 6px 16px rgba(32,55,92,.06);
}
.fee-swatch{
  width:16px; height:16px;
  border-radius:4px;
  flex-shrink:0;
}
.fee-region{flex:1; font-weight:500; color:var(--ink); font-size:.95rem;}
.fee-amount{
  font-family:var(--font-head);
  font-weight:700;
  color:var(--navy);
  white-space:nowrap;
}
.fee-amount small{font-weight:500; color:var(--grey-mid); font-size:.78rem;}
.fee-note{
  font-size:.85rem;
  color:var(--grey-mid);
  line-height:1.5;
  margin-top:.2rem;
}

/* Contact */
.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2.5rem;
  margin-top:1.5rem;
}
@media (max-width:700px){.contact-grid{grid-template-columns:1fr;}}
.contact-info-block{
  background:#fff;
  border:1px solid rgba(32,55,92,.12);
  border-radius:12px;
  padding:1.6rem;
}
.contact-info-block h3{font-size:1.05rem; margin-bottom:.6rem;}
.service-list{list-style:none; margin-top:.5rem;}
.service-list li{
  padding:.35rem 0;
  color:#45505c;
  font-size:.95rem;
}
.service-list li::before{content:"— "; color:var(--orange);}

form.contact-form{display:flex; flex-direction:column; gap:.9rem;}
form.contact-form input, form.contact-form textarea{
  font-family:var(--font-body);
  font-size:.95rem;
  padding:.75rem .9rem;
  border:1px solid rgba(32,55,92,.2);
  border-radius:7px;
  background:#fff;
}
form.contact-form textarea{min-height:110px; resize:vertical;}

.form-status{
  display:none;
  font-size:.85rem;
  padding:.7rem .9rem;
  border-radius:7px;
  margin-bottom:.8rem;
}
.form-status:not(:empty){display:block;}
.form-status-success{background:#e6f4ea; color:#1e6b3a;}
.form-status-error{background:#fbe9e7; color:#a3372a;}
.field-error{
  display:block;
  font-size:.78rem;
  color:#c0392b;
  margin-top:-.5rem;
}
.field-error:empty{display:none;}
[aria-invalid="true"]{border-color:#c0392b !important;}

/* Contact page: hero image + heading, then 3-column layout */
.contact-hero{
  position:relative;
  width:100%;
  height:58vh;
  min-height:360px;
  max-height:560px;
  padding-top:80px;
  overflow:hidden;
  background:var(--paper);
}
.contact-hero-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 42%;
}
.contact-hero-overlay{
  position:relative;
  z-index:2;
  text-align:center;
  margin-top:-90px; /* pulls the heading up into the photo's faded bottom edge */
  padding-top:.5rem;
}
.contact-hero-overlay h1{
  color:var(--navy);
  text-shadow:0 2px 16px rgba(251,250,246,.85), 0 0 4px rgba(251,250,246,.9);
}
.contact-hero-overlay .contact-heading-cta{margin-top:1.1rem; margin-bottom:0;}
.contact-hero h1{
  position:relative;
  z-index:2;
  font-size:clamp(2rem, 5vw, 3rem);
  color:var(--navy);
}
.contact-page-section{padding-top:1.5rem;}
.contact-heading{
  text-align:center;
  margin-bottom:.5rem;
}
.contact-heading-cta{
  display:flex;
  gap:1rem;
  justify-content:center;
  flex-wrap:wrap;
  margin-bottom:2rem;
}
.contact-grid-3{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:1.8rem;
  margin-top:1rem;
  max-width:1080px;
  margin-left:auto;
  margin-right:auto;
}
@media (max-width:900px){
  .contact-grid-3{grid-template-columns:1fr; max-width:500px;}
}

.btn-whatsapp{
  background:#25D366;
  color:#fff;
  border:1.5px solid #25D366;
}
.btn-whatsapp:hover{background:#1ebe57;}

/* placeholder note badge (dev-only visual reminder) */
.placeholder-note{
  display:inline-block;
  font-size:.72rem;
  font-family:var(--font-body);
  color:var(--grey-mid);
  background:var(--grey-light);
  padding:.25rem .6rem;
  border-radius:5px;
  margin-bottom:1.2rem;
}

/* ============ FRIDGE LAYER ============ */
.fridge-layer{
  position:fixed;
  inset:0;
  z-index:50;
  perspective:2200px;
  pointer-events:none;
}
.fridge-body{
  position:absolute; inset:0;
  background:linear-gradient(115deg, var(--steel-light) 0%, var(--steel-mid) 38%, var(--steel-dark) 100%);
  overflow:hidden;
  pointer-events:auto;
  transition:opacity .5s ease .25s;
}
.fridge-layer.open .fridge-body{opacity:0; pointer-events:none; transition:opacity .5s ease;}
.fridge-body::before{
  content:"";
  position:absolute; inset:0;
  background:repeating-linear-gradient(100deg, rgba(255,255,255,.05) 0 2px, transparent 2px 5px);
  mix-blend-mode:overlay;
  pointer-events:none;
}
.interior-light{
  position:absolute; inset:0;
  background:radial-gradient(ellipse at 50% 30%, rgba(148,76,44,.35), rgba(20,25,30,0) 70%);
  opacity:0;
  pointer-events:none;
  transition:opacity .8s ease .2s;
}
.fridge-layer.open .interior-light{opacity:1;}
.shelf{
  position:absolute; left:8%; right:8%;
  height:3px;
  background:rgba(255,255,255,.15);
  border-radius:2px;
  pointer-events:none;
  opacity:0;
  transition:opacity .6s ease .3s;
}
.fridge-layer.open .shelf{opacity:1;}

.door{
  position:absolute;
  top:0; bottom:16%;
  width:calc(50% + 3px);
  transform-style:preserve-3d;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transition:transform 1.1s cubic-bezier(.65,0,.35,1);
  cursor:pointer;
  pointer-events:auto;
  z-index:3;
}
.door-left{left:0; transform-origin:left center;}
.door-right{right:-3px; transform-origin:right center;}
.fridge-layer.open .door-left{transform:rotateY(-112deg);}
.fridge-layer.open .door-right{transform:rotateY(112deg);}

.door-face{
  position:absolute; inset:0;
  background:linear-gradient(160deg, var(--steel-light) 0%, var(--steel-mid) 45%, var(--steel-dark) 100%);
}
.door-face::after{
  content:"";
  position:absolute; inset:0;
  background:repeating-linear-gradient(100deg, rgba(255,255,255,.06) 0 2px, transparent 2px 6px);
  mix-blend-mode:overlay;
}
.door-left .door-face{box-shadow:inset -2px 0 6px rgba(0,0,0,.25);}
.door-right .door-face{box-shadow:inset 2px 0 6px rgba(0,0,0,.25);}

.handle{
  position:absolute; top:14%;
  width:10px; height:34%;
  border-radius:6px;
  background:linear-gradient(180deg,#e7eaec,#8b9298);
  box-shadow:0 2px 6px rgba(0,0,0,.35);
}
.door-left .handle{right:8%;}
.door-right .handle{left:8%;}

.nameplate{
  position:absolute; left:50%; top:50%;
  transform:translate(-50%,-50%);
  background:var(--paper);
  padding:1rem 1.4rem;
  border-radius:9px;
  box-shadow:0 8px 22px rgba(0,0,0,.3);
  width:min(80%, 380px);
  z-index:4;
  transition:opacity .35s ease;
  pointer-events:none;
  display:flex;
  align-items:center;
  justify-content:center;
}
.nameplate img{
  width:100%;
  height:auto;
  display:block;
}
.fridge-layer.open .nameplate{opacity:0;}

.freezer{
  position:absolute; left:0; right:0; bottom:0;
  height:16%;
  background:linear-gradient(160deg, var(--steel-mid), var(--steel-dark));
  border-top:2px solid rgba(0,0,0,.25);
  pointer-events:none;
  z-index:3;
}
.freezer .handle-h{
  position:absolute; left:8%; right:8%; top:36%;
  height:8px;
  border-radius:6px;
  background:linear-gradient(180deg,#e7eaec,#8b9298);
  box-shadow:0 2px 6px rgba(0,0,0,.35);
}

.prompt{
  position:absolute; bottom:6%; left:50%;
  transform:translateX(-50%);
  font-family:var(--font-head);
  font-weight:600;
  font-size:1.05rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#f2f4f5;
  display:flex; align-items:center; gap:.7rem;
  white-space:nowrap;
  transition:opacity .4s ease;
  z-index:4;
  pointer-events:none;
  text-shadow:0 2px 10px rgba(0,0,0,.4);
}
.prompt .dot-wrap{
  position:relative;
  width:10px; height:10px;
  flex-shrink:0;
}
.prompt .dot-wrap::before{
  /* the steady dot */
  content:"";
  position:absolute; inset:0;
  border-radius:50%;
  background:var(--orange-light);
  animation:pulse 1.6s infinite ease-in-out;
}
.prompt .dot-wrap::after{
  /* the expanding ripple ring */
  content:"";
  position:absolute;
  top:50%; left:50%;
  width:10px; height:10px;
  margin:-5px 0 0 -5px;
  border-radius:50%;
  border:2px solid var(--orange-light);
  animation:ripple 1.8s infinite ease-out;
}
.fridge-layer.open .prompt{opacity:0;}
@keyframes pulse{0%,100%{opacity:.3; transform:scale(1);}50%{opacity:1; transform:scale(1.3);}}
@keyframes ripple{
  0%{transform:scale(1); opacity:.9;}
  100%{transform:scale(3.2); opacity:0;}
}

/* ============ MAGNET LAYER (Brands page) ============ */
.magnet-layer{
  position:absolute; inset:0;
  z-index:5;
  opacity:0;
  pointer-events:none;
  transition:opacity .4s ease;
}
.fridge-layer.brands-active .magnet-layer{opacity:1; pointer-events:auto;}
.fridge-layer.brands-active .nameplate,
.fridge-layer.brands-active .prompt{opacity:0;}

.magnet-title{
  position:absolute; top:0; left:0; right:0;
  text-align:center;
  padding:2rem 1.2rem 1rem;
  pointer-events:none;
}
.magnet-title h2{color:var(--paper); font-size:clamp(1.3rem, 4vw, 1.9rem);}
.magnet-title p{
  color:rgba(251,250,246,.75);
  font-family:var(--font-body);
  font-size:.7rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-top:.4rem;
}

.magnet{
  position:absolute;
  cursor:grab;
  user-select:none;
  touch-action:none;
  will-change:transform;
}
.magnet.dragging{cursor:grabbing; z-index:10; transition:none;}
.magnet:not(.dragging){transition:transform .05s linear;}

.magnet::before{
  content:"";
  position:absolute; top:-6px; left:50%;
  width:10px; height:10px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #fff, var(--orange-light) 55%, #6e3a20 100%);
  transform:translateX(-50%);
  box-shadow:0 2px 3px rgba(0,0,0,.35);
  z-index:2;
}

/* CARD type — logo has no background of its own, needs a white backing */
.magnet-card{
  background:var(--paper);
  border-radius:10px;
  box-shadow:0 8px 16px rgba(0,0,0,.35);
  padding:.6rem .9rem;
  display:flex;
  align-items:center;
  justify-content:center;
}
.magnet-card img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.magnet-card.shape-pill{border-radius:999px;}
.magnet-card.card-kraft{background:#e8dcc6;}
.magnet-card.card-blue{background:#dfe9f0;}

/* Holder styles — only one applies per card-type magnet */
.holder-pin::before{
  content:"";
  position:absolute; top:-6px; left:50%;
  width:10px; height:10px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #fff, var(--orange-light) 55%, #6e3a20 100%);
  transform:translateX(-50%);
  box-shadow:0 2px 3px rgba(0,0,0,.35);
  z-index:2;
}
.holder-clip::before{
  /* the metal clamp bar of a chip-clip style fridge magnet */
  content:"";
  position:absolute; top:-9px; left:50%;
  width:56%; height:13px;
  min-width:44px;
  transform:translateX(-50%);
  background:linear-gradient(180deg,#eef0f2,#9aa1a8 55%,#787e84);
  border-radius:4px;
  box-shadow:0 2px 3px rgba(0,0,0,.35), inset 0 0 0 1px rgba(0,0,0,.15);
  z-index:2;
}
.holder-clip::after{
  /* the round magnet knob on the clip's face */
  content:"";
  position:absolute; top:-5px; left:50%;
  width:13px; height:13px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #d4d7da, #676d73 70%);
  box-shadow:0 1px 2px rgba(0,0,0,.4);
  transform:translateX(-50%);
  z-index:3;
}

/* BADGE type — logo already has its own background/plaque baked in */
.magnet-badge{
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 8px 18px rgba(0,0,0,.4);
}
.magnet-badge.badge-circle{border-radius:50%;}
.magnet-badge img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.magnet-badge.holder-pin::before{top:-6px;}

.magnet.magnet-contact{
  font-family:var(--font-head);
  font-weight:700;
  color:#fff;
  background:var(--orange);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  border-radius:8px;
  font-size:1.5rem;
  line-height:1.15;
  padding:1rem 1.4rem;
  box-shadow:0 10px 22px rgba(0,0,0,.4);
}
.magnet.magnet-us{
  background:var(--paper);
  border-radius:10px;
  padding:.9rem 1.3rem;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 10px 22px rgba(0,0,0,.4);
}
.magnet.magnet-us img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

/* ============ FOOTER (fixed, slim, persistent) ============ */
.site-footer{
  position:fixed;
  bottom:0; left:0; right:0;
  z-index:60;
  background:var(--navy);
  color:#fff;
  padding:.65rem 1.4rem;
  opacity:0;
  transform:translateY(100%);
  transition:opacity .35s ease, transform .35s ease;
  pointer-events:none;
}
.site-footer.visible{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.footer-inner{
  max-width:1200px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.2rem;
  flex-wrap:wrap;
}
.footer-brand{
  display:flex;
  align-items:center;
  gap:.5rem;
  flex-shrink:0;
}
.footer-logo-icon{width:22px; height:22px; object-fit:contain;}
.footer-brand span{font-family:var(--font-head); font-weight:600; font-size:.85rem;}
.footer-links{
  display:flex;
  align-items:center;
  gap:1.1rem;
  flex-wrap:wrap;
}
.footer-links a{
  font-size:.78rem;
  color:rgba(255,255,255,.8);
  white-space:nowrap;
  transition:color .15s ease;
}
.footer-links a:hover{color:#fff;}
.footer-divider{
  width:1px; height:14px;
  background:rgba(255,255,255,.25);
}
.footer-contact{
  font-size:.8rem;
  color:rgba(255,255,255,.9);
  white-space:nowrap;
  flex-shrink:0;
}
@media (max-width:760px){
  .footer-inner{justify-content:center; text-align:center;}
  .footer-links{justify-content:center;}
  .footer-contact{display:none;}
}