@import url("https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@700;800;900&family=Figtree:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&display=swap");
/* Paletas día/noche de hunterhotton.com (las elige tema.js según la hora) */
html{--sky:linear-gradient(180deg,#05080E 0%,#0A121B 45%,#10222A 72%,#1A332F 84%,#0A1214 100%);
  --f1:#0C1719;--f2:#070D10;--f3:#030506;--btn-ink:#061014;--btn-hover:#7FF7FF;--glass:#0E1318CC;--sol:#FFD27A}

/* A · cian */
html[data-pal="a"][data-modo="dia"]{color-scheme:light;
  --ground:#F4F9FA;--panel:#FFFFFF;--panel-2:#E8F1F3;--ink:#0D1B22;--ink-2:#4A5F69;--line:#CFE0E5;
  --cyan:#00666F;--cyan-dim:#00666F2E;--amber:#9A5B00;--ok:#00666F;--btn-ink:#FFFFFF;--btn-hover:#004E55;--glass:#FFFFFFCC;
  --sky:linear-gradient(180deg,#A9D9EC 0%,#CDEAF4 45%,#E8F5F8 75%,#F4F9FA 100%);--f1:#9DC0AF;--f2:#5E8C74;--f3:#2C5442;--sol:#FFD27A}

/* B · bosque y ámbar */
html[data-pal="b"][data-modo="noche"]{
  --ground:#0B0E0B;--panel:#121612;--panel-2:#181D17;--ink:#ECE8DC;--ink-2:#A3A08F;--line:#262B22;
  --cyan:#FFB547;--cyan-dim:#FFB54733;--amber:#8FD19E;--ok:#FFB547;--btn-ink:#1A1205;--btn-hover:#FFCB7A;--glass:#121612CC;
  --sky:linear-gradient(180deg,#07090A 0%,#0E120E 45%,#161D16 72%,#22301F 86%,#0B0E0B 100%);--f1:#17231A;--f2:#0F170F;--f3:#080B08}
html[data-pal="b"][data-modo="dia"]{color-scheme:light;
  --ground:#FAF5EA;--panel:#FFFDF7;--panel-2:#F1E8D6;--ink:#1B1F17;--ink-2:#565C4D;--line:#E3D8C2;
  --cyan:#874912;--cyan-dim:#87491229;--amber:#34502F;--ok:#874912;--btn-ink:#FFFFFF;--btn-hover:#6B390D;--glass:#FFFDF7CC;
  --sky:linear-gradient(180deg,#F0CF96 0%,#F5E2BC 40%,#F8EFDC 72%,#FAF5EA 100%);--f1:#A9BE98;--f2:#6E8A5E;--f3:#34502F;--sol:#FFB547}

/* C · aurora */
html[data-pal="c"][data-modo="noche"]{
  --ground:#080B14;--panel:#0E1220;--panel-2:#141A2B;--ink:#E6EBF5;--ink-2:#9AA6BD;--line:#222A3D;
  --cyan:#7CF5C4;--cyan-dim:#7CF5C433;--amber:#B9A4FF;--ok:#7CF5C4;--btn-ink:#04140E;--btn-hover:#A8FADA;--glass:#0E1220CC;
  --sky:linear-gradient(180deg,#060912 0%,#0D1630 40%,#152340 66%,#173C46 84%,#080B14 100%);--f1:#12233A;--f2:#0B1526;--f3:#070B14}
html[data-pal="c"][data-modo="dia"]{color-scheme:light;
  --ground:#F3F7FC;--panel:#FFFFFF;--panel-2:#E6EEF8;--ink:#101828;--ink-2:#4A5872;--line:#D3DEEC;
  --cyan:#0B5F58;--cyan-dim:#0B5F582E;--amber:#5B3FC4;--ok:#0B5F58;--btn-ink:#FFFFFF;--btn-hover:#08463F;--glass:#FFFFFFCC;
  --sky:linear-gradient(180deg,#A9C9F0 0%,#C9DDF6 45%,#E7EFFA 75%,#F3F7FC 100%);--f1:#9DBACB;--f2:#5E8496;--f3:#2F4F5E;--sol:#FFE08A}

/* D · naranja de caza */
html[data-pal="d"][data-modo="noche"]{
  --ground:#0E0E0C;--panel:#151513;--panel-2:#1C1B18;--ink:#EEEBE3;--ink-2:#A8A397;--line:#2A2925;
  --cyan:#FF6A1A;--cyan-dim:#FF6A1A33;--amber:#E8D9B5;--ok:#FF6A1A;--btn-ink:#1A0A02;--btn-hover:#FF8A4A;--glass:#151513CC;
  --sky:linear-gradient(180deg,#0A0A09 0%,#13120F 40%,#1D1C18 66%,#2E2416 84%,#0E0E0C 100%);--f1:#22261F;--f2:#161814;--f3:#0B0C0A}
html[data-pal="d"][data-modo="dia"]{color-scheme:light;
  --ground:#F8F6F1;--panel:#FFFFFF;--panel-2:#EEEAE1;--ink:#161512;--ink-2:#55534C;--line:#DEDACF;
  --cyan:#A3350A;--cyan-dim:#A3350A29;--amber:#2E4A33;--ok:#A3350A;--btn-ink:#FFFFFF;--btn-hover:#7F2807;--glass:#FFFFFFCC;
  --sky:linear-gradient(180deg,#F2C79A 0%,#F5DCC0 35%,#F2EBDD 70%,#F8F6F1 100%);--f1:#A6B7A1;--f2:#6A8566;--f3:#2E4A33;--sol:#FFB070}

/* aplicar */
body,.sky,.btn,.services li{transition:background-color .6s,color .6s,border-color .6s}
.sky{background:var(--sky)!important}
.forest > g:nth-of-type(1){fill:var(--f1)}
.forest > g:nth-of-type(2){fill:var(--f2)}
.forest > g:nth-of-type(3),.forest > rect{fill:var(--f3)}
.btn.primary{color:var(--btn-ink)!important}
.btn.primary:hover{background:var(--btn-hover)!important}
.btn:not(.primary),.services li{background:var(--glass)!important}
.cursor{background:var(--cyan)}

/* día: sin estrellas ni luna; sol y nubes */
.sol,.nubes{position:absolute;pointer-events:none;opacity:0;transition:opacity .8s}
.sol{left:82%;top:9%;width:clamp(52px,6vw,92px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(circle,#FFF7DD 0%,var(--sol) 62%);box-shadow:0 0 40px 14px color-mix(in srgb,var(--sol) 45%,transparent),0 0 120px 40px color-mix(in srgb,var(--sol) 22%,transparent)}
.nubes{inset:0}
.nubes i{position:absolute;display:block;height:clamp(18px,2.2vw,30px);border-radius:999px;background:#FFFFFF;opacity:.85;
  box-shadow:22px -12px 0 6px #FFFFFF,48px -2px 0 2px #FFFFFF;animation:nube 90s linear infinite}
.nubes i:nth-child(1){top:14%;left:8%;width:clamp(90px,10vw,150px)}
.nubes i:nth-child(2){top:24%;left:46%;width:clamp(70px,8vw,120px);animation-duration:120s;opacity:.7}
.nubes i:nth-child(3){top:8%;left:64%;width:clamp(60px,7vw,110px);animation-duration:150s;opacity:.6}
.nubes i:nth-child(4){top:32%;left:20%;width:clamp(50px,6vw,90px);animation-duration:110s;opacity:.55}
@keyframes nube{from{transform:translateX(-6vw)}to{transform:translateX(12vw)}}
html[data-modo="dia"] .sol,html[data-modo="dia"] .nubes{opacity:1}
.sky canvas.stars,.moon{transition:opacity .8s}
html[data-modo="dia"] .sky canvas.stars,html[data-modo="dia"] .moon{opacity:0}
html[data-modo="dia"] .intro *,html[data-modo="dia"] .services li{text-shadow:none!important}
/* la estrella de la firma, de día, dibujada con el color de acento */
html[data-modo="dia"] .star-slot{background:var(--cyan);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M22 88 49 9 74 86 8 38H93Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M22 88 49 9 74 86 8 38H93Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
@media (prefers-reduced-motion: reduce){.nubes i{animation:none}}

/* eslogan */
.slogan{font-family:var(--serif);font-style:italic;font-size:clamp(1.25rem,2.6vw,1.7rem);line-height:1.25;margin:0;color:var(--ink)}

/* switch día/noche */
.modo-switch{position:fixed;top:14px;right:14px;z-index:50;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;
  border:1px solid var(--cyan);background:var(--glass);color:var(--cyan);cursor:pointer;backdrop-filter:blur(4px);padding:0}
.modo-switch svg{width:20px;height:20px;display:block}
.modo-switch:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
html[data-modo="dia"] .modo-switch .ic-sol,html[data-modo="noche"] .modo-switch .ic-luna{display:none}

/* v32: tipografías nuevas en todo el sitio (Big Shoulders Display para títulos y cifras, Figtree para el resto) */
html:root{--mono:"Figtree",system-ui,sans-serif;--serif:"Figtree",system-ui,sans-serif;--firma:"Big Shoulders Display","Figtree",sans-serif;--display:"Big Shoulders Display","Figtree",sans-serif}
h1,h2{font-family:var(--display)!important;text-transform:uppercase;font-weight:900;letter-spacing:.005em;line-height:.92}
.mtiles b,.kgrid b,.tiles b{font-family:var(--display);font-weight:800;letter-spacing:.01em}
/* v32: menú y bordes de las páginas de casos con la estética nueva */
nav.back{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;width:fit-content;max-width:calc(100% - 64px);margin-top:16px;padding:10px 20px;border-radius:999px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-family:var(--texto,"Figtree",sans-serif);font-weight:600}
nav.back a:first-child{font-family:var(--display);font-weight:800;font-size:1.25rem;text-transform:uppercase;letter-spacing:.02em;text-decoration:none;color:var(--ink)}
.win{border-radius:20px;overflow:hidden}
.btn{border-radius:999px}
.tools li{border-radius:999px}
.ccard{border-radius:22px;overflow:hidden}
nav.back{border-radius:24px}@media (min-width:700px){nav.back{border-radius:999px}}

/* v42 (31/10/2026): sin cuadritos al tocar en Android; sin vidrio en vivo en celular */
html{-webkit-tap-highlight-color:transparent}
:focus:not(:focus-visible){outline:none}
@media (hover:none),(max-width:860px){*,*::before,*::after{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}nav.back{background-color:rgba(20,21,24,.94)!important}}
/* aviso dentro del navegador de Instagram */
.ig-salir{position:fixed;left:12px;right:12px;bottom:12px;z-index:90;display:flex;align-items:center;gap:10px;padding:10px 10px 10px 16px;border-radius:16px;background:#17181B;border:1px solid rgba(255,106,26,.55);box-shadow:0 18px 40px -16px rgba(0,0,0,.9);color:#EDE6DA;font:500 .9rem/1.3 var(--texto,"Figtree",system-ui,sans-serif)}
.ig-salir span{flex:1}
.ig-salir a{flex:none;padding:9px 14px;border-radius:999px;background:#FF6A1A;color:#1A0A02;font-weight:700;text-decoration:none}
.ig-salir button{flex:none;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:#EDE6DA;font-size:1.1rem;cursor:pointer}