/* ==========================================================================
   Circle webdesign — case.css
   Esettanulmány (single-esettanulmany, archive). base.css után.
   ========================================================================== */

.reading{max-width:52rem}

/* Vissza-link nyila balra mozdul */
.case-back .text-link:hover .arrow{transform:translateX(-4px)}

/* Papírcetli (a főoldallal azonos recept) */
.paper-note{background-color:#fff;background-image:linear-gradient(rgba(255,255,255,.4),rgba(255,255,255,.4)),url("../images/paper-texture.jpg");background-size:cover;background-position:center;color:var(--ink);border-radius:3px;box-shadow:var(--shadow-paper)}

/* ================= CASE ================= */
.case{padding-top:calc(var(--header-h) + clamp(2rem,6vw,4.5rem))}
.case-head{margin-bottom:var(--space-6)}
.case-back{margin-bottom:var(--space-5)}
.case-title{font-family:var(--font-display);font-size:var(--step-5);line-height:.98;letter-spacing:-.01em;max-width:20ch}
.case-sub{font-size:var(--step-1);color:var(--text-soft);max-width:44rem;margin-top:var(--space-4)}
.case-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;margin-top:var(--space-5)}
.case-cat{font-size:var(--step--1);text-transform:uppercase;letter-spacing:.14em;font-weight:700;color:var(--teal);border:1.5px solid currentColor;border-radius:var(--radius-pill);padding:.4rem .9rem}
:root[data-theme="dark"] .case-cat{color:var(--air-bright)}

/* Hero kép + meta cetli jobb alul */
.case-hero{position:relative;margin-block:var(--space-5) calc(var(--space-6) + 1.5rem)}
.case-hero .media{border-radius:var(--radius-large);overflow:hidden;aspect-ratio:16/9;background:var(--tint)}
.case-hero .media img{width:100%;height:100%;object-fit:cover}
.case-meta-note{position:absolute;right:1.75rem;bottom:-1.5rem;z-index:3;width:min(24rem,80%);transform:rotate(-1.2deg);padding:1.15rem 1.35rem 1.25rem}
.case-meta-note .mk{font-size:var(--step--1);letter-spacing:.12em;text-transform:uppercase;color:var(--teal);font-weight:700;margin-bottom:.5rem}
.case-meta-note dl{margin:0;display:grid;gap:.55rem}
.case-meta-note dl>div{display:grid;grid-template-columns:8.5rem 1fr;gap:.5rem}
.case-meta-note dt{font-size:var(--step--1);color:#4a4640;font-weight:600}
.case-meta-note dd{margin:0;font-weight:600}
.tbc{color:var(--orange);font-weight:700;font-size:.9em}

/* Kétoszlopos „címsor balra / szöveg jobbra" (Driftime-minta) */
.case-cols{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(1.5rem,5vw,5rem);align-items:start;padding-block:clamp(2.5rem,6vw,4.5rem);border-top:1px solid var(--border)}
.case-cols h2{font-family:var(--font-display);font-size:var(--step-3);line-height:1.05;max-width:16ch}
.case-cols .body>p+p{margin-top:var(--space-3)}
.case-cols .body{font-size:var(--step-1);color:var(--text-soft)}

/* Szabad tartalom (rich text) — a WP the_content() ide kerül */
.case-body{padding-block:clamp(2.5rem,6vw,4.5rem)}
.case-body>*+*{margin-top:var(--space-4)}
.case-body>h2,.case-body>h3,.case-body>p,.case-body>ul,.case-body>ol,.case-body>blockquote{max-width:var(--content-reading)}
.case-body h2{font-family:var(--font-display);font-size:var(--step-3);line-height:1.05;margin-top:var(--space-7)}
.case-body h2:first-child{margin-top:0}
.case-body h3{font-family:var(--font-display);font-size:var(--step-2);margin-top:var(--space-5)}
.case-body p{font-size:var(--step-0);line-height:1.75}
.case-body ul,.case-body ol{padding-left:1.3rem;display:grid;gap:.5rem}
.case-body figure{margin:var(--space-6) 0}
.case-body figure img,.case-body>img{width:100%;border-radius:var(--radius-large);border:1px solid var(--border)}
.case-body figcaption{margin-top:.6rem;font-size:var(--step--1);color:var(--text-soft);max-width:var(--content-reading)}
.case-body blockquote{margin:var(--space-6) 0;padding-left:var(--space-4);border-left:3px solid var(--orange);font-family:var(--font-display);font-style:italic;font-size:var(--step-2);line-height:1.28}
.case-figures{display:grid;grid-template-columns:1fr;gap:var(--space-4);margin:var(--space-6) 0}
.case-figures.cols-2{grid-template-columns:1fr 1fr}
.case-figures figure{margin:0}
.case-figures .media{border-radius:var(--radius-large);overflow:hidden;aspect-ratio:4/3;background:var(--tint);border:1px solid var(--border)}
.case-figures .media img{width:100%;height:100%;object-fit:cover}
.case-body mark,.case-body .hl{background:linear-gradient(180deg,transparent 58%,rgba(117,184,200,.55) 58% 92%,transparent 92%);color:inherit;padding:0 .08em}

/* Teljes szélességű kiemelt állítás-blokk */
.case-statement{background:var(--teal);color:#fff;border-radius:var(--radius-large);padding:clamp(2.5rem,6vw,5rem);margin-block:clamp(2.5rem,6vw,4.5rem)}
.case-statement p{font-family:var(--font-display);font-size:var(--step-4);line-height:1.08;max-width:24ch}
.case-statement em{font-style:normal;color:var(--orange-bright)}

/* Kép-galéria (lekerekített) */
.case-gallery{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);padding-block:clamp(1.5rem,4vw,3rem)}
.case-gallery .media{border-radius:var(--radius-large);overflow:hidden;aspect-ratio:4/3;background:var(--tint);border:1px solid var(--border)}
.case-gallery .media img{width:100%;height:100%;object-fit:cover}

/* Placeholder (amíg nincs valós kép) */
.ph{width:100%;height:100%;display:grid;place-items:center;text-align:center;padding:1rem;color:var(--text-soft);font-size:var(--step--1);background:repeating-linear-gradient(135deg,transparent 0 22px,rgba(117,184,200,.12) 22px 23px),var(--tint)}
.ph b{display:block;font-size:var(--step--1);letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-bottom:.3rem}

/* Záró CTA */
.case-end{background:var(--air);color:var(--ink);border-radius:var(--radius-large);padding:clamp(2.5rem,6vw,4.5rem);margin-block:clamp(3rem,7vw,5rem);display:grid;gap:var(--space-4);justify-items:start}
.case-end h2{font-family:var(--font-display);font-size:var(--step-4);line-height:1.05;max-width:20ch}
.case-end p{font-size:var(--step-1);max-width:40rem}

/* Esettanulmány-lista (archive) */
.case-archive{padding-top:calc(var(--header-h) + clamp(2rem,6vw,4.5rem));padding-bottom:clamp(3rem,7vw,5rem)}
.case-archive-head{margin-bottom:var(--space-6);max-width:44rem}
.case-archive-head h1{font-family:var(--font-display);font-size:var(--step-5);line-height:.98}
.case-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:var(--space-5)}
.case-list-card{position:relative;display:block;text-decoration:none;color:inherit;border-radius:var(--radius-medium);overflow:hidden;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-3);transition:transform var(--motion-fast)}
.case-list-card:hover{transform:translateY(-4px)}
.case-list-card .media{position:relative;overflow:hidden;aspect-ratio:16/10;background:var(--tint)}
.case-list-card .media img{width:100%;height:100%;object-fit:cover}
.case-list-card .body{padding:var(--space-4)}
.case-list-card .cat{font-size:var(--step--1);text-transform:uppercase;letter-spacing:.12em;font-weight:700;color:var(--teal)}
:root[data-theme="dark"] .case-list-card .cat{color:var(--air-bright)}

@media (max-width:900px){
  .case-cols{grid-template-columns:1fr;gap:var(--space-4)}
  .case-gallery{grid-template-columns:1fr}
  .case-figures.cols-2{grid-template-columns:1fr}
  .case-meta-note{position:static;width:auto;transform:none;margin-top:var(--space-4)}
  .case-hero{margin-bottom:var(--space-6)}
}
@media (prefers-reduced-motion:reduce){
  .case-meta-note{transform:none}
}