/*
Theme Name: Cupertino Observer
Theme URI: https://cupertinoobserver.com
Author: Cupertino Observer Redaktion
Description: Unabhaengiges Tech-Magazin ueber Apple-Produkte, Software-Qualitaet und die Update-Politik von Apple. Kritisch, aber fair.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: cupertino-observer
*/

:root{
  --co-bg: #ffffff;
  --co-bg-alt: #f5f5f7;
  --co-text: #1d1d1f;
  --co-text-muted: #6e6e73;
  --co-border: #d2d2d7;
  --co-accent: #cc5500;
  --co-accent-hover: #a84600;
  --co-link: #0066cc;
  --co-card-bg: #ffffff;
  --co-header-bg: rgba(255,255,255,0.85);
  --co-sev-info: #0071e3;
  --co-sev-mittel: #cc8b00;
  --co-sev-kritisch: #d70015;
  --co-sev-positiv: #1e8e3e;
  --co-radius: 14px;
  --co-maxw: 1160px;
  --co-font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

@media (prefers-color-scheme: dark){
  :root{
    --co-bg: #000000;
    --co-bg-alt: #1c1c1e;
    --co-text: #f5f5f7;
    --co-text-muted: #98989d;
    --co-border: #38383a;
    --co-accent: #ff8a3d;
    --co-accent-hover: #ffa15e;
    --co-link: #2997ff;
    --co-card-bg: #1c1c1e;
    --co-header-bg: rgba(0,0,0,0.75);
  }
}

*{ box-sizing: border-box; }
html{ -webkit-text-size-adjust: 100%; }
body{
  margin: 0;
  font-family: var(--co-font);
  background: var(--co-bg);
  color: var(--co-text);
  line-height: 1.6;
  font-size: 17px;
  -webkit-font-smoothing: antialiased;
}
img{ max-width: 100%; height: auto; display: block; border-radius: var(--co-radius); }
a{ color: var(--co-link); text-decoration: none; }
a:hover{ text-decoration: underline; }
.co-wrap{ max-width: var(--co-maxw); margin: 0 auto; padding: 0 24px; }
h1,h2,h3,h4{ line-height: 1.15; letter-spacing: -0.01em; font-weight: 700; }
h1{ font-size: clamp(2rem, 4vw, 3.2rem); }
h2{ font-size: clamp(1.4rem, 2.5vw, 2rem); }
p{ margin: 0 0 1.1em; }

/* skip link */
.co-skip{ position:absolute; left:-999px; top:auto; background:var(--co-accent); color:#fff; padding:10px 18px; border-radius:8px; z-index:999; }
.co-skip:focus{ left: 16px; top: 16px; }

/* header */
.co-header{
  position: sticky; top: 0; z-index: 50;
  background: var(--co-header-bg);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--co-border);
}
.co-header-inner{ display:flex; align-items:center; gap: 28px; height: 60px; }
.co-logo{ display:flex; align-items:center; gap:10px; font-weight:800; font-size:1.12rem; color: var(--co-text); white-space: nowrap; }
.co-logo svg{ flex-shrink:0; }
.co-logo:hover{ text-decoration:none; opacity:.85; }
.co-nav{ display:flex; gap: 22px; flex:1; }
.co-nav a{ color: var(--co-text); font-size: .95rem; font-weight: 500; }
.co-nav a:hover{ color: var(--co-accent); text-decoration:none; }
.co-header-search{ margin-left:auto; }
.co-header-search form{ display:flex; align-items:center; background: var(--co-bg-alt); border-radius: 20px; padding: 6px 14px; }
.co-header-search input[type=search]{ border:none; background:transparent; outline:none; font-size:.9rem; width:150px; color:var(--co-text); }
.co-burger{ display:none; background:none; border:none; font-size:1.4rem; cursor:pointer; color:var(--co-text); }

@media (max-width: 820px){
  .co-nav{ display:none; position:absolute; top:60px; left:0; right:0; background:var(--co-bg); flex-direction:column; padding:16px 24px; border-bottom:1px solid var(--co-border); gap:14px;}
  .co-nav.co-nav-open{ display:flex; }
  .co-burger{ display:block; }
  .co-header-search{ display:none; }
}

/* hero / featured */
.co-hero{ padding: 40px 0 20px; }
.co-hero-post{ display:grid; grid-template-columns: 1.1fr .9fr; gap: 36px; align-items:center; }
.co-hero-post img{ aspect-ratio: 16/10; object-fit: cover; width:100%; }
.co-hero-eyebrow{ display:flex; gap:10px; align-items:center; margin-bottom:10px; }
.co-hero-post h1{ margin: 6px 0 14px; }
.co-hero-excerpt{ color: var(--co-text-muted); font-size: 1.08rem; }
@media (max-width: 820px){ .co-hero-post{ grid-template-columns: 1fr; } }

/* badges */
.co-badge{ display:inline-flex; align-items:center; gap:6px; font-size:.72rem; font-weight:700; letter-spacing:.02em; text-transform:uppercase; padding: 4px 10px; border-radius: 20px; }
.co-badge-cat{ background: var(--co-bg-alt); color: var(--co-text-muted); }
.co-badge-cat:hover{ text-decoration:none; background: var(--co-border); }
.co-badge-sev-info{ background: color-mix(in srgb, var(--co-sev-info) 15%, transparent); color: var(--co-sev-info); }
.co-badge-sev-mittel{ background: color-mix(in srgb, var(--co-sev-mittel) 18%, transparent); color: var(--co-sev-mittel); }
.co-badge-sev-kritisch{ background: color-mix(in srgb, var(--co-sev-kritisch) 15%, transparent); color: var(--co-sev-kritisch); }
.co-badge-sev-positiv{ background: color-mix(in srgb, var(--co-sev-positiv) 15%, transparent); color: var(--co-sev-positiv); }
.co-meta{ color: var(--co-text-muted); font-size:.88rem; }

/* grid */
.co-section-title{ display:flex; align-items:baseline; justify-content:space-between; margin: 48px 0 20px; padding-top: 24px; border-top: 1px solid var(--co-border); }
.co-section-title h2{ margin:0; }
.co-section-title a{ font-size:.9rem; font-weight:600; }
.co-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
@media (max-width: 980px){ .co-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px){ .co-grid{ grid-template-columns: 1fr; } }
.co-card{ background: var(--co-card-bg); border:1px solid var(--co-border); border-radius: var(--co-radius); overflow:hidden; display:flex; flex-direction:column; transition: transform .15s ease, box-shadow .15s ease; }
.co-card:hover{ transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0,0,0,.08); }
.co-card a.co-card-link{ color:inherit; text-decoration:none; display:flex; flex-direction:column; height:100%; }
.co-card img{ border-radius:0; aspect-ratio: 16/10; object-fit:cover; width:100%; }
.co-card-body{ padding: 16px 18px 20px; display:flex; flex-direction:column; gap:8px; flex:1; }
.co-card-body h3{ margin: 4px 0; font-size:1.08rem; }
.co-card-excerpt{ color: var(--co-text-muted); font-size:.92rem; margin:0; }

/* single post */
.co-single-header{ padding: 44px 0 20px; max-width: 780px; margin: 0 auto; }
.co-single-header h1{ margin: 14px 0; }
.co-single-thumb{ max-width: var(--co-maxw); margin: 0 auto 32px; padding: 0 24px; }
.co-single-thumb img{ width:100%; aspect-ratio: 16/9; object-fit:cover; }
.co-content{ max-width: 720px; margin: 0 auto; padding: 0 24px 60px; font-size: 1.08rem; }
.co-content h2{ margin-top: 1.6em; }
.co-content h3{ margin-top: 1.4em; }
.co-content blockquote{ border-left: 4px solid var(--co-accent); margin: 1.6em 0; padding: .4em 0 .4em 1.2em; color: var(--co-text-muted); font-style: italic; }
.co-content ul, .co-content ol{ padding-left: 1.4em; }
.co-content figcaption{ color: var(--co-text-muted); font-size:.85rem; text-align:center; margin-top:8px; }
.co-content pre{ background: var(--co-bg-alt); padding: 16px; border-radius: 10px; overflow-x:auto; }

/* bug report box */
.co-bugbox{ max-width:720px; margin: 0 auto 32px; padding: 20px 24px; background: var(--co-bg-alt); border-radius: var(--co-radius); border: 1px solid var(--co-border); }
.co-bugbox-title{ font-weight:700; font-size:.85rem; text-transform:uppercase; letter-spacing:.03em; color: var(--co-text-muted); margin-bottom:12px; }
.co-bugbox-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 14px; }
.co-bugbox-item dt{ font-size:.75rem; color: var(--co-text-muted); text-transform:uppercase; letter-spacing:.03em; margin-bottom:4px;}
.co-bugbox-item dd{ margin:0; font-weight:600; }

/* disclaimer */
.co-disclaimer{ max-width:720px; margin: 40px auto 0; padding: 16px 20px; border:1px dashed var(--co-border); border-radius: var(--co-radius); font-size:.85rem; color: var(--co-text-muted); }

/* author box */
.co-authorbox{ max-width:720px; margin: 40px auto 0; padding: 20px; background: var(--co-bg-alt); border-radius: var(--co-radius); display:flex; gap:16px; align-items:center; }
.co-authorbox img{ border-radius:50%; width:56px; height:56px; }

/* pagination */
.co-pagination{ display:flex; gap:10px; justify-content:center; margin: 40px 0 60px; }
.co-pagination a, .co-pagination span{ padding: 8px 14px; border:1px solid var(--co-border); border-radius:8px; font-size:.9rem; }
.co-pagination .current{ background: var(--co-accent); color:#fff; border-color: var(--co-accent); }

/* footer */
.co-footer{ background: var(--co-bg-alt); border-top: 1px solid var(--co-border); margin-top: 60px; padding: 48px 0 28px; }
.co-footer-grid{ display:grid; grid-template-columns: 2fr 1fr 1fr; gap: 32px; margin-bottom: 32px; }
.co-footer h4{ font-size:.85rem; text-transform:uppercase; letter-spacing:.04em; color: var(--co-text-muted); margin: 0 0 12px; }
.co-footer ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; }
.co-footer a{ color: var(--co-text); font-size:.92rem; }
.co-footer-bottom{ border-top: 1px solid var(--co-border); padding-top: 20px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; color: var(--co-text-muted); font-size:.82rem; }
@media (max-width: 700px){ .co-footer-grid{ grid-template-columns: 1fr; } }

/* archive header */
.co-archive-header{ padding: 44px 0 10px; text-align:center; }
.co-archive-header p{ color: var(--co-text-muted); }

/* comments (minimal) */
.co-comments{ max-width:720px; margin: 20px auto 0; padding: 0 24px; }

.screen-reader-text{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); }