/*
Theme Name: Manteka Observatory
Theme URI: https://manteka.observer
Author: Pepe Manteca
Description: Bitácora de observación astronómica — archivo navegable por categoría, año, mes y día. Diseño oscuro tipo cuaderno de observatorio. Usa las categorías de WordPress como secciones (sol, cometas, supernovas, novas, grb, neos) y la imagen destacada de cada entrada como placa fotográfica.
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: manteka-observatory
Tags: dark, photography, portfolio, archive, custom-colors
*/

:root{
  --bg:#16181f;
  --fg:#ecead9;
  --muted:#8a8b80;
  --card:#1e2029;
  --card-2:#262834;
  --border:rgba(150,150,180,.18);
  --primary:#e6b66a;
  --primary-fg:#1a1c24;
  --accent:#5a4a2a;
  --grid:rgba(255,255,255,.04);
  --radius:8px;
  --font-display:"Cormorant Garamond","Times New Roman",Georgia,serif;
  --font-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --font-sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:var(--font-sans);min-height:100%}
body{
  background-image:
    radial-gradient(1200px 600px at 80% -10%, rgba(230,182,106,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(80,100,180,.12), transparent 60%),
    linear-gradient(var(--grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size:auto,auto,48px 48px,48px 48px;
  background-attachment:fixed;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:500;letter-spacing:-.01em;margin:0}
.mono{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.22em;color:var(--muted)}

/* Layout */
.container{max-width:1200px;margin:0 auto;padding:0 24px}
.site-header{border-bottom:1px solid var(--border);padding:18px 0;backdrop-filter:blur(6px);position:sticky;top:0;background:rgba(22,24,31,.85);z-index:50}
.site-header .row{display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ffd99a,#b6781e 60%,#3a1f06);box-shadow:0 0 24px rgba(230,182,106,.35)}
.brand-name{font-family:var(--font-display);font-size:22px}
.brand-sub{font-family:var(--font-mono);font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--muted)}
.nav{display:flex;flex-wrap:wrap;gap:6px}
.nav a{padding:8px 14px;border:1px solid var(--border);border-radius:999px;font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--fg)}
.nav a:hover,.nav a.current{border-color:var(--primary);color:var(--primary)}

.site-footer{border-top:1px solid var(--border);margin-top:80px;padding:32px 0;color:var(--muted);font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.site-footer .row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}

/* Hero */
.hero{position:relative;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--card);margin-top:32px}
.hero-grid{display:grid;grid-template-columns:1.2fr 1fr;min-height:420px}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}}
.hero-body{padding:48px}
.hero h1{font-size:54px;line-height:.98;margin-top:14px}
.hero h1 .accent{color:var(--primary)}
.hero p{color:var(--muted);max-width:560px;line-height:1.6;margin:20px 0 28px}
.hero-img{position:relative;background:#0c0d12}
.hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* Category grid */
.section-head{display:flex;align-items:baseline;justify-content:space-between;margin:48px 0 18px}
.section-head h2{font-size:30px}

.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:900px){.cat-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.cat-grid{grid-template-columns:1fr}}
.cat-card{background:var(--card);border:1px solid var(--border);border-radius:10px;overflow:hidden;transition:border-color .2s}
.cat-card:hover{border-color:rgba(230,182,106,.6)}
.cat-card .thumb{aspect-ratio:4/3;background:#0c0d12;overflow:hidden}
.cat-card .thumb img{width:100%;height:100%;object-fit:cover}
.cat-card .body{padding:18px 20px}
.cat-card .body .top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.cat-card h3{font-size:24px}
.cat-card .body p{color:var(--muted);font-size:13px;margin:6px 0 0;line-height:1.55}

/* Recent / photo grid */
.photo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:900px){.photo-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.photo-grid{grid-template-columns:repeat(2,1fr)}}
.photo-tile{display:block}
.photo-tile .ph{aspect-ratio:1/1;background:#0c0d12;border-radius:6px;overflow:hidden;border:1px solid var(--border)}
.photo-tile .ph img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.photo-tile:hover .ph img{transform:scale(1.04)}
.photo-tile .cap{margin-top:8px}

/* Archive (year / month grouping) */
.archive-head{margin:28px 0 12px}
.archive-head h1{font-size:46px}
.archive-head p{color:var(--muted);max-width:680px;line-height:1.6}
.year-block{margin-top:40px;padding-top:24px;border-top:1px solid var(--border)}
.year-block .year-label{font-family:var(--font-display);font-size:42px;color:var(--primary)}
.month-block{margin-top:22px}
.month-block .month-label{font-family:var(--font-mono);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;display:flex;align-items:center;gap:10px}
.month-block .month-label::after{content:"";flex:1;height:1px;background:var(--border)}

/* Calendar — replica del componente React (MonthCalendar) */
.calendar-wrap{margin-top:0}
.calendar-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.cal-nav{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;font-size:20px;line-height:1;color:var(--fg);transition:background-color .15s}
.cal-nav:hover{background:var(--card-2)}
.cal-title{text-align:center}
.cal-month{font-family:var(--font-display);font-size:24px;line-height:1.1}
.cal-year{font-family:var(--font-mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-top:2px}

.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-dows{margin-bottom:6px}
.cal-dows .dow{text-align:center;font-family:var(--font-mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);padding:4px 0}

.cal-days .cell{aspect-ratio:1/1;border-radius:6px;display:flex;align-items:center;justify-content:center;position:relative;font-size:13px;transition:background-color .15s,color .15s}
.cal-days .cell .num{line-height:1}
.cal-days .cell.empty{visibility:hidden}
.cal-days .cell.off{color:rgba(236,234,217,.32)}
.cal-days .cell.has{background:var(--card-2);color:var(--fg);text-decoration:none}
.cal-days .cell.has:hover{background:var(--accent);color:#fff}
.cal-days .cell.has .dot{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--primary)}
.cal-days .cell.today{box-shadow:inset 0 0 0 1px var(--border)}
.cal-days .cell.has.today{box-shadow:inset 0 0 0 1px var(--primary)}

.cal-foot{margin-top:18px;padding-top:14px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.cal-foot .legend{display:flex;align-items:center;gap:8px}
.cal-foot .legend .dot{width:6px;height:6px;border-radius:50%;background:var(--primary);display:inline-block}

/* Single (day) */
.single-hero{display:grid;grid-template-columns:1fr 360px;gap:24px;margin-top:24px}
@media(max-width:900px){.single-hero{grid-template-columns:1fr}}
.single-img{background:#0c0d12;border:1px solid var(--border);border-radius:10px;overflow:hidden}
.single-img img{width:100%;height:auto;display:block}
.single-meta{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:24px}
.single-meta h1{font-size:34px;margin-bottom:12px}
.single-meta .kv{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid var(--border);font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.single-meta .kv:first-of-type{border-top:0}
.single-meta .kv b{color:var(--muted);font-weight:400}
.single-body{margin-top:32px;line-height:1.7;color:#d6d4c4;max-width:760px}
.single-body p{margin:0 0 16px}

/* Pagination */
.pager{display:flex;justify-content:center;gap:8px;margin-top:32px;font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.pager a,.pager span{padding:10px 14px;border:1px solid var(--border);border-radius:999px;color:var(--muted)}
.pager a:hover{border-color:var(--primary);color:var(--primary)}
.pager .current{color:var(--primary);border-color:var(--primary)}

/* Crumbs */
.crumbs{margin-top:24px;font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.crumbs a:hover{color:var(--primary)}
.crumbs .sep{margin:0 8px;opacity:.5}

/* Category header (title + stats top-right) */
.cat-header{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin:18px 0 28px;flex-wrap:wrap}
.cat-title{font-size:64px;line-height:1;margin:0}
.cat-desc{color:var(--muted);max-width:680px;line-height:1.55;margin:12px 0 0;font-size:14px}
.cat-stats{display:flex;flex-direction:column;gap:4px;text-align:right;color:var(--muted);font-size:11px;letter-spacing:.18em}
.cat-stats b{color:var(--fg);font-weight:600;font-family:var(--font-display);font-size:18px;letter-spacing:0;margin-right:6px}

/* Category two-column layout (calendar + featured) */
.cat-layout{display:grid;grid-template-columns:380px 1fr;gap:32px;align-items:start}
@media(max-width:960px){.cat-layout{grid-template-columns:1fr}}
.cat-left{position:sticky;top:88px}
@media(max-width:960px){.cat-left{position:static}}

/* Year chips below calendar */
.year-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;justify-content:center}
.year-chips .chip{padding:6px 14px;border:1px solid var(--border);border-radius:999px;font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;color:var(--muted);transition:border-color .15s,color .15s}
.year-chips .chip:hover{border-color:var(--primary);color:var(--primary)}
.year-chips .chip.active{border-color:var(--primary);color:var(--primary)}

/* Featured grid (Destacadas del mes) */
.featured-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:1100px){.featured-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.featured-grid{grid-template-columns:1fr}}
.featured-card{display:block;text-decoration:none;color:inherit}
.featured-card .ph{position:relative;aspect-ratio:1/1;background:#0c0d12;border:1px solid var(--border);border-radius:8px;overflow:hidden}
.featured-card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.featured-card:hover .ph img{transform:scale(1.04)}
.featured-card .ph .badge{position:absolute;top:8px;right:10px;font-size:11px;letter-spacing:.1em;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8);z-index:2}
.featured-card .cap-overlay{position:absolute;left:12px;right:12px;bottom:38px;color:#fff;font-size:10px;letter-spacing:.16em;text-transform:uppercase;text-shadow:0 1px 3px rgba(0,0,0,.85);line-height:1.4;pointer-events:none}
.featured-card{position:relative}
.featured-card .cap{margin-top:8px;color:var(--muted);font-size:10px;letter-spacing:.16em}

.section-head .back-link{text-decoration:none;color:var(--muted);font-size:11px;letter-spacing:.18em}
.section-head .back-link:hover{color:var(--primary)}