/* star.css · Openfield · XVII, The Star · "Luminous night field"
   Extends arcana.css: overrides its --arc-* tokens on [data-brand="the-star"], adds the --brand-*
   extras arcana-brand.css reads, then the signature: a twinkling star field over a blue-hour horizon,
   a head that brightens in as your eyes adjust, and lantern amber kept for the booking button. Fonts are SIL OFL. */
/* fonts:begin Syne, Literata */
@font-face { font-family:"Syne"; font-style:normal; font-weight:400 800; font-display:swap; src:url("../../fonts/brands/syne-normal-400-800.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:"Literata"; font-style:italic; font-weight:400 700; font-display:swap; src:url("../../fonts/brands/literata-italic-400-700.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:"Literata"; font-style:normal; font-weight:400 700; font-display:swap; src:url("../../fonts/brands/literata-normal-400-700.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; }
/* fonts:end */

[data-brand="the-star"] {
  --arc-paper: #0a1230;
  --arc-surface: #0f1a45;
  --arc-wash: #060a1c;
  --arc-ink: #e8eef8;
  --arc-muted: #aab7d4;
  --arc-line: #24346a;
  --arc-accent: #9feaf2;
  --arc-on-accent: #0a1230;
  --arc-focus: #f4b860;
  --arc-display: "Syne", "Gill Sans", Corbel, "Segoe UI", sans-serif;
  --arc-body: "Literata", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --arc-radius: 10px;
  --brand-mono: "Syne", "Gill Sans", Corbel, "Segoe UI", sans-serif;
  --brand-accent-2: #f4b860;
  --brand-display-weight: 700;
  --brand-track: -.035em;
  --brand-button-radius: 999px;
  --brand-enter: str-adjust;
  --brand-ease: cubic-bezier(.16, .84, .3, 1);
  --brand-texture:
    radial-gradient(circle, rgba(220, 251, 255, .55) 0 .7px, transparent 1.2px) 0 0 / 61px 53px,
    radial-gradient(circle, rgba(232, 238, 248, .3) 0 .6px, transparent 1.1px) 23px 31px / 97px 83px;
  --brand-bezel: #04070f;
  --brand-bezel-edge: #2b467f;
  --brand-bezel-ink: #9feaf2;
  --brand-glow: rgba(159, 234, 242, .4);
  --brand-wallpaper:
    radial-gradient(5% 4% at 32% 83%, rgba(244, 184, 96, .9), transparent 70%),
    radial-gradient(circle at 70% 18%, #dcfbff 0 1.6px, transparent 2.4px),
    radial-gradient(circle at 76% 24%, #dcfbff 0 1.3px, transparent 2px),
    radial-gradient(circle at 83% 21%, #dcfbff 0 1.5px, transparent 2.2px),
    radial-gradient(circle, rgba(220, 251, 255, .7) 0 .8px, transparent 1.4px) 0 0 / 47px 41px,
    radial-gradient(circle, rgba(232, 238, 248, .4) 0 .6px, transparent 1.2px) 19px 13px / 83px 67px,
    linear-gradient(180deg, #04070f 0%, #0a1230 42%, #2b467f 83%, #04070f 83.3%);
}

/* Signature: a star field that twinkles, a blue-hour horizon, lantern-lit booking. */
[data-brand="the-star"] .abr-head > .abr-shell { position: relative; z-index: 1; }
[data-brand="the-star"] .abr-head::before {
  content: ""; position: absolute; z-index: 0; inset: 0; pointer-events: none;
  background:
    radial-gradient(circle at 72% 16%, #dcfbff 0 1.8px, transparent 2.8px),
    radial-gradient(circle at 79% 26%, #dcfbff 0 1.4px, transparent 2.4px),
    radial-gradient(circle at 87% 20%, #dcfbff 0 1.6px, transparent 2.6px),
    radial-gradient(circle at 93% 34%, #9feaf2 0 1.2px, transparent 2.2px),
    radial-gradient(circle at 58% 9%, #9feaf2 0 1.1px, transparent 2px),
    radial-gradient(circle, rgba(159, 234, 242, .8) 0 .9px, transparent 1.6px) 11px 7px / 113px 89px;
  animation: str-twinkle 5s ease-in-out infinite;
}
[data-brand="the-star"] .abr-head::after {
  content: ""; position: absolute; z-index: 0; inset: auto 0 0; block-size: 45%; pointer-events: none;
  background: linear-gradient(to top, rgba(43, 70, 127, .55), transparent);
}
[data-brand="the-star"] .abr-title__word { animation: str-glow 7s ease-in-out infinite; }
[data-brand="the-star"] .abr-tagline { font-family: var(--arc-body); font-style: italic; font-weight: 400; letter-spacing: 0; }
[data-brand="the-star"] .abr-card__num { border-radius: 50%; box-shadow: 0 0 14px rgba(159, 234, 242, .45); }
[data-brand="the-star"] .abr-button:not([data-kind]) { background: var(--brand-accent-2); border-color: var(--brand-accent-2); color: #0a1230; }
[data-brand="the-star"] .abr-button { font-family: var(--brand-mono); font-weight: 700; letter-spacing: .04em; }
[data-brand="the-star"] .abr-tier { background: linear-gradient(180deg, rgba(43, 70, 127, .35), transparent 60%), var(--arc-paper); }
[data-brand="the-star"] .abr-tier[data-kind="custom"] { border-style: dashed; border-color: rgba(159, 234, 242, .5); }
[data-brand="the-star"] .abr-tier__price sup { color: var(--brand-accent-2); }
[data-brand="the-star"].abr-tile .abr-tile__word { font-weight: 800; }
[data-brand="the-star"].abr-tile::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background: radial-gradient(circle at 80% 22%, #dcfbff 0 1.6px, transparent 2.6px), radial-gradient(circle at 88% 34%, #dcfbff 0 1.2px, transparent 2.2px), radial-gradient(circle at 72% 40%, #9feaf2 0 1.2px, transparent 2.2px), radial-gradient(90% 60% at 50% 120%, rgba(43, 70, 127, .6), transparent 70%);
  transition: opacity .8s var(--brand-ease);
}
@media (hover: hover) {
  [data-brand="the-star"].abr-tile:hover::after { opacity: 1; animation: str-twinkle 2.4s ease-in-out infinite; }
  [data-brand="the-star"] .abr-button:not([data-kind]):hover { box-shadow: 0 0 30px -4px rgba(244, 184, 96, .7); }
}

@keyframes str-adjust { 0% { opacity: 0; transform: translateY(18px); filter: brightness(.25); } 55% { opacity: .75; filter: brightness(1.4); } 100% { opacity: 1; transform: none; filter: none; } }
@keyframes str-twinkle { 50% { opacity: .45; } }
@keyframes str-glow { 0%, 100% { text-shadow: 0 0 .3em rgba(159, 234, 242, .18); } 50% { text-shadow: 0 0 .5em rgba(159, 234, 242, .45); } }