/* ===== pages.css — visual patterns & page-specific bits ===== */

/* Decorative CSS "visuals" for cards (no external images needed) */
.pattern{width:100%;height:100%}
.pat-stadium{background:
  radial-gradient(120% 80% at 50% 120%,rgba(225,6,0,.4),transparent 60%),
  repeating-linear-gradient(90deg,#15151a 0 22px,#101014 22px 44px),
  linear-gradient(180deg,#1d1d24,#0d0d10)}
.pat-stadium::after{content:"";position:absolute;left:0;right:0;bottom:0;height:46%;
  background:repeating-conic-gradient(from 0deg at 50% 100%,rgba(255,255,255,.04) 0 6deg,transparent 6deg 12deg)}
.pat-crowd{background:
  radial-gradient(circle at 20% 30%,rgba(225,6,0,.5) 0 4px,transparent 5px) ,
  radial-gradient(circle at 60% 60%,rgba(255,255,255,.18) 0 3px,transparent 4px),
  radial-gradient(circle at 80% 25%,rgba(225,6,0,.4) 0 4px,transparent 5px),
  linear-gradient(135deg,#1a0608,#0c0c10)}
.pat-flag{background:
  conic-gradient(from 220deg at 30% 30%,#e10600,transparent 40%),
  linear-gradient(160deg,#161019,#0c0c10);position:relative}
.pat-flag::after{content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 14px,transparent 14px 28px)}
.pat-pitch{background:
  repeating-linear-gradient(0deg,#0f1a0f 0 30px,#0c160c 30px 60px),
  linear-gradient(180deg,#13231a,#0a0f0c)}
.pat-pitch::after{content:"";position:absolute;inset:14%;border:2px solid rgba(255,255,255,.14);border-radius:8px;
  box-shadow:inset 0 0 0 40px transparent}
.pat-roar{background:
  radial-gradient(80% 120% at 50% 0%,rgba(225,6,0,.6),transparent 55%),
  linear-gradient(180deg,#220609,#0c0c10)}
.pat-roar::after{content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(90deg,transparent 0 18px,rgba(255,255,255,.05) 18px 20px)}
.pat-trophy{background:
  radial-gradient(60% 70% at 50% 35%,rgba(255,200,80,.25),transparent 60%),
  conic-gradient(from 200deg at 70% 70%,rgba(225,6,0,.4),transparent 50%),
  linear-gradient(160deg,#171015,#0c0c10)}
.pat-scarf{background:
  repeating-linear-gradient(115deg,#e10600 0 26px,#0a0a0c 26px 40px,#fff 40px 44px,#0a0a0c 44px 58px)}
.pat-night{background:
  radial-gradient(40% 50% at 30% 20%,rgba(225,6,0,.4),transparent 60%),
  radial-gradient(50% 60% at 80% 80%,rgba(120,120,255,.12),transparent 60%),
  linear-gradient(160deg,#10101a,#0a0a0c)}

/* photo overlay if hotlinked image used */
.card-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.card:hover .card-visual img{transform:scale(1.06)}
.card-visual .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,12,.05),rgba(10,10,12,.55));z-index:1}

/* hero background photo + scrim (home) */
.hero-photo{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 35%}
.hero-photo::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,10,12,.72),rgba(10,10,12,.82)),
  linear-gradient(90deg,rgba(10,10,12,.78),rgba(10,10,12,.35))}

/* page-hero background photo + scrim (inner pages) */
.page-hero.has-photo .page-hero-photo{position:absolute;inset:0;z-index:0;overflow:hidden}
.page-hero.has-photo .page-hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%}
.page-hero.has-photo .page-hero-photo::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,10,12,.7),rgba(10,10,12,.86)),
  linear-gradient(90deg,rgba(10,10,12,.72),rgba(10,10,12,.32))}

/* in-article figure photo */
.figure .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* About / editorial */
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.value{background:var(--ink);border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem}
.value .ic{width:44px;height:44px;border-radius:11px;background:rgba(225,6,0,.12);color:var(--red-soft);display:grid;place-items:center;margin-bottom:1rem}
.value .ic svg{width:22px;height:22px}
.value h3{font-size:1.15rem;margin-bottom:.5rem}
.value p{font-size:.95rem}

.timeline{position:relative;margin-top:2rem;padding-left:1.6rem}
.timeline::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:linear-gradient(var(--red),transparent)}
.tl-item{position:relative;padding-bottom:1.8rem}
.tl-item::before{content:"";position:absolute;left:-1.6rem;top:5px;width:12px;height:12px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px rgba(225,6,0,.18)}
.tl-item b{font-family:var(--ff-head);color:var(--white)}
.tl-item span{display:block;font-size:.78rem;color:var(--red-soft);font-weight:700;letter-spacing:.05em;margin-bottom:.2rem}

/* table-ish info */
.facts{width:100%;border-collapse:collapse;margin:1.6rem 0;font-size:.95rem}
.facts th,.facts td{text-align:left;padding:.85rem 1rem;border-bottom:1px solid var(--line)}
.facts th{font-family:var(--ff-head);color:var(--white);font-weight:700;width:42%}
.facts td{color:var(--text-dim)}
.facts tr:hover td,.facts tr:hover th{background:var(--ink)}

/* longread specifics */
.dropcap::first-letter{font-family:var(--ff-head);font-weight:800;font-size:3.4rem;float:left;line-height:.8;padding:.1rem .6rem .2rem 0;color:var(--red-soft)}
.figure{margin:2rem 0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.figure .ph{aspect-ratio:16/8;position:relative;overflow:hidden}
.figure figcaption{padding:.8rem 1.2rem;font-size:.85rem;color:var(--muted);background:var(--ink)}

.toc{background:var(--ink);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem 1.6rem;margin:2rem 0}
.toc h4{font-family:var(--ff-head);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.9rem}
.toc ol{list-style:none;counter-reset:t}
.toc li{counter-increment:t;margin-bottom:.55rem}
.toc a{color:var(--text-dim);font-weight:500}
.toc a::before{content:counter(t,decimal-leading-zero);color:var(--red);font-family:var(--ff-head);font-weight:800;margin-right:.7rem}
.toc a:hover{color:var(--red-soft)}

.byline{display:flex;align-items:center;gap:.9rem;margin:1.4rem 0;padding:1rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.byline .av{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--red),#5a0200);display:grid;place-items:center;font-family:var(--ff-head);font-weight:800;color:#fff}
.byline b{color:var(--white);font-family:var(--ff-head)}
.byline small{color:var(--muted)}

/* contact info strip */
.info-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}

/* legal pages */
.legal{max-width:820px;margin-inline:auto}
.legal h2{margin:2.2rem 0 .9rem;font-size:1.5rem}
.legal p,.legal li{color:var(--text-dim);line-height:1.8}
.legal ul{margin:0 0 1.2rem;padding-left:0}
.legal ul li{position:relative;padding-left:1.5rem;margin-bottom:.55rem}
.legal ul li::before{content:"";position:absolute;left:0;top:.65em;width:7px;height:7px;background:var(--red);border-radius:2px;transform:rotate(45deg)}
.legal .updated{font-size:.85rem;color:var(--muted);margin-bottom:1.4rem}

@media (max-width:880px){
  .values,.info-strip{grid-template-columns:1fr}
}