/* Shared look for every inner page (shop, product, about, contact, terms, privacy). Royal Blue. The home page keeps its own copy of these rules. */
:root { --bg:#03050c; --panel:#0a1022; --line:#18244a; --acc:#6fa8ff; --on:#06102a; --text:#e8eefc; --muted:#9aa8c8; --glow:rgba(42,82,201,.45);
        --fh:Georgia,"Times New Roman",serif; --fb:system-ui,"Segoe UI",sans-serif; }
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { background:var(--bg); color:var(--text); font-family:var(--fb); line-height:1.6; }
a { color:inherit; text-decoration:none; }
.wrap { max-width:1140px; margin:0 auto; padding-left:max(20px,env(safe-area-inset-left,0px)); padding-right:max(20px,env(safe-area-inset-right,0px)); }
.tag { font-size:12px; letter-spacing:.22em; text-transform:uppercase; color:var(--acc); }
h1, h2, h3 { font-family:var(--fh); font-weight:400; text-wrap:balance; }
.btn { display:inline-block; padding:12px 24px; background:var(--acc); color:var(--on); font-weight:700; letter-spacing:.03em; font-size:14px; border:1px solid var(--acc); border-radius:2px; cursor:pointer; text-align:center; }
.btn:hover { background:transparent; color:var(--acc); }
.btn.o { background:transparent; color:var(--acc); }
.btn.o[aria-disabled="true"] { opacity:.6; cursor:default; }
.btn.o[aria-disabled="true"]:hover { background:transparent; }
:is(a, button):focus-visible { outline:2px solid var(--acc); outline-offset:3px; }

header { border-bottom:1px solid var(--line); }
header .wrap { display:flex; justify-content:space-between; align-items:center; height:68px; gap:16px; }
.brand { display:inline-flex; align-items:center; gap:12px; color:var(--acc); letter-spacing:.34em; font-size:18px; text-transform:uppercase; font-family:var(--fh); }
.brand img { width:30px; height:30px; display:block; }
nav { display:flex; gap:28px; font-size:14px; color:var(--muted); }
nav a:hover, nav a[aria-current="page"] { color:#fff; }

.pagehead { padding:56px 0 34px; border-bottom:1px solid var(--line); }
.pagehead h1 { font-size:clamp(32px,5vw,48px); line-height:1.1; margin:10px 0 10px; }
.pagehead p { color:var(--muted); font-size:18px; max-width:38em; }
section { padding:56px 0; border-bottom:1px solid var(--line); }
h2 { font-size:clamp(26px,4vw,34px); line-height:1.15; margin:10px 0 22px; }

.chips { display:flex; gap:8px; flex-wrap:wrap; margin-top:22px; }
.chip { font:inherit; font-size:13px; padding:8px 16px; border:1px solid var(--line); border-radius:2px; color:var(--muted); background:var(--panel); cursor:pointer; }
.chip:hover { color:#fff; }
.chip[aria-pressed="true"] { background:var(--acc); color:var(--on); border-color:var(--acc); font-weight:700; }

.shop { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
.card { background:var(--panel); border:1px solid var(--line); display:flex; flex-direction:column; min-width:0; overflow:hidden; }
.card[hidden] { display:none; }
.card .im { height:200px; overflow:hidden; background:#050505; display:block; }
.card .im img { width:100%; height:100%; object-fit:cover; display:block; }
.card.soon .im { opacity:.75; }
.card .b { padding:18px; display:flex; flex-direction:column; gap:6px; flex:1; }
.card .k { font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--acc); }
.card h3 { font-size:21px; line-height:1.2; }
.card h3 a:hover { color:var(--acc); }
.card p { font-size:14px; color:var(--muted); }
.card .pr { font-family:var(--fh); font-size:22px; color:var(--acc); margin-top:2px; }
.card .pr.s { font-family:var(--fb); font-size:13px; color:var(--muted); }
.card .btn { margin-top:auto; }
.card .b > p + * { margin-top:6px; }
.empty { color:var(--muted); padding:20px 0; }

.feature { display:grid; grid-template-columns:minmax(0,340px) minmax(0,1fr); gap:56px; align-items:center; }
.cover { position:relative; aspect-ratio:3/4; overflow:hidden; border:1px solid var(--acc); box-shadow:0 24px 70px var(--glow); background:#050a1d; max-width:100%; }
.cover img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 18%; }
.cover::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(3,5,12,0) 42%,rgba(3,5,12,.94) 86%); }
.cover .t { position:absolute; left:0; right:0; bottom:24px; text-align:center; z-index:2; padding:0 18px; }
.cover .t small { letter-spacing:.25em; font-size:10px; color:var(--acc); text-transform:uppercase; }
.cover .t b { display:block; font-family:var(--fh); font-weight:400; font-size:28px; line-height:1.1; margin:8px 0 6px; }
.cover .t em { font-style:normal; font-size:12px; color:#b9c6e6; }
.lead { color:var(--muted); font-size:18px; margin-bottom:6px; }
ul.tick { list-style:none; margin:18px 0 22px; }
ul.tick li { padding-left:26px; position:relative; margin-bottom:8px; color:#c9d3ee; }
ul.tick li::before { content:"\2726"; position:absolute; left:0; color:var(--acc); }
.price { font-family:var(--fh); font-size:32px; color:var(--acc); margin-bottom:16px; }
.price small { font-family:var(--fb); font-size:14px; color:var(--muted); margin-left:8px; }
.toc { columns:2; column-gap:48px; font-size:15px; }
.toc div { padding:11px 0; border-bottom:1px solid var(--line); color:#c9d3ee; display:flex; justify-content:space-between; gap:16px; break-inside:avoid; }
.toc span { color:var(--muted); }
.twocol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.box { background:var(--panel); border:1px solid var(--line); padding:22px; }
.box h3 { font-size:20px; margin-bottom:8px; color:var(--acc); }
.box p, .box li { color:var(--muted); font-size:15px; }
.box ul { margin-left:18px; }
.how { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.how div { background:var(--panel); border:1px solid var(--line); padding:20px; font-size:14px; color:var(--muted); }
.how b { display:block; color:var(--acc); font-family:var(--fh); font-weight:400; font-size:19px; margin-bottom:4px; }

.prose { max-width:46em; }
.prose h2 { font-size:26px; margin:34px 0 10px; }
.prose h2:first-child { margin-top:0; }
.prose p, .prose li { color:#c9d3ee; margin-bottom:12px; }
.prose ul { margin:0 0 12px 22px; }
.prose a { color:var(--acc); text-decoration:underline; }
.notice { border:1px dashed var(--acc); padding:14px 18px; margin-bottom:30px; color:var(--muted); font-size:14px; max-width:46em; }
.notice b { color:var(--acc); }
.about { text-align:center; }
.about img { width:180px; height:180px; object-fit:cover; mix-blend-mode:screen; display:block; margin:0 auto 6px; max-width:100%; }
.about .prose { margin:0 auto; text-align:left; }

footer { padding:32px 0; text-align:center; color:var(--muted); font-size:13px; }
.fnav { justify-content:center; flex-wrap:wrap; gap:8px 24px; margin-bottom:14px; }
footer p + p { margin-top:6px; font-size:12px; }

@media (max-width:820px) {
  nav { gap:14px; font-size:13px; flex-wrap:wrap; justify-content:flex-end; flex:1 1 100%; min-width:0; }
  nav a { white-space:nowrap; }
  header .wrap { height:auto; min-height:60px; flex-wrap:wrap; padding-top:10px; padding-bottom:10px; }
  .brand { font-size:15px; letter-spacing:.26em; }
  .pagehead { padding:40px 0 26px; }
  section { padding:44px 0; }
  .feature { grid-template-columns:1fr; gap:34px; }
  .cover { max-width:300px; margin:0 auto; width:100%; }
  .toc { columns:1; }
  .twocol, .how { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }