/* Mariano Claudio · two themes for the same design.
   bwr = Black, White & Red · ts = Terracotta & Sapphire, glossy */

:root[data-theme="bwr"]{--cob:#0B0B0B;--cobd:#000;--coral:#FF2B2B;--sun:#FFFFFF;--cream:#F3F1EE;--ink:#0B0B0B}
:root[data-theme="ts"]{--cob:#13295F;--cobd:#0C1C46;--coral:#E0582F;--sun:#F4B940;--cream:#F5EBDD;--ink:#0E1A33}

/* ---------- Black, White & Red ---------- */
[data-theme="bwr"] .keyimg,[data-theme="bwr"] #mk{filter:saturate(1.25) drop-shadow(0 10px 14px rgba(0,0,0,.3))!important}
[data-theme="bwr"] .bg-coral .keyimg,[data-theme="bwr"] .badge img{filter:grayscale(1) brightness(2.4) drop-shadow(0 10px 14px rgba(0,0,0,.25))!important}
[data-theme="bwr"] .hero h1 em,[data-theme="bwr"] .journey h2 em,[data-theme="bwr"] .progs h2 em,[data-theme="bwr"] .cover .ctext b em{color:var(--coral)}
[data-theme="bwr"] .bg-cob .k.c-sun,[data-theme="bwr"] .bg-ink .k.c-sun,[data-theme="bwr"] .bg-cob .H .c-sun,[data-theme="bwr"] .bg-cob .H2.c-sun{color:var(--coral)}
[data-theme="bwr"] .map .stop circle{fill:var(--coral)!important}
[data-theme="bwr"] .map .lbl{fill:#fff!important}
[data-theme="bwr"] .step.on b{background:var(--coral)}
[data-theme="bwr"] .pc.c3{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 2px #eee}
[data-theme="bwr"] .pc.c3 li::before{background:var(--coral);color:#fff}
[data-theme="bwr"] .pc.c1 li::before{background:var(--coral);color:#fff}
[data-theme="bwr"] .bars i.on{background:var(--coral)}
[data-theme="bwr"] .opts button.sel{background:var(--ink);border-color:var(--ink)}
[data-theme="bwr"] .done .ok{background:var(--ink);color:#fff}
[data-theme="bwr"] .who,[data-theme="bwr"] .pill{box-shadow:inset 0 0 0 2px var(--ink)}
[data-theme="bwr"] .hero .pill{box-shadow:none}
[data-theme="bwr"] .stars i{background:var(--coral)}
[data-theme="bwr"] .quote .stars i,[data-theme="bwr"] .bg-cob .stars i{background:#fff}
[data-theme="bwr"] .quote .mk{color:var(--coral)}
[data-theme="bwr"] .vsdot{background:var(--coral)!important;color:#fff!important}
[data-theme="bwr"] .switch button.on{background:var(--coral);color:#fff}
[data-theme="bwr"] .mbar a.on{background:var(--coral);color:#fff}

/* ---------- Terracotta & Sapphire, glossy ---------- */
[data-theme="ts"] .hero,[data-theme="ts"] .contact,[data-theme="ts"] .bg-cob,[data-theme="ts"] .cover .img,[data-theme="ts"] .pc.c1{background:radial-gradient(120% 85% at 15% 0%,#2E54B0 0%,var(--cob) 45%,#0A1A45 100%)!important}
[data-theme="ts"] .bg-coral,[data-theme="ts"] .funnel,[data-theme="ts"] .pc.c2{background:radial-gradient(120% 85% at 15% 0%,#F49067 0%,var(--coral) 45%,#B23D1B 100%)!important}
[data-theme="ts"] .bg-sun,[data-theme="ts"] .pc.c3{background:radial-gradient(120% 85% at 20% 0%,#FFE6A0 0%,var(--sun) 45%,#D58F1C 100%)!important}
[data-theme="ts"] .progs,[data-theme="ts"] .bg-ink{background:radial-gradient(120% 85% at 20% 0%,#24365F 0%,var(--ink) 60%)!important}
[data-theme="ts"] .bg-cream,[data-theme="ts"] .pc.c4{background:radial-gradient(120% 85% at 20% 0%,#FFFAF2 0%,var(--cream) 60%,#E9D9C2 100%)!important}

/* glossy spheres: suns, blobs, orbs, stamps */
[data-theme="ts"] .sunball,[data-theme="ts"] .blob,[data-theme="ts"] .pc .orb,[data-theme="ts"] .stamp,[data-theme="ts"] .vsdot,[data-theme="ts"] .done .ok{
  background-image:radial-gradient(circle at 30% 24%,rgba(255,255,255,.85) 0,rgba(255,255,255,.35) 9%,rgba(255,255,255,0) 30%),radial-gradient(circle at 72% 82%,rgba(0,0,0,.28),rgba(0,0,0,0) 58%)!important;
  box-shadow:inset -.6vw -.8vw 2vw rgba(0,0,0,.18),0 2vw 4vw -1.5vw rgba(0,0,0,.35)}

/* glossy pills and buttons, with a moving shine */
[data-theme="ts"] .btn,[data-theme="ts"] .pill,[data-theme="ts"] .call,[data-theme="ts"] .who,[data-theme="ts"] .pills span,[data-theme="ts"] .ft,[data-theme="ts"] .step b,[data-theme="ts"] .chk div,[data-theme="ts"] .opts button.sel,[data-theme="ts"] .fnav .go,[data-theme="ts"] .lang button.on,[data-theme="ts"] .switch button.on,[data-theme="ts"] .pbar a,[data-theme="ts"] .mbar a.on{
  background-image:linear-gradient(180deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,.08) 48%,rgba(0,0,0,0) 52%,rgba(0,0,0,.1) 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 6px rgba(0,0,0,.12),0 8px 22px -10px rgba(0,0,0,.45)}
[data-theme="ts"] .btn,[data-theme="ts"] .pill,[data-theme="ts"] .call,[data-theme="ts"] .who{position:relative;overflow:hidden}
[data-theme="ts"] .btn::after,[data-theme="ts"] .pill::after,[data-theme="ts"] .call::after,[data-theme="ts"] .who::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);transform:translateX(-130%);animation:tsSheen 3.6s ease-in-out infinite;pointer-events:none}
@keyframes tsSheen{55%,100%{transform:translateX(130%)}}

/* glossy cards */
[data-theme="ts"] .pc,[data-theme="ts"] .quote,[data-theme="ts"] .vs>div,[data-theme="ts"] .step.on,[data-theme="ts"] .form{box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 0 0 1px rgba(255,255,255,.12),0 30px 60px -30px rgba(0,0,0,.55)}
[data-theme="ts"] .quote{background:radial-gradient(120% 85% at 15% 0%,#2E54B0 0%,var(--cob) 45%,#0A1A45 100%)}
[data-theme="ts"] .pc::after,[data-theme="ts"] .quote::after{content:"";position:absolute;left:0;right:0;top:0;height:46%;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0));pointer-events:none}
[data-theme="ts"] .vs>div{background-image:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,0) 50%)!important}

/* glossy giant name */
[data-theme="ts"] .hero .giant span{background:linear-gradient(180deg,#FFFFFF 0%,var(--cream) 42%,#D7BF9C 58%,#F7EDE0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
[data-theme="ts"] .contact .big span{background:linear-gradient(180deg,#FFFFFF 0%,var(--cream) 45%,#D7BF9C 60%,#F7EDE0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
[data-theme="ts"] .contact .big span:hover{background:linear-gradient(180deg,#FFF0C4,var(--sun) 50%,#D58F1C);-webkit-background-clip:text;background-clip:text}

/* glossy road */
[data-theme="ts"] .map .ink{filter:drop-shadow(0 6px 8px rgba(19,41,95,.35))}
[data-theme="ts"] .map .stop circle,[data-theme="ts"] .map .home path{filter:drop-shadow(0 4px 6px rgba(0,0,0,.25))}

/* ---------- the switch ---------- */
.themes{display:flex;gap:4px;padding:3px;border-radius:999px;background:rgba(255,255,255,.12)}
.themes button{display:flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;font:700 12px var(--f,system-ui);color:inherit;white-space:nowrap;background:none;border:0;cursor:pointer}
.themes button i{width:22px;height:12px;border-radius:6px;display:inline-block}
.themes button[data-th="bwr"] i{background:linear-gradient(90deg,#0B0B0B 33%,#fff 33% 66%,#FF2B2B 66%)}
.themes button[data-th="ts"] i{background:linear-gradient(90deg,#13295F 33%,#E0582F 33% 66%,#F4B940 66%)}
.themes button.on{background:#fff;color:#111}
@media (max-width:760px){.themes button{font-size:0;gap:0;padding:7px 8px}.themes button i{width:26px;height:14px}}
[data-theme="ts"] .hero .copy{background:none!important}