@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;600;700;800&family=Inter:wght@400;500;600&display=swap');

:root{
  --navy:#0d1b4c; --navy-2:#152863;
  --pink:#ec1568; --pink-2:#ff4f93; --pink-bg:#fce7ee;
  --bg:#f5f6fb; --ink:#12142b; --muted:#5b5f7a; --line:#e2e4f0; --white:#fff;
  --green:#16794f; --green-bg:#e6f6ee;
  --amber:#b5730a; --amber-bg:#fdf1de;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{font-family:'Inter',sans-serif; background:var(--bg); color:var(--ink); line-height:1.55;}
h1,h2,h3,h4,.display{font-family:'Sora',sans-serif; color:var(--navy); letter-spacing:-0.01em;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
img{max-width:100%; display:block;}

/* NAV */
nav.site{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.94); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
nav.site .wrap{display:flex; align-items:center; justify-content:space-between; height:64px; gap:18px;}
.brand{display:flex; align-items:center; gap:8px; font-family:'Sora'; font-weight:800; font-size:18px; color:var(--navy); white-space:nowrap;}
.brand img{height:34px; width:auto; display:block;}
.brand .dot{width:9px; height:9px; border-radius:50%; background:var(--pink);}
.navlinks{display:flex; gap:20px; font-size:13.5px; font-weight:500; color:var(--muted); flex-wrap:wrap;}
.navlinks a:hover{color:var(--navy);}
.navlinks a.on{color:var(--pink); font-weight:600;}
.nav-cta{background:var(--pink); color:#fff; padding:9px 16px; border-radius:8px; font-size:13px; font-weight:600; white-space:nowrap;}

/* PAGE HEAD */
.pagehead{padding:52px 0 34px; border-bottom:1px solid var(--line); background:#fff;}
.pagehead .kicker{font-size:13px; color:var(--pink); font-weight:600; margin-bottom:10px;}
.pagehead h1{font-size:34px; margin-bottom:12px; max-width:640px;}
.pagehead p{color:var(--muted); font-size:15.5px; max-width:560px;}
.crumb{font-size:12.5px; color:var(--muted); margin-bottom:14px;}
.crumb a{color:var(--pink); font-weight:600;}

/* SECTIONS/CARDS */
section.block{padding:42px 0;}
.card{background:#fff; border:1px solid var(--line); border-radius:14px; padding:22px;}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.grid4{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}

/* STAT CARDS */
.stat{background:#fff; border:1px solid var(--line); border-radius:12px; padding:18px;}
.stat .num{font-family:'Sora'; font-weight:800; font-size:26px; color:var(--navy);}
.stat .lab{font-size:12.5px; color:var(--muted); margin-top:4px;}
.stat .delta{font-size:11.5px; font-weight:700; margin-top:6px;}
.stat .delta.up{color:var(--green);}
.stat .delta.down{color:var(--pink);}

/* TABLE */
table.data{width:100%; border-collapse:collapse; font-size:13.5px;}
table.data th{text-align:left; font-size:11.5px; color:var(--muted); font-weight:600; padding:10px 12px; border-bottom:1px solid var(--line);}
table.data td{padding:12px; border-bottom:1px solid var(--line); vertical-align:middle;}
table.data tr:last-child td{border-bottom:none;}
.badge{display:inline-block; font-size:11px; font-weight:700; padding:4px 10px; border-radius:20px;}
.badge.ok{background:var(--green-bg); color:var(--green);}
.badge.warn{background:var(--amber-bg); color:var(--amber);}
.badge.bad{background:var(--pink-bg); color:var(--pink);}
.badge.info{background:#e6ecfb; color:var(--navy);}

/* BUTTONS */
.btn-primary{display:inline-block; background:var(--navy); color:#fff; padding:12px 20px; border-radius:9px; font-weight:600; font-size:14px; border:none; cursor:pointer;}
.btn-pink{display:inline-block; background:var(--pink); color:#fff; padding:12px 20px; border-radius:9px; font-weight:600; font-size:14px; border:none; cursor:pointer;}
.btn-ghost{display:inline-block; border:1.5px solid var(--line); padding:11px 20px; border-radius:9px; font-weight:600; font-size:14px; color:var(--navy); background:#fff; cursor:pointer;}
.chip{display:inline-block; padding:7px 14px; border-radius:20px; border:1.5px solid var(--line); font-size:12.5px; font-weight:600; color:var(--muted); cursor:pointer; background:#fff;}
.chip.on{background:var(--navy); border-color:var(--navy); color:#fff;}

/* FORMS */
label{display:block; font-size:12.5px; font-weight:600; color:var(--navy); margin-bottom:6px;}
input[type=text], input[type=number], input[type=email], select, textarea{
  width:100%; border:1.5px solid var(--line); border-radius:9px; padding:11px 13px; font-size:14px; font-family:'Inter'; color:var(--ink); background:#fff;
}
textarea{resize:vertical; min-height:90px;}
.field{margin-bottom:16px;}

/* NOTICE */
.notice{background:var(--amber-bg); border:1px solid #f0dcae; border-radius:10px; padding:14px 16px; font-size:13px; color:#7a5205;}
.notice.pink{background:var(--pink-bg); border-color:#f6b9cf; color:#9c0e46;}
.notice.blue{background:#e9edfb; border-color:#c7d0f2; color:var(--navy);}

/* MODULE HUB (index orbit) reused */
.orbit-box{position:relative; width:100%; aspect-ratio:1/1; max-width:420px; margin:0 auto;}
.orbit-ring{position:absolute; inset:0; border-radius:50%; border:1.5px dashed #cfd4ea;}
.orbit-ring.inner{inset:19%; border-color:#dfe2f2;}
.orbit-center{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:112px; height:112px; border-radius:50%; background:linear-gradient(135deg,var(--navy),var(--navy-2)); display:flex; flex-direction:column; align-items:center; justify-content:center; color:#fff; text-align:center; box-shadow:0 18px 40px rgba(13,27,76,.35);}
.orbit-center b{font-family:'Sora'; font-size:19px; font-weight:800;}
.orbit-center span{font-size:9.5px; letter-spacing:.04em; color:#c7cdf0; margin-top:2px;}
.node{position:absolute; width:114px; padding:11px; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:0 6px 18px rgba(20,25,60,.06); text-align:left; transition:transform .18s, box-shadow .18s, border-color .18s;}
.node:hover{transform:translateY(-3px); box-shadow:0 14px 28px rgba(20,25,60,.14); border-color:var(--pink-2);}
.node .n-ico{font-size:17px; margin-bottom:5px; display:block;}
.node .n-title{font-size:11.5px; font-weight:700; color:var(--navy); line-height:1.25;}
.node.n1{top:-2%; left:50%; transform:translateX(-50%);}
.node.n2{top:19%; right:-6%;}
.node.n3{bottom:19%; right:-6%;}
.node.n4{bottom:-2%; left:50%; transform:translateX(-50%);}
.node.n5{bottom:19%; left:-6%;}
.node.n6{top:19%; left:-6%;}

footer.site{border-top:1px solid var(--line); padding:0; text-align:center; color:var(--muted); font-size:13px; background:#fff;}
.footer-sig{display:flex; align-items:center; justify-content:center; gap:14px; padding:26px 20px 16px; flex-wrap:wrap; border-bottom:1px solid var(--line);}
.footer-sig img.sig-photo{width:60px; height:60px; border-radius:50%; object-fit:cover; object-position:top center; border:2.5px solid var(--pink-bg);}
.footer-sig img.sig-logo{height:26px; width:auto;}
.footer-sig .sig-text{font-size:12px; color:var(--muted); text-align:left; line-height:1.4;}
.footer-sig .sig-text b{color:var(--navy); font-family:'Sora'; font-size:12.5px;}
.footer-social{display:flex; gap:8px; align-items:center;}
.footer-social a{width:32px; height:32px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:14px; color:var(--navy); transition:border-color .15s, color .15s;}
.footer-social a:hover{border-color:var(--pink); color:var(--pink);}
.footer-tag{padding:16px; font-size:12.5px; color:var(--muted);}

/* MOBILE NAV */
.menu-toggle{display:none; background:#fff; border:1px solid var(--line); border-radius:8px; width:38px; height:38px; font-size:17px; color:var(--navy); cursor:pointer; align-items:center; justify-content:center;}
nav.site .wrap{position:relative;}
@media (max-width:880px){
  .menu-toggle{display:flex;}
  .navlinks{display:none; position:absolute; top:64px; left:0; right:0; background:#fff; flex-direction:column; gap:0; border-bottom:1px solid var(--line); box-shadow:0 14px 26px rgba(20,25,60,.1); padding:6px 0; z-index:60;}
  .navlinks.open{display:flex;}
  .navlinks a{padding:13px 24px; border-bottom:1px solid var(--line); width:100%;}
}
@media (max-width:420px){
  .nav-cta{display:none;}
}

/* TABLE SCROLL WRAP */
.table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch;}
.table-wrap table.data{min-width:520px;}
.who-behind{background:var(--navy); border-radius:18px; padding:36px; display:grid; grid-template-columns:auto 1fr auto; gap:28px; align-items:center;}
.home-hero-grid{display:grid; grid-template-columns:1.05fr .95fr;}
.campaign-band{display:grid; grid-template-columns:1fr 1fr;}
.campaign-hero-grid{display:grid; grid-template-columns:1fr 1fr; gap:0;}
.campaign-hero-h1{font-size:38px;}
@media (max-width:880px){ .campaign-hero-h1{font-size:28px;} }

/* CAROUSEL / BOUTIQUE */
.carousel-wrap{position:relative;}
.carousel{display:flex; gap:16px; overflow-x:auto; scroll-behavior:smooth; padding:6px 4px 16px; scroll-snap-type:x mandatory;}
.carousel::-webkit-scrollbar{height:6px;}
.carousel::-webkit-scrollbar-thumb{background:var(--line); border-radius:6px;}
.biz-card{flex:0 0 250px; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:0 8px 20px rgba(20,25,60,.05); scroll-snap-align:start;}
.biz-photo{height:120px; background:linear-gradient(135deg,var(--navy),var(--navy-2)); display:flex; align-items:center; justify-content:center; font-size:38px;}
.biz-photo img{width:100%; height:100%; object-fit:cover;}
.biz-body{padding:16px;}
.biz-cat{font-size:10.5px; font-weight:700; color:var(--pink); text-transform:uppercase; letter-spacing:.03em;}
.biz-name{font-size:15px; font-weight:700; color:var(--navy); margin:6px 0 8px; line-height:1.25;}
.biz-desc{font-size:12.5px; color:var(--muted); margin-bottom:10px; min-height:32px;}
.biz-star{background:var(--pink-bg); border-radius:8px; padding:8px 10px; font-size:11.5px; margin-bottom:8px; color:#9c0e46;}
.biz-offer{background:var(--amber-bg); border-radius:8px; padding:8px 10px; font-size:11.5px; color:#7a5205; margin-bottom:10px;}
.biz-star b, .biz-offer b{display:block; font-size:12.5px; margin-bottom:2px;}
.carousel-btn{position:absolute; top:44%; transform:translateY(-50%); width:34px; height:34px; border-radius:50%; background:#fff; border:1px solid var(--line); box-shadow:0 6px 16px rgba(20,25,60,.14); display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:5; font-size:15px; color:var(--navy);}
.carousel-btn.left{left:-4px;} .carousel-btn.right{right:-4px;}
.add-card{flex:0 0 250px; border:1.5px dashed var(--line); border-radius:16px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:20px; cursor:pointer; scroll-snap-align:start; background:#fbfbfe;}

/* SOURCE CHIP */
.source-chip{display:inline-flex; align-items:center; gap:6px; font-size:11.5px; color:var(--muted); border:1px solid var(--line); padding:5px 10px; border-radius:20px; margin:3px 6px 3px 0; background:#fff;}
.source-chip:hover{border-color:var(--pink-2); color:var(--pink);}

/* MODAL */
.modal-back{position:fixed; inset:0; background:rgba(13,27,76,.55); display:none; align-items:center; justify-content:center; z-index:100; padding:20px;}
.modal-back.open{display:flex;}
.modal-card{background:#fff; border-radius:16px; padding:28px; max-width:480px; width:100%; max-height:88vh; overflow-y:auto; position:relative;}
.modal-close{position:absolute; top:14px; right:16px; font-size:20px; color:var(--muted); cursor:pointer; background:none; border:none;}

@media (max-width:880px){
  .grid2,.grid3,.grid4{grid-template-columns:1fr;}
  .pagehead h1{font-size:27px;}
  .who-behind{grid-template-columns:1fr !important; text-align:center; justify-items:center;}
  .who-behind img[alt="Soy Clara Godoy"]{justify-self:center !important;}
  .footer-sig{text-align:center;}
  .footer-sig .sig-text{text-align:center;}
  .shirt-grid{grid-template-columns:repeat(2,1fr);}
  .home-hero-grid{grid-template-columns:1fr !important; padding-bottom:32px !important;}
  .home-hero-grid h1{font-size:29px !important;}
  .campaign-band{grid-template-columns:1fr !important;}
  .campaign-hero-grid{grid-template-columns:1fr !important;}
}
@media (max-width:520px){
  .shirt-grid{grid-template-columns:1fr 1fr; gap:10px;}
  .biz-card{flex-basis:210px;}
}

/* CAMPAÑA CAMISETAS */
.shirt-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.shirt-card{background:#0d1b4c; border-radius:16px; overflow:hidden; position:relative; cursor:pointer; transition:transform .2s;}
.shirt-card:hover{transform:translateY(-4px);}
.shirt-card img{width:100%; aspect-ratio:1/1; object-fit:cover; display:block;}
.shirt-card .shirt-tag{position:absolute; top:10px; left:10px; background:rgba(255,255,255,.92); color:var(--navy); font-size:10.5px; font-weight:700; padding:4px 9px; border-radius:20px;}
.shirt-lightbox{position:fixed; inset:0; background:rgba(10,14,30,.85); display:none; align-items:center; justify-content:center; z-index:200; padding:20px;}
.shirt-lightbox.open{display:flex;}
.shirt-lightbox img{max-width:420px; width:100%; border-radius:14px;}
.shirt-lightbox .lb-close{position:absolute; top:20px; right:26px; color:#fff; font-size:28px; cursor:pointer; background:none; border:none;}
.donation-ring{width:120px; height:120px; border-radius:50%; border:8px solid var(--pink); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.donation-ring b{font-family:'Sora'; font-size:26px; color:var(--pink);}
