/* FINAL PICK 2026-10-01: option 8 (midnight) + prism blue + buttons from 10, softer shine, "sell" = soft silver fade (A). */
/* ======================================================================
   Porta Productions — v5 layer: the Porta OS look (2026-10-01).
   Loaded LAST on every page. Ariel: everything Porta makes takes the look
   of os.portaproductions.com. Source of the values:
   Porta Brain/09 Resources/Brand Assets/porta-tokens.css (Brand.md v5).
   Remove this one <link> to roll the whole site back to v4.
   ====================================================================== */
/* self-hosted, like the rest of the site's type (Google Fonts latin subset) */
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url(/assets/fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 500;font-display:swap;src:url(/assets/fonts/jetbrains-mono-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{
  /* type */
  --sans:'Inter',system-ui,-apple-system,sans-serif;
  --serif:'Inter',system-ui,-apple-system,sans-serif;
  --caps:'Cinzel','Trajan Pro',Georgia,serif;
  --mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
  /* grounds: Porta OS */
  --navy:#0A1019; --ink1:#0A1019; --ink0:#070C13; --band-1:#080D15; --band-2:#060A10;
  --navy-2:#121A25; --navy-3:#162131;
  --s1:#162131; --s2:#1C293B; --s3:#24344A;
  /* type tones */
  --text:#F2F5F9; --body:#B9C1CB; --platinum:#A9BED2; --silver:#8C95A2; --hi:#E6EBF0; --steel:#A9BED2;
  --accent:#A9BED2;
  --gold:#D9B26A; --gold2:#F4DFAE;
  --volt:#3F5E80; --glow:rgba(96,132,170,.45);
  --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.15);
  --edge:inset 0 1px 0 rgba(255,255,255,.07);
  --edge-hot:inset 0 1px 0 rgba(255,255,255,.18);
  --prism:linear-gradient(100deg,#22384D,#3F5E80 25%,#A9BED2 45%,#5A6BFF 65%,#2B4159 85%,#22384D);
}
html,body{background:#0A1019}
body{font-family:var(--sans);color:var(--body);-webkit-font-smoothing:antialiased}

/* --- one dark world: the light "paper" bands become Porta OS panels --- */
.paper,[data-key="light"] body,[data-key="light"]{background:#0A1019 !important;color:var(--text) !important;
  --navy:#F2F5F9;--steel:#A9BED2;--silver:#8C95A2;--platinum:#A9BED2;--text-d:#F2F5F9;--body-d:#B9C1CB;--silver-d:#8C95A2}
.paper{position:relative;background:radial-gradient(70% 60% at 50% 0%,rgba(96,132,170,.16),transparent 70%),#0E1520 !important}
.paper p,.paper em,.paper li{color:var(--body) !important}
.paper .quote p{color:var(--text) !important}
.paper h1,.paper h2,.paper h3,.paper h4{color:var(--text) !important}

/* --- ambient: blue glow + faint grid at the top of the page, like the OS --- */
body::before{content:"";position:fixed;inset:0 0 auto 0;height:100vh;pointer-events:none;z-index:0;
  background-image:linear-gradient(rgba(168,188,208,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(168,188,208,.04) 1px,transparent 1px);
  background-size:56px 56px;-webkit-mask:radial-gradient(ellipse 70% 55% at 58% 0%,#000,transparent 75%);mask:radial-gradient(ellipse 70% 55% at 58% 0%,#000,transparent 75%)}

/* --- type --- */
h1,h2,h3,.h1,.h2{font-family:var(--sans) !important;font-weight:600 !important;letter-spacing:-.03em !important;color:var(--text)}
h1{line-height:1.02 !important}
h2{line-height:1.08 !important}
h3{letter-spacing:-.015em !important}
h1 em,h2 em,h3 em{font-style:normal !important;font-weight:600;background:linear-gradient(100deg,#E6EBF0,#A9BED2 55%,#7F96FF);-webkit-background-clip:text;background-clip:text;color:transparent !important}
p{letter-spacing:0}
/* eyebrows and small labels: Cinzel caps in gold (the one accent) */
#hero .badge,.kicker,.svc-feat .num,.pkg .pcat,.contact-info .l,.foot-grid h3,.lb .lb-cap .c{font-family:var(--caps) !important;font-weight:600 !important;letter-spacing:.24em !important;color:var(--gold) !important;font-size:11.5px !important}
.paper .kicker{color:var(--gold) !important}
.step .no{font-family:var(--mono) !important;color:var(--gold) !important}
.rule{background:var(--gold) !important;opacity:.8}
/* numbers, stats, specs: JetBrains Mono */
.stat b,.stat strong,.stat .n,.stats .n,.stats b{font-family:var(--mono) !important;font-weight:500 !important;letter-spacing:-.02em !important;font-variant-numeric:tabular-nums}
.stat span,.stat small,.ba-tag,.addon-badge,.pkg .tag{font-family:var(--mono) !important;letter-spacing:.14em !important}

/* --- surfaces: Porta OS cards (blue glow top-left, 1px light border) --- */
.card,.tl-item,.after,.pkg,.alc-row,.svc-feat,.addon,.why,.quote,.step,.stat,.svc,.qa,.room-art{
  background:radial-gradient(90% 120% at 20% -30%,rgba(96,132,170,.18),transparent 60%),linear-gradient(180deg,rgba(28,41,59,.95),rgba(18,27,40,.95)) !important;
  border:1px solid var(--line2) !important;box-shadow:0 14px 34px rgba(0,0,0,.42),var(--edge) !important;color:var(--body)}
.quote{border-left:1px solid var(--line2) !important}
.tile,.ytlite,.igt,.addon-img,.ba{border:1px solid var(--line2);box-shadow:0 14px 34px rgba(0,0,0,.42)}
header.scrolled{background:rgba(10,16,25,.86) !important;border-bottom:1px solid var(--line) !important;box-shadow:none !important}
footer{background:#070C13 !important;border-top:1px solid var(--line)}

/* --- buttons: prism for the main action, ghost glass for the rest --- */
.btn,.navbtn,.pbtn,.btn-ghost{font-family:var(--sans) !important;font-weight:600 !important;letter-spacing:.02em !important;text-transform:none !important;font-size:14.5px !important;
  border-radius:30px !important;border:1px solid var(--line2) !important;background:rgba(255,255,255,.03) !important;color:var(--text) !important;box-shadow:none !important}
.btn.solid,.btn-solid,.pkg.featured .pbtn,.navbtn.book-cta{position:relative;overflow:hidden;color:#fff !important;
  background:var(--prism) !important;background-size:320% 100% !important;border:1px solid rgba(255,255,255,.35) !important;
  box-shadow:0 0 22px var(--glow),0 8px 24px rgba(0,0,0,.45) !important;animation:osprism 7s linear infinite;text-shadow:0 1px 6px rgba(10,16,40,.5)}
.btn.solid::after,.btn-solid::after{content:"";position:absolute;top:-10%;bottom:-10%;width:38%;left:-60%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-20deg);animation:osshine 5s cubic-bezier(.4,0,.2,1) 2.2s infinite}
@keyframes osprism{to{background-position:320% 0}}
@keyframes osshine{0%{left:-60%}30%,100%{left:135%}}
@media(hover:hover){.btn:hover,.navbtn:hover,.pbtn:hover{border-color:rgba(168,188,208,.45) !important;background:rgba(96,132,170,.12) !important}
  .btn.solid:hover,.btn-solid:hover,.navbtn.book-cta:hover{filter:brightness(1.1);background:var(--prism) !important;background-size:320% 100% !important}}
.filterbar button,.areas a{font-family:var(--mono) !important;letter-spacing:.12em !important;font-size:11px !important;border-radius:30px !important;border:1px solid var(--line2) !important;background:rgba(255,255,255,.03) !important;color:var(--silver) !important}
.filterbar button.active,.filterbar button[aria-pressed="true"],.paper .filterbar button.active{background:rgba(217,178,106,.1) !important;border-color:rgba(217,178,106,.5) !important;color:var(--gold) !important}
.qa .pm,.paper .qa .pm,.paper .qa.open .pm{background:transparent !important;color:var(--gold) !important;border:1px solid rgba(217,178,106,.45)}
nav.links a:not(.btn)::after{background:var(--gold) !important}
#hero .trust span::before,.svc-feat li::before,.pkg li::before,.bk-sep{background:var(--gold) !important}

/* --- forms: Porta OS inputs --- */
input:not([type=checkbox]):not([type=radio]),select,textarea{background:#1C293B !important;border:1px solid var(--line2) !important;border-radius:10px !important;color:var(--text) !important;font-family:var(--sans) !important}
input:focus,select:focus,textarea:focus{border-color:rgba(168,188,208,.55) !important;box-shadow:0 0 0 3px rgba(96,132,170,.25) !important;outline:none}
::placeholder{color:#7A8494 !important}

@media(prefers-reduced-motion:reduce){.btn.solid,.btn-solid,.navbtn.book-cta,.btn.solid::after,.btn-solid::after{animation:none !important}}
/* K · Midnight (8) + prism blue + square-ish buttons from 10, softer shine */
:root{--navy:#0C121B;--ink1:#0C121B;--pblue:#5A6BFF;--psteel:#A9BED2}
html{background:#0C121B !important}body{background:transparent !important}
section:not(#hero),.darker,.dark,.paper{background:radial-gradient(70% 60% at 50% 0%,rgba(96,132,170,.14),transparent 70%),#0C121B !important}
h1{background:linear-gradient(180deg,#FFFFFF,#A9BED2) !important;-webkit-background-clip:text !important;background-clip:text !important;color:transparent !important}
h2{color:#EEF2F7 !important}
h2 em{background:none !important;color:#9AA8FF !important;-webkit-text-fill-color:#9AA8FF}
h1 em{background:linear-gradient(100deg,#F2F5F9,#A9BED2) !important;-webkit-background-clip:text !important;background-clip:text !important}
.card,.svc-feat,.pkg,.why,.step,.stat,.quote,.qa{background:linear-gradient(180deg,rgba(43,65,89,.55),rgba(12,22,42,.88)) !important;border:1px solid rgba(169,190,210,.22) !important}
.kicker,#hero .badge,.svc-feat .num,.step .no,.pkg .pcat,.contact-info .l,.foot-grid h3{color:#9AA8FF !important}
.rule,#hero .trust span::before,.svc-feat li::before,.pkg li::before,nav.links a:not(.btn)::after{background:#5A6BFF !important}
footer{background:#050C1A !important}
/* buttons: shape from 10, OS prism colours, calmer shine */
.btn,.navbtn,.pbtn{border-radius:6px !important}
.btn.solid,.btn-solid,.navbtn.book-cta,.pkg.featured .pbtn{border-radius:6px !important;background:linear-gradient(100deg,#22384D,#3F5E80 25%,#A9BED2 45%,#5A6BFF 65%,#2B4159 85%,#22384D) !important;background-size:320% 100% !important;animation:osprism 12s linear infinite !important;box-shadow:0 0 14px rgba(90,107,255,.28),0 8px 22px rgba(0,0,0,.4) !important}
.btn.solid::after,.btn-solid::after{background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent) !important;animation:osshine 8s cubic-bezier(.4,0,.2,1) 3s infinite !important}
