/* Style looks: tapping one of the seven Deluxe style cards restyles the whole
   site in that look (body[data-look]); the "Back to the normal look" chip undoes it.
   looks.js runs the portal reveal. The factory (world.js) has its own 3D version. */

.sty{cursor:pointer}
.sty .sw{transition:transform .2s}
.sty:hover .sw{transform:scale(1.03)}
.sty .try-look{display:block;margin-top:8px;font-size:.72rem;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--ai)}
.sty.on{outline:3px solid var(--ai);outline-offset:4px;border-radius:var(--r-md)}

.look-chip{position:fixed;left:16px;bottom:18px;z-index:65;display:none;align-items:center;gap:10px;border-radius:30px;padding:8px 8px 8px 16px;
  background:linear-gradient(var(--panel),var(--panel)),var(--bg);border:1px solid var(--edge-strong);color:var(--text);box-shadow:var(--shadow);font-weight:700;font-size:.86rem;max-width:calc(100% - 32px)}
.look-chip.on{display:flex}
.look-chip button{border:0;border-radius:20px;padding:7px 12px;font-weight:800;cursor:pointer;background:var(--cta);color:#04130c;white-space:nowrap}
.look-ring{position:fixed;z-index:200;pointer-events:none;border-radius:50%;border:4px solid #7ffcff;
  box-shadow:0 0 18px #2fd6ff,0 0 44px #1fb6ff,inset 0 0 22px #2fd6ff;filter:url(#lookWobble);opacity:0}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-new(root){z-index:2}

/* shared overrides for the light looks: text that is hard-coded white elsewhere */
body.look-light .logo,body.look-light .rotor,body.look-light .acro b,body.look-light .acro span:hover,body.look-light .sty .cap b,
body.look-light .ways a,body.look-light footer h4,body.look-light .links a:hover,body.look-light .links a.on,body.look-light .filters button:hover,
body.look-light .opts input:checked+span,body.look-light .music.on,body.look-light .music:hover,body.look-light .voice.on,body.look-light .hello-chip:hover{color:var(--text)}
body[data-look] header.nav{background:color-mix(in srgb,var(--bg) 86%,transparent)}
body[data-look] footer{background:var(--bg-2)}
body[data-look] .hero canvas{opacity:.35}

/* Illustrated: warm paper, ink lines, a hand-drawn feel */
body[data-look="illustrated"]{--bg:#f6e7c8;--bg-2:#f2dcb4;--panel:#fff4dc;--panel-2:#f6e2bc;--text:#3b2412;--muted:#5f4127;--faint:#6f5136;
  --ai:#9c3d1c;--cta:#c4491f;--gold:#8f4315;--edge:rgba(59,36,18,.22);--edge-strong:rgba(59,36,18,.55);
  --head:Georgia,"Times New Roman",serif;--display:Georgia,"Times New Roman",serif;--shadow:4px 4px 0 rgba(59,36,18,.35);
  background:#f6e7c8 radial-gradient(circle at 20% 10%,rgba(255,255,255,.6),transparent 40%)}
body[data-look="illustrated"] .btn{color:#fff8ec;box-shadow:3px 3px 0 #3b2412;border:2px solid #3b2412}
body[data-look="illustrated"] h1,body[data-look="illustrated"] h2{font-style:italic}

/* Neon: late-night glow */
body[data-look="neon"]{--bg:#0a0014;--bg-2:#12001f;--panel:#1a0630;--panel-2:#240a40;--text:#fdf0ff;--muted:#c9a6e6;--faint:#ab8bc9;
  --ai:#7ffcff;--cta:#ff2e88;--gold:#ffe45e;--edge:rgba(127,252,255,.18);--edge-strong:rgba(255,46,136,.6);
  background:#0a0014 radial-gradient(circle at 30% 0%,rgba(255,46,136,.25),transparent 55%)}
body[data-look="neon"] h1,body[data-look="neon"] h2{text-shadow:0 0 12px rgba(255,46,136,.7),0 0 28px rgba(127,252,255,.35)}
body[data-look="neon"] .btn{color:#1a0010;box-shadow:0 0 18px rgba(255,46,136,.7)}

/* Linen: soft and calm */
body[data-look="linen"]{--bg:#efe9df;--bg-2:#e6dfd2;--panel:#f8f4ec;--panel-2:#ece5d8;--text:#3d3a52;--muted:#57546b;--faint:#5e5b72;
  --ai:#456341;--cta:#8fae8b;--gold:#6b5333;--edge:rgba(61,58,82,.14);--edge-strong:rgba(95,127,91,.5);
  --head:Georgia,"Times New Roman",serif;--display:Georgia,"Times New Roman",serif;--shadow:0 14px 40px rgba(61,58,82,.12);background:#efe9df}
body[data-look="linen"] h1{text-transform:none;font-weight:400;letter-spacing:0}
body[data-look="linen"] .btn{color:#1f2a1e;box-shadow:none}

/* Blueprint: technical drawing */
body[data-look="blueprint"]{--bg:#1f3a5f;--bg-2:#1a3254;--panel:rgba(255,255,255,.05);--panel-2:rgba(255,255,255,.09);--text:#ffffff;--muted:#cfe0f5;--faint:#9cb7d8;
  --ai:#ffffff;--cta:#ffffff;--gold:#ffd84d;--edge:rgba(255,255,255,.35);--edge-strong:#ffffff;--r-sm:0;--r-md:0;--r-lg:0;
  --head:Consolas,"Courier New",monospace;--display:Consolas,"Courier New",monospace;--font:Consolas,"Courier New",monospace;--shadow:none;
  background:#1f3a5f repeating-linear-gradient(0deg,rgba(255,255,255,.08) 0 1px,transparent 1px 24px),repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0 1px,transparent 1px 24px)}
body[data-look="blueprint"] .btn{color:#1f3a5f;border-radius:0;box-shadow:none}
body[data-look="blueprint"] .alt{background:transparent;border-style:dashed}

/* Vintage Poster: old travel poster */
body[data-look="vintage"]{--bg:#fff3d6;--bg-2:#f8e3b0;--panel:#fff8e6;--panel-2:#f5dfa8;--text:#0b3d6b;--muted:#2e5e86;--faint:#44688a;
  --ai:#a14a06;--cta:#0b3d6b;--gold:#a14a06;--edge:rgba(11,61,107,.3);--edge-strong:#0b3d6b;--shadow:6px 6px 0 #0b3d6b;
  background:#fff3d6 repeating-conic-gradient(from 0deg at 50% 0%,rgba(245,197,24,.12) 0 6deg,transparent 6deg 12deg)}
body[data-look="vintage"] h1,body[data-look="vintage"] h2{text-transform:uppercase;letter-spacing:1px;font-family:var(--display);font-weight:400}
body[data-look="vintage"] .btn{color:#fff7dc;box-shadow:4px 4px 0 #f08a24}

/* Cinematic: full-screen and moody */
body[data-look="cinematic"]{--bg:#000c14;--bg-2:#001c2e;--panel:#032838;--panel-2:#043a4e;--text:#e6fbff;--muted:#8ec9d6;--faint:#7fb4c2;
  --ai:#18c1c1;--cta:#ff9a3c;--gold:#ffb070;--edge:rgba(24,193,193,.2);--edge-strong:rgba(24,193,193,.55);
  background:#000c14 linear-gradient(180deg,#001c2e,#000c14 40%)}
body[data-look="cinematic"] h1,body[data-look="cinematic"] h2{text-transform:uppercase;letter-spacing:3px;font-weight:400;font-family:var(--display)}
body[data-look="cinematic"] .btn{color:#1a0a00}

/* Luxury: black and gold */
body[data-look="luxury"]{--bg:#0b0b0b;--bg-2:#131109;--panel:#17140c;--panel-2:#211c10;--text:#f6ecd2;--muted:#c9b98e;--faint:#8f8160;
  --ai:#c9a227;--cta:#c9a227;--gold:#e6c35a;--edge:rgba(201,162,39,.22);--edge-strong:rgba(201,162,39,.6);
  --head:Georgia,"Didot","Times New Roman",serif;--display:Georgia,"Didot","Times New Roman",serif;background:#0b0b0b}
body[data-look="luxury"] h1{text-transform:uppercase;letter-spacing:4px;font-weight:400}
body[data-look="luxury"] .btn{color:#0b0b0b;box-shadow:0 8px 24px rgba(201,162,39,.25)}

/* sections that hard-code the default navy follow the look too */
body[data-look] .hero{background:radial-gradient(900px 500px at 78% -10%,color-mix(in srgb,var(--ai) 22%,transparent),transparent 60%),linear-gradient(170deg,var(--bg-2),var(--bg) 78%)}
body[data-look] .band{background:linear-gradient(150deg,var(--panel-2),var(--panel))}
body[data-look] .sub,body[data-look] .stat p,body[data-look] .ticks li,body[data-look] .faq p{color:var(--muted)}
body[data-look] .msg.bot,body[data-look] .asks button,body[data-look] .yes-list li{color:var(--text)}

/* readable text in every look: outline buttons sit on the page, not on a filled button */
body[data-look] .btn.ghost{color:var(--text);box-shadow:none}
body[data-look] .news,body[data-look] .news:hover,body[data-look] .band .lead,body[data-look] .band .ticks li,body[data-look] .detail p,body[data-look] .pcard p,
body[data-look] .promise p,body[data-look] .proof small,body[data-look] .yes-fact{color:var(--text)}
body[data-look] .way{color:var(--text)}
body[data-look] .call-hd small{color:var(--muted)}
body.look-light .proof>div{background:var(--panel)}
body[data-look="illustrated"] .look-chip button:not(.sf-open),body[data-look="vintage"] .look-chip button:not(.sf-open),
body[data-look="illustrated"] .news b,body[data-look="vintage"] .news b{color:#fff7dc}
body.look-light .filters button.on,body.look-light .tabs button.on{color:#fff}
body.look-light .fname{color:var(--text)}
body.look-light .scan{background:var(--panel-2)}
body[data-look] .tile small{color:var(--muted)}
body[data-look] .tile.on{background:var(--panel-2)}
body.look-light .scan .hd{color:var(--muted)}