/*
Theme Name: American Cooking Modern
Author: Ralf Eyertt
Description: Lokales Redesign der traditionellen amerikanischen Rezeptsammlung.
Version: 1.0
Text Domain: american-cooking-modern
*/

:root { --ink:#25221f; --muted:#6d665f; --paper:#fffdf9; --cream:#f5eee3; --rust:#a84827; --dark-rust:#7f321c; --line:#dfd4c5; --shadow:0 18px 50px rgba(65,42,25,.12); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Georgia, 'Times New Roman', serif; font-size:18px; line-height:1.65; }
a { color:var(--rust); text-decoration-thickness:1px; text-underline-offset:3px; }
a:hover { color:var(--dark-rust); }
.screen-reader-text { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-header { background:rgba(255,253,249,.96); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; backdrop-filter:blur(12px); }
.header-inner { max-width:1200px; margin:auto; min-height:78px; padding:14px 28px; display:flex; justify-content:space-between; align-items:center; gap:24px; }
.brand { color:var(--ink); text-decoration:none; display:block; line-height:1.1; }
.brand strong { display:block; font-family:Arial,sans-serif; font-size:21px; letter-spacing:.04em; text-transform:uppercase; }
.brand span { color:var(--muted); font-size:14px; }
.main-navigation ul { list-style:none; padding:0; margin:0; display:flex; align-items:center; gap:22px; }
.main-navigation a { color:var(--ink); text-decoration:none; font-family:Arial,sans-serif; font-size:14px; font-weight:700; letter-spacing:.03em; }
.main-navigation a:hover { color:var(--rust); }

.ac-consent[hidden] { display:none; }
.ac-consent { position:fixed; inset:0; z-index:1000; display:flex; align-items:end; justify-content:center; padding:24px; background:rgba(37,34,31,.45); }
.ac-consent__panel { width:min(680px,100%); padding:28px; border:1px solid var(--line); background:var(--paper); box-shadow:var(--shadow); }
.ac-consent__panel h2 { margin:0 0 10px; font-size:28px; line-height:1.1; }
.ac-consent__panel p { margin:0 0 12px; font-size:16px; line-height:1.5; }
.ac-consent__actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:20px; }
.ac-consent button, .ac-manage-consent { padding:11px 16px; border:1px solid var(--ink); font:700 14px Arial,sans-serif; cursor:pointer; }
.ac-consent__primary { background:var(--rust); border-color:var(--rust)!important; color:#fff; }
.ac-consent__secondary, .ac-manage-consent { background:transparent; color:var(--ink); }
.footer-separator { color:var(--muted); }
.hero { background:linear-gradient(120deg, #5a2417 0%, #a84827 58%, #c96a36 100%); color:white; }
.hero-inner { max-width:1200px; min-height:470px; margin:auto; padding:86px 28px 76px; display:grid; grid-template-columns:minmax(0,760px) 1fr; align-items:end; }
.eyebrow { font-family:Arial,sans-serif; font-size:13px; font-weight:bold; letter-spacing:.14em; text-transform:uppercase; opacity:.86; }
.hero h1 { max-width:800px; margin:14px 0 20px; font-size:clamp(42px,7vw,82px); line-height:.98; letter-spacing:-.04em; }
.hero p { max-width:640px; margin:0; font-size:22px; line-height:1.45; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:32px; }
.button { display:inline-block; border:1px solid transparent; border-radius:2px; padding:13px 19px; color:var(--ink); background:#fff; text-decoration:none; font-family:Arial,sans-serif; font-size:14px; font-weight:bold; }
.button:hover { color:#fff; background:transparent; border-color:#fff; }
.button--quiet { color:#fff; background:transparent; border-color:rgba(255,255,255,.7); }
.button--quiet:hover { color:var(--ink); background:#fff; }
.content-width { max-width:1200px; margin:auto; padding:76px 28px; }
.section-heading { max-width:720px; margin-bottom:34px; }
.section-heading h2 { margin:0 0 8px; font-size:clamp(30px,4vw,48px); line-height:1.1; }
.section-heading p { color:var(--muted); margin:0; }
.recipe-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.recipe-card { min-height:235px; padding:28px; border:1px solid var(--line); background:#fff; box-shadow:0 3px 0 rgba(83,45,27,.03); display:flex; flex-direction:column; justify-content:space-between; text-decoration:none; color:var(--ink); transition:transform .18s ease, box-shadow .18s ease; }
.recipe-card:hover { color:var(--ink); transform:translateY(-5px); box-shadow:var(--shadow); }
.recipe-card:nth-child(3n+1) { border-top:5px solid #a84827; }
.recipe-card:nth-child(3n+2) { border-top:5px solid #bd7630; }
.recipe-card:nth-child(3n) { border-top:5px solid #48655a; }
.recipe-card small { color:var(--rust); font-family:Arial,sans-serif; font-weight:bold; letter-spacing:.1em; text-transform:uppercase; }
.recipe-card h3 { margin:14px 0; font-size:28px; line-height:1.1; }
.recipe-card p { margin:0; color:var(--muted); font-size:16px; line-height:1.45; }
.recipe-card .arrow { margin-top:20px; font-family:Arial,sans-serif; font-size:14px; font-weight:bold; }
.story { background:var(--cream); }
.story-grid { max-width:1200px; margin:auto; padding:76px 28px; display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:start; }
.story h2 { margin-top:0; font-size:42px; line-height:1.1; }
.story p { margin-top:0; }
.story-note { padding:28px; background:#fffdf9; border-left:5px solid var(--rust); box-shadow:var(--shadow); }
.kitchen-tools { background:#2d4b43; color:#fff; }
.kitchen-tools .section-heading p { color:#d7e2dd; }
.tool-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.tool-card { display:block; min-height:180px; padding:28px; border:1px solid rgba(255,255,255,.38); color:#fff; text-decoration:none; }
.tool-card:hover { color:#fff; background:rgba(255,255,255,.1); }
.tool-card small { font-family:Arial,sans-serif; font-weight:bold; letter-spacing:.1em; text-transform:uppercase; opacity:.8; }
.tool-card h3 { margin:12px 0 7px; font-size:29px; line-height:1.1; }
.tool-card p { margin:0; color:#e8efeb; font-size:16px; }
.recent-posts { background:#fff; }
.post-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.post-preview { padding:24px; border:1px solid var(--line); }
.post-preview h3 { font-size:23px; line-height:1.2; margin:8px 0; }
.post-preview p { color:var(--muted); font-size:16px; margin:0; }
.entry-shell { max-width:880px; margin:auto; padding:68px 28px 90px; }
.entry-header { border-bottom:1px solid var(--line); margin-bottom:34px; padding-bottom:24px; }
.entry-title { font-size:clamp(36px,5vw,62px); line-height:1.05; margin:0; }
.entry-content h2 { margin-top:44px; line-height:1.15; }
.entry-content img { max-width:100%; height:auto; }
.entry-content img.is-unavailable { display:none; }
.entry-content table { max-width:100%; }
body.page .entry-content > ul { list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:28px 0; padding:0; }
body.page .entry-content > ul li { margin:0; border:1px solid var(--line); background:#fff; }
body.page .entry-content > ul li a { display:block; padding:15px 18px; color:var(--ink); font-family:Arial,sans-serif; font-size:16px; font-weight:bold; text-decoration:none; }
body.page .entry-content > ul li a:hover { background:var(--cream); color:var(--rust); }
.entry-content .kitchen-index { list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:30px 0 0; padding:0; }
.entry-content .kitchen-index li { margin:0; }
.entry-content .kitchen-index a { min-height:210px; padding:26px; border:1px solid var(--line); border-top:5px solid #a84827; background:#fff; box-shadow:0 3px 0 rgba(83,45,27,.03); color:var(--ink); display:flex; flex-direction:column; text-decoration:none; transition:transform .18s ease, box-shadow .18s ease; }
.entry-content .kitchen-index li:nth-child(3n+2) a { border-top-color:#bd7630; }
.entry-content .kitchen-index li:nth-child(3n) a { border-top-color:#48655a; }
.entry-content .kitchen-index a:hover { color:var(--ink); transform:translateY(-4px); box-shadow:var(--shadow); }
.entry-content .kitchen-index .kitchen-label { color:var(--rust); font-family:Arial,sans-serif; font-size:13px; font-weight:bold; letter-spacing:.1em; text-transform:uppercase; }
.entry-content .kitchen-index .kitchen-title { display:block; margin:12px 0 8px; font-size:28px; font-weight:bold; line-height:1.1; }
.entry-content .kitchen-index .kitchen-text { color:var(--muted); font-size:16px; line-height:1.45; }
.entry-content .kitchen-index .kitchen-link { margin-top:auto; padding-top:18px; font-family:Arial,sans-serif; font-size:14px; font-weight:bold; }
.entry-content .kitchen-index a > small { display:block; color:var(--rust); font-family:Arial,sans-serif; font-size:13px; font-weight:bold; letter-spacing:.1em; text-transform:uppercase; }
.entry-content .kitchen-index a > strong { display:block; margin:12px 0 8px; font-size:28px; line-height:1.1; }
.entry-content .kitchen-index a > span { display:block; color:var(--muted); font-size:16px; line-height:1.45; }
.entry-content .kitchen-index a > em { display:block; margin-top:auto; padding-top:18px; color:var(--ink); font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:bold; }
.recipe-facts { display:inline-block; margin:0 0 30px; padding:9px 13px; background:var(--cream); color:var(--rust); font-family:Arial,sans-serif; font-size:14px; font-weight:bold; }
.recipe-collection { margin:18px 0 0; font-family:Arial,sans-serif; font-size:14px; font-weight:bold; }
.recipe-collection a { color:var(--rust); }
.recipe-image { display:block; width:100%; max-width:760px; height:auto; margin:8px 0 34px; }
.recipe-layout { display:grid; grid-template-columns:minmax(250px,.8fr) minmax(0,1.2fr); gap:46px; margin-top:10px; }
.ingredients { padding:26px; background:var(--cream); }
.ingredients h2,.method h2 { margin:0 0 18px; font-size:26px; line-height:1.15; }
.ingredients ul { margin:0; padding-left:20px; }
.ingredients li { margin-bottom:8px; }
.method ol { margin:0; padding-left:26px; }
.method li { margin:0 0 20px; padding-left:7px; }
.recipe-origin { margin-top:42px; padding-top:22px; border-top:1px solid var(--line); color:var(--muted); font-size:16px; }
.site-footer { background:#25221f; color:#f5eee3; }
.footer-inner { max-width:1200px; margin:auto; padding:42px 28px; display:flex; justify-content:space-between; gap:24px; font-size:15px; }
.site-footer a { color:#fff; }
@media (max-width:760px) { .header-inner { padding:13px 20px; } .main-navigation ul { gap:13px; } .main-navigation a { font-size:12px; } .main-navigation li:nth-child(n+6) { display:none; } .hero-inner { min-height:430px; padding:70px 20px 62px; } .content-width,.story-grid,.entry-shell { padding-left:20px; padding-right:20px; } .recipe-grid,.post-list,.story-grid,body.page .entry-content > ul,.entry-content .kitchen-index,.recipe-layout,.tool-grid { grid-template-columns:1fr; } .story-grid { gap:24px; } .footer-inner { display:block; padding:32px 20px; } }