/* 365Graficas — estilos compartidos por todas las páginas */
/* 365Graficas — tokens tomados del brandboard */
:root{
  --negro:#1D1D1B; --papel:#F7F5F1; --piedra:#E8E6E0;
  --verde:#0CA73D; --amarillo:#F2CD1A; --magenta:#B0176F;

  --bg:#F7F5F1; --bg2:#ECEAE4; --surface:#FFFFFF;
  --ink:#1D1D1B; --ink2:#4B4B47; --ink3:#77776F;
  --line:#DEDBD3; --line2:#CFCBC1;
  --verde-txt:#08852F; --magenta-txt:#A0145F;
  --band:#1D1D1B; --band-ink:#F7F5F1; --band-ink2:#A9ADAB;
  --day-past:#1D1D1B; --day-future:#DEDBD3;
  --sheet:var(--ink); --acc:var(--verde);
  --radius:14px;
  --maxw:1180px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#161614; --bg2:#1D1D1B; --surface:#242422;
    --ink:#F7F5F1; --ink2:#B4B8B6; --ink3:#868B8B;
    --line:#33332F; --line2:#45453F;
    --verde-txt:#2FC766; --magenta-txt:#E068B1;
    --band:#0F0F0E; --band-ink:#F7F5F1; --band-ink2:#A9ADAB;
    --day-past:#F7F5F1; --day-future:#33332F;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#161614; --bg2:#1D1D1B; --surface:#242422;
  --ink:#F7F5F1; --ink2:#B4B8B6; --ink3:#868B8B;
  --line:#33332F; --line2:#45453F;
  --verde-txt:#2FC766; --magenta-txt:#E068B1;
  --band:#0F0F0E; --band-ink:#F7F5F1; --band-ink2:#A9ADAB;
  --day-past:#F7F5F1; --day-future:#33332F;
}

@property --acc{syntax:'<color>';inherits:true;initial-value:#0CA73D}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:"Montserrat",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:16px;line-height:1.6;font-weight:400;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
:focus-visible{outline:2px solid var(--verde);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:clamp(16px,4vw,40px)}
h1,h2,h3{font-weight:800;line-height:1.05;letter-spacing:-.02em;text-wrap:balance;margin:0}
h1{font-size:clamp(2.6rem,7.2vw,5.6rem)}
h2{font-size:clamp(1.9rem,4.2vw,3.1rem)}
h3{font-size:1.2rem;letter-spacing:-.01em;line-height:1.2}
p{margin:0}
.lead{font-size:clamp(1.05rem,1.6vw,1.22rem);color:var(--ink2);max-width:58ch}
.eyebrow{font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink3)}
.eyebrow.m{color:var(--magenta-txt)}
.eyebrow.v{color:var(--verde-txt)}
.num{font-variant-numeric:tabular-nums}


/* header */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand svg{width:30px;height:auto}
.brand b{font-weight:800;font-size:1.22rem;letter-spacing:-.02em}
.nav{display:flex;align-items:center;gap:clamp(12px,2.4vw,28px);font-size:.92rem;font-weight:500}
.nav a{text-decoration:none;color:var(--ink2);padding-block:6px;border-bottom:2px solid transparent}
.nav a:hover{color:var(--ink)}
.nav a[aria-current="page"]{color:var(--ink);border-color:var(--verde)}
@media (max-width:560px){.nav .hide-s{display:none}}

/* botones */
.btn{display:inline-flex;align-items:center;gap:10px;height:50px;padding-inline:24px;border-radius:999px;font:600 .95rem/1 inherit;font-family:inherit;text-decoration:none;border:1.5px solid var(--ink);cursor:pointer;transition:transform .15s ease,background .15s ease,color .15s ease}
.btn.solid{background:var(--ink);color:var(--bg)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn:hover{transform:translateY(-2px)}
.btn.ghost:hover{background:var(--ink);color:var(--bg)}
.btn.sm{height:40px;padding-inline:18px;font-size:.85rem}
.nav .btn{color:var(--bg);border-bottom:1.5px solid var(--ink)}
.nav .btn:hover{color:var(--bg)}

/* barra de progreso de marca (verde/amarillo/magenta) */
.tricolor{display:flex;height:6px;border-radius:6px;overflow:hidden}
.tricolor i{display:block}
.tricolor i:nth-child(1){flex:9;background:var(--verde)}
.tricolor i:nth-child(2){flex:2.6;background:var(--amarillo)}
.tricolor i:nth-child(3){flex:2;background:var(--magenta)}

section{padding-block:clamp(64px,9vw,120px)}
.sec-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px 48px;align-items:end;margin-bottom:clamp(36px,5vw,60px)}
.sec-head .lead{justify-self:start}
@media (max-width:800px){.sec-head{grid-template-columns:1fr}}

/* footer */
.site-foot{background:var(--band);color:var(--band-ink);padding-block:56px 40px}
.site-foot .top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:32px;align-items:flex-start}
.site-foot .brand svg{--sheet:var(--papel)}
.site-foot .brand{color:var(--band-ink)}
.site-foot .tag{color:var(--band-ink2);margin-top:10px;font-size:.95rem}
.site-foot nav{display:flex;gap:28px;flex-wrap:wrap;font-size:.92rem}
.site-foot nav a{text-decoration:none;color:var(--band-ink2)}
.site-foot nav a:hover{color:var(--band-ink)}
.site-foot .bottom{margin-top:44px;padding-top:20px;border-top:1px solid #33332F;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:.8rem;color:var(--band-ink2)}
.site-foot .tricolor{margin-top:40px}

/* nav compacta */
@media (max-width:640px){.nav{gap:14px;font-size:.86rem}.nav .hide-s{display:none}}
@media (max-width:420px){.brand b{display:none}}

/* redes flotantes */
.social-float{position:fixed;right:calc(14px + env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%);z-index:30;display:flex;flex-direction:column;gap:10px}
.social-float a{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--bg);box-shadow:0 6px 18px -8px rgba(0,0,0,.45);transition:transform .15s ease,background .15s ease}
.social-float a:hover{transform:translateX(-3px);background:var(--verde);color:#fff}
.social-float a.wa{background:var(--verde);color:#fff}
.social-float a.wa:hover{background:var(--ink);color:var(--bg)}
.social-float svg{width:20px;height:20px;fill:currentColor}
@media (max-width:700px){
  .social-float{top:auto;bottom:calc(14px + env(safe-area-inset-bottom,0px));transform:none;gap:8px}
  .social-float a{width:40px;height:40px}
  .social-float svg{width:18px;height:18px}
}

/* redes en footer */
.foot-social{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.foot-social a{display:inline-flex;align-items:center;gap:9px;padding:9px 14px 9px 11px;border-radius:999px;border:1px solid #45453F;color:var(--band-ink);text-decoration:none;font-size:.86rem;font-weight:500}
.foot-social a:hover{border-color:var(--verde)}
.foot-social svg{width:16px;height:16px;fill:currentColor}
.foot-social .h{color:var(--band-ink2)}

/* ===== Isotipo (símbolo SVG reutilizable) ===== */
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.iso-acc{fill:var(--acc,#0CA73D)}
.iso-sheet{fill:var(--sheet,currentColor)}

/* ===== Utilidades ===== */
.acc-v{--acc:var(--verde)} .acc-a{--acc:var(--amarillo)} .acc-m{--acc:var(--magenta)}
.sw-v{background:var(--verde)} .sw-a{background:var(--amarillo)} .sw-m{background:var(--magenta)}
.mini{width:30px;height:auto}
.mt-8{margin-top:8px} .mt-14{margin-top:14px} .mt-32{margin-top:32px} .mt-xl{margin-top:clamp(64px,9vw,110px)} .pt-0{padding-top:0}
.span-all{grid-column:1/-1} .fs-sm{font-size:.86rem}
.c-verde{color:var(--verde)} .c-gris{color:#4B4B47} .c-verde-txt{color:var(--verde-txt)} .c-magenta-txt{color:var(--magenta-txt)}
.h-md{font-size:clamp(1.6rem,3.4vw,2.4rem)}
.dot-a{display:inline-block;width:10px;height:10px;border-radius:3px;background:var(--amarillo);margin-right:8px}
.w28{width:28%} .w16{width:16%} .w12{width:12%}
.pad{visibility:hidden}