/*
Theme Name: Unicorn Mag
Theme URI: https://unicornhosting.cc
Author: unicornh
Description: Fast, lightweight, niche-adaptive magazine theme. One codebase, per-site "skins" (typography, color mood, hero, iconography) driven by the um_niche option so each site looks purpose-built for its content. Low memory footprint.
Version: 2.1
License: GPL-2.0+
Text Domain: unicorn-mag
*/

:root{
  --brand:#6d28d9; --brand-2:#db2777;
  --ink:#15151c; --muted:#6b7280; --line:#e7e7ee;
  --bg:#ffffff; --card:#ffffff; --soft:#f6f6fa;
  --header-bg:rgba(255,255,255,.92); --header-ink:var(--ink); --header-line:var(--line);
  --radius:14px; --shadow:0 6px 24px rgba(20,20,40,.07); --shadow-hover:0 14px 40px rgba(20,20,40,.14);
  --maxw:1200px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Noto Sans",sans-serif;
  --font-head:var(--font);
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --logo-weight:800; --logo-tt:none; --logo-spacing:-.5px; --logo-pre:"";
  --h-tt:none; --card-radius:var(--radius); --hero-h:420px;
  --cat-radius:999px; --cat-tt:uppercase;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.6;font-size:17px}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,.um-logo{font-family:var(--font-head)}
.um-wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}

/* Header */
.um-header{position:sticky;top:0;z-index:50;background:var(--header-bg);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--header-line)}
.um-bar{display:flex;align-items:center;gap:18px;height:68px}
.um-logo{font-weight:var(--logo-weight);font-size:26px;letter-spacing:var(--logo-spacing);text-transform:var(--logo-tt);background:linear-gradient(90deg,var(--brand),var(--brand-2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;white-space:nowrap}
.um-logo:before{content:var(--logo-pre);-webkit-text-fill-color:var(--brand);opacity:.85}
.um-logo{display:flex;align-items:center;gap:9px}
.um-mark{flex:0 0 auto;display:block}
.um-footer .um-logo{-webkit-text-fill-color:initial;background:none;color:#fff}
.um-nav{display:flex;gap:4px;flex-wrap:wrap;margin-left:8px}
.um-nav a{padding:8px 12px;border-radius:9px;font-size:14px;font-weight:600;color:var(--muted);transition:.15s}
.um-nav a:hover{color:var(--brand);background:var(--soft)}
.um-spacer{flex:1}
.um-search{display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;padding:6px 10px;background:var(--soft)}
.um-search input{border:0;background:transparent;outline:0;font-size:14px;width:120px;color:var(--ink)}
.um-burger{display:none;border:0;background:var(--soft);border-radius:9px;width:42px;height:42px;font-size:20px;cursor:pointer;color:var(--ink)}

/* Hero */
.um-hero{display:grid;grid-template-columns:1.6fr 1fr;gap:22px;margin:28px 0}
.um-hero-main,.um-hero-side .um-card{position:relative;border-radius:var(--card-radius);overflow:hidden;box-shadow:var(--shadow);background:var(--card)}
.um-hero-main{min-height:var(--hero-h)}
.um-hero-main .um-thumb{position:absolute;inset:0}
.um-hero-main .um-thumb img{width:100%;height:100%;object-fit:cover}
.um-hero-main .um-hero-body{position:absolute;inset:auto 0 0 0;padding:28px;background:linear-gradient(to top,rgba(0,0,0,.85),rgba(0,0,0,.15) 70%,transparent);color:#fff}
.um-hero-main h2{font-size:31px;line-height:1.15;margin:.3em 0;color:#fff;text-transform:var(--h-tt)}
.um-hero-side{display:grid;grid-template-rows:1fr 1fr;gap:22px}
.um-hero-side .um-card{min-height:199px}
.um-hero-side .um-thumb{position:absolute;inset:0}
.um-hero-side .um-thumb img{width:100%;height:100%;object-fit:cover}
.um-hero-side .um-hero-body{position:absolute;inset:auto 0 0 0;padding:18px;background:linear-gradient(to top,rgba(0,0,0,.85),transparent);color:#fff}
.um-hero-side h3{font-size:18px;line-height:1.2;margin:.2em 0;color:#fff;text-transform:var(--h-tt)}

/* Concept B — News Portal */
.um-portal{display:grid;grid-template-columns:1.7fr 1fr;gap:24px;margin:28px 0}
.um-portal-main{display:grid;gap:16px;align-content:start}
.um-portal-main .um-hero-main{min-height:340px;position:relative;border-radius:var(--card-radius);overflow:hidden;box-shadow:var(--shadow)}
.um-portal-sub{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.um-trending{background:var(--soft);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;align-self:start}
.um-trending h4{margin:0 0 6px;font-size:13px;text-transform:uppercase;letter-spacing:1.4px;color:var(--brand);font-weight:800}
.um-trending ol{list-style:none;counter-reset:t;margin:0;padding:0}
.um-trending li{counter-increment:t;border-top:1px solid var(--line);padding:13px 0}
.um-trending li:first-child{border-top:0}
.um-trending li a{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:baseline;font-weight:700;font-size:15px;line-height:1.25}
.um-trending li a:before{content:counter(t);font-family:var(--font-head);font-size:22px;font-weight:800;color:var(--line);-webkit-text-stroke:1px var(--brand)}
.um-trending li a:hover{color:var(--brand)}
.um-tr-cat{display:block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--brand);grid-column:2}
@media(max-width:860px){ .um-portal{grid-template-columns:1fr} }

/* Concept C — Minimal / big image */
body.um-l-minimal .um-grid{grid-template-columns:1fr 1fr;gap:36px 30px}
body.um-l-minimal .um-card{border:0;background:transparent;border-radius:0}
body.um-l-minimal .um-card:hover{transform:none;box-shadow:none}
body.um-l-minimal .um-card .um-thumb{aspect-ratio:16/9;border-radius:16px;box-shadow:var(--shadow)}
body.um-l-minimal .um-card:hover .um-thumb{box-shadow:var(--shadow-hover)}
body.um-l-minimal .um-card-body{padding:16px 2px 0}
body.um-l-minimal .um-card h3{font-size:23px;line-height:1.2}
body.um-l-minimal .um-excerpt{font-size:15.5px}
body.um-l-minimal .um-sec h2{font-size:17px}
@media(max-width:700px){ body.um-l-minimal .um-grid{grid-template-columns:1fr} }

/* Section heading */
.um-sec{display:flex;align-items:center;gap:12px;margin:38px 0 18px}
.um-sec h2{font-size:15px;text-transform:uppercase;letter-spacing:1.5px;margin:0;color:var(--brand);font-weight:800;display:flex;align-items:center;gap:8px}
.um-ico{font-size:16px;line-height:1}
.um-sec:after{content:"";flex:1;height:2px;background:linear-gradient(90deg,var(--brand),transparent)}

/* Card grid */
.um-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.um-card{background:var(--card);border:1px solid var(--line);border-radius:var(--card-radius);overflow:hidden;display:flex;flex-direction:column;transition:.18s}
.um-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}
.um-card .um-thumb{aspect-ratio:16/10;background:var(--soft);overflow:hidden}
.um-card .um-thumb img{width:100%;height:100%;object-fit:cover;transition:.4s}
.um-card:hover .um-thumb img{transform:scale(1.05)}
.um-noimg{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font-weight:800;font-size:34px;opacity:.95;font-family:var(--font-head)}
.um-hero-main .um-noimg,.um-hero-side .um-noimg{position:absolute;inset:0}
.um-card-body{padding:16px 18px 20px;display:flex;flex-direction:column;gap:8px;flex:1}
.um-cat{align-self:flex-start;font-size:11px;font-weight:800;text-transform:var(--cat-tt);letter-spacing:.6px;color:var(--brand);background:var(--soft);padding:4px 10px;border-radius:var(--cat-radius)}
.um-card h3{font-size:19px;line-height:1.28;margin:0;font-weight:700;text-transform:var(--h-tt)}
.um-card h3 a:hover{color:var(--brand)}
.um-excerpt{color:var(--muted);font-size:14.5px;margin:0}
.um-meta{margin-top:auto;color:var(--muted);font-size:13px;display:flex;gap:8px;align-items:center}

/* Single */
.um-article{max-width:760px;margin:34px auto}
.um-article-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:14px 0 6px;padding-bottom:16px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.um-byline{display:flex;align-items:center;gap:11px}
.um-avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;font-family:var(--font-head);flex:0 0 auto}
.um-by-meta{display:flex;flex-direction:column;line-height:1.35}
.um-by-name{font-weight:700;font-size:15px}
.um-by-sub{color:var(--muted);font-size:13px}
.um-share{display:flex;gap:8px;align-items:center}
.um-sh{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:var(--muted);transition:.15s;text-transform:none}
.um-sh:hover{background:var(--brand);color:#fff;border-color:var(--brand)}
.um-share-bottom{margin-top:26px;padding-top:18px;border-top:1px solid var(--line);gap:10px}
.um-share-label{font-size:14px;font-weight:700;color:var(--muted);margin-right:4px}
.um-lead{font-size:20px;line-height:1.5;font-weight:600;color:var(--ink)}
.um-readmore-wrap{margin:18px 0 4px}
.um-readmore{display:inline-block;background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#fff;font-weight:700;padding:11px 20px;border-radius:999px;font-size:15px}
.um-readmore:hover{opacity:.92}
.um-article-content a.um-readmore{color:#fff;text-decoration:none}
.um-article h1{font-size:40px;line-height:1.14;letter-spacing:-.5px;margin:.2em 0;text-transform:var(--h-tt)}
.um-article .um-feat{border-radius:var(--card-radius);overflow:hidden;margin:22px 0;box-shadow:var(--shadow)}
.um-article-content{font-size:18px;line-height:1.8}
.um-article-content p{margin:0 0 1.1em}
.um-article-content img{border-radius:10px;margin:1.2em 0}
.um-article-content h2,.um-article-content h3{line-height:1.25;margin:1.4em 0 .5em}
.um-article-content a{color:var(--brand);text-decoration:underline;text-underline-offset:3px}
.um-source{margin-top:28px;padding:16px 18px;background:var(--soft);border-left:4px solid var(--brand);border-radius:10px;font-size:15px;color:var(--muted)}
.um-source a{color:var(--brand);font-weight:600}

/* Pagination */
.um-pager{display:flex;justify-content:center;gap:10px;margin:40px 0;flex-wrap:wrap}
.um-pager a,.um-pager span{padding:10px 16px;border:1px solid var(--line);border-radius:10px;font-weight:600;color:var(--muted)}
.um-pager .current{background:var(--brand);color:#fff;border-color:var(--brand)}
.um-pager a:hover{border-color:var(--brand);color:var(--brand)}

/* Footer */
.um-footer{margin-top:60px;background:var(--ink);color:#cfcfe0;padding:48px 0 30px}
.um-footer .um-logo{font-size:22px}
.um-foot-top{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:32px;padding-bottom:26px;border-bottom:1px solid rgba(255,255,255,.1)}
.um-foot-brand .um-logo{-webkit-text-fill-color:initial;background:none;color:#fff}
.um-foot-tag{color:#9a9aae;font-size:14px;line-height:1.6;margin:12px 0 0;max-width:340px}
.um-foot-col h4{font-size:12px;text-transform:uppercase;letter-spacing:1.2px;color:#8a8aa0;margin:0 0 14px;font-weight:800}
.um-foot-col a{display:block;color:#c9c9d6;font-size:14px;padding:5px 0;transition:.15s}
.um-foot-col a:hover{color:#fff}
.um-disclaimer{margin-top:20px;padding:14px 16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);border-radius:12px;font-size:13px;line-height:1.65;color:#a7a7ba;max-width:860px}
.um-disclaimer strong{color:#d6d6e4}
.um-copy{border-top:1px solid rgba(255,255,255,.1);margin-top:22px;padding-top:18px;font-size:13px;color:#8a8aa0}

/* ============ NICHE SKINS ============ */

/* MARKETS — finance/investing: serif authority, gold rules */
.um-n-markets{--font-head:"Playfair Display",Georgia,"Times New Roman",serif;--logo-spacing:-.3px;--cat-radius:4px}
.um-n-markets .um-sec h2{color:var(--brand)}
.um-n-markets .um-sec:after{background:linear-gradient(90deg,var(--brand-2),transparent)}
.um-n-markets .um-cat{background:transparent;border:1px solid var(--brand);border-radius:4px}
.um-n-markets .um-card h3{font-weight:700}

/* TERMINAL — tech/cybersec/hosting: dark header, mono, neon */
.um-n-terminal{--font-head:"Space Grotesk",var(--font);--header-bg:#0b0e14;--header-ink:#e6edf3;--header-line:#1e2636;--logo-pre:"~/ "}
.um-n-terminal .um-logo{-webkit-text-fill-color:initial;background:none;color:#fff;font-weight:700}
.um-n-terminal .um-logo:before{-webkit-text-fill-color:var(--brand-2);color:var(--brand-2)}
.um-n-terminal .um-nav a{color:#8b93a7;font-family:var(--font-mono);font-size:13px}
.um-n-terminal .um-nav a:hover{color:#fff;background:#151a23}
.um-n-terminal .um-search{background:#151a23;border-color:#232a36}
.um-n-terminal .um-search input{color:#e6edf3}
.um-n-terminal .um-burger{background:#151a23;color:#fff}
.um-n-terminal .um-cat{font-family:var(--font-mono);background:var(--soft);border-radius:5px;text-transform:lowercase}
.um-n-terminal .um-cat:before{content:"# ";opacity:.6}
.um-n-terminal .um-sec h2{font-family:var(--font-mono)}
.um-n-terminal .um-meta{font-family:var(--font-mono);font-size:12px}
.um-n-terminal .um-card:hover{box-shadow:0 0 0 1px var(--brand),0 14px 40px rgba(20,20,40,.14)}

/* CINEMA — movies: full dark, big condensed, gold */
body.um-n-cinema{background:#0b0b0f;color:#e9e9ee;--ink:#e9e9ee;--muted:#9a9aa8;--card:#15151c;--soft:#1c1c25;--line:#26262f;--header-bg:rgba(11,11,15,.9);--header-line:#22222c;--font-head:"Anton",Impact,sans-serif;--h-tt:uppercase;--hero-h:520px;--logo-weight:400;--logo-spacing:1px}
body.um-n-cinema .um-logo{-webkit-text-fill-color:initial;background:linear-gradient(90deg,var(--brand),var(--brand-2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body.um-n-cinema .um-card h3{letter-spacing:.5px;font-weight:400}
body.um-n-cinema .um-footer{background:#050507}
body.um-n-cinema .um-hero-main h2{font-size:44px}

/* ARENA — mma/gaming: uppercase condensed, high energy */
.um-n-arena{--font-head:"Oswald",var(--font);--h-tt:uppercase;--cat-radius:3px;--logo-tt:uppercase;--logo-spacing:.5px}
.um-n-arena .um-cat{background:var(--brand);color:#fff;transform:skewX(-8deg);border-radius:3px}
.um-n-arena .um-sec h2{letter-spacing:2px}
.um-n-arena .um-card h3{font-weight:600}
.um-n-arena .um-sec:after{height:3px}

/* KITCHEN — food/nightlife: warm cream, rounded, appetizing serif */
body.um-n-kitchen{background:#fbf7f0;--soft:#f3ece0;--line:#eadfce;--card:#fffdf9;--font-head:"Fraunces",Georgia,serif;--font:"Nunito",-apple-system,sans-serif;--card-radius:20px;--radius:20px}
body.um-n-kitchen .um-cat{background:var(--brand);color:#fff}
body.um-n-kitchen .um-header{--header-bg:rgba(251,247,240,.92)}

/* ROMANCE — dating: soft rose, elegant serif, rounded */
body.um-n-romance{background:#fdf6f9;--soft:#f8e9f0;--line:#f0dbe6;--card:#fffdfe;--font-head:"Cormorant Garamond",Georgia,serif;--font:"Nunito",-apple-system,sans-serif;--card-radius:18px}
body.um-n-romance .um-hero-main h2,body.um-n-romance .um-article h1{font-weight:700}
body.um-n-romance .um-cat{background:transparent;border:1px solid var(--brand)}
body.um-n-romance .um-header{--header-bg:rgba(253,246,249,.92)}

/* WELLNESS — health: calm, airy, clean rounded sans */
body.um-n-wellness{background:#f4fbfa;--soft:#e6f4f2;--line:#d7ece9;--card:#ffffff;--font:"Mulish",-apple-system,sans-serif;--font-head:"Mulish",sans-serif;--card-radius:18px}
body.um-n-wellness .um-cat{border-radius:999px}
body.um-n-wellness .um-header{--header-bg:rgba(244,251,250,.92)}
body.um-n-wellness .um-sec:after{background:linear-gradient(90deg,var(--brand-2),transparent)}

/* LIBRARY — books: warm paper, serif, editorial */
body.um-n-library{background:#faf6ef;--soft:#f0e9dc;--line:#e6dcc9;--card:#fffdf8;--font-head:"Lora",Georgia,serif;--card-radius:10px}
body.um-n-library .um-card h3{font-weight:600}
body.um-n-library .um-header{--header-bg:rgba(250,246,239,.92)}

/* Responsive */
@media(max-width:980px){
  .um-hero{grid-template-columns:1fr}
  .um-hero-side{grid-template-rows:none;grid-template-columns:1fr 1fr}
  .um-grid{grid-template-columns:repeat(2,1fr)}
  .um-foot-top{grid-template-columns:1fr 1fr;gap:22px}
}
@media(max-width:640px){
  body{font-size:16px}
  .um-nav,.um-search{display:none}
  .um-burger{display:block}
  .um-nav.open{display:flex;position:absolute;top:68px;left:0;right:0;background:var(--bg);flex-direction:column;padding:12px;border-bottom:1px solid var(--line)}
  .um-hero-side{grid-template-columns:1fr}
  .um-grid{grid-template-columns:1fr}
  .um-hero-main h2{font-size:24px}
  .um-article h1{font-size:28px}
}

/* 2.1: accessible visually-hidden homepage H1 */
.um-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
