/* ============================================================
   1. TOKENEK  — "tango noir" (a módosított Figma grafikából)
   ============================================================ */
:root{
  --ink:           #1A0F1E;  /* legmélyebb háttér (rgb 26,15,30) */
  --plum:          #231028;  /* hero & footer háttér (rgb 35,16,40) */
  --almost-black:  #241024;  /* váltakozó szekció-háttér (rgb 36,16,36) */
  --deep-plum:     #1A0F1E;  /* legmélyebb szekció-háttér — Fotográfia (rgb 26,15,30) */
  --royal-purple:  #451F43;  /* kártya-akcent */
  --purpleish:     #9D517D;  /* kiemelt blokk, aktív szegmens, hover */
  --dark-pink:     #CC779C;  /* akcent: link, overline, vonalak */
  --lavender:      #E1ACCB;  /* címek, világos akcent */
  --rosy:          #ECD8DA;  /* törzsszöveg */
  --cream:         #F2EAE4;  /* blog-cím, e-mail, logó */

  --rosy-dim:  rgba(236,216,218,0.66);
  --hairline:  rgba(225,172,203,0.16);
  --line-strong: rgba(201,155,196,0.6);

  --font-script: 'Great Vibes', cursive;
  --font-serif:  'Liberation Serif', 'Times New Roman', Times, serif;
  --font-body:   'Mulish', system-ui, -apple-system, sans-serif;
  --font-ui:     'Inter', system-ui, sans-serif;

  --maxw: 1180px;
  --gutter: clamp(1.25rem, 5vw, 5rem);
  --section-y: clamp(4rem, 8vw, 7rem);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  font-family:var(--font-body);
  font-size:16px; line-height:1.7; font-weight:400;
  color:var(--rosy); background:var(--ink);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{ color:inherit; text-decoration:none; }
[hidden]{ display:none !important; }
img{ max-width:100%; display:block; }
:focus-visible{ outline:2px solid var(--dark-pink); outline-offset:3px; border-radius:2px; }
::selection{ background:var(--purpleish); color:#fff; }

.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }

/* ---- tipográfiai szerepek ---- */
.overline{
  font-family:var(--font-body); font-weight:500;
  font-size:0.72rem; letter-spacing:0.34em; text-transform:uppercase;
  color:var(--dark-pink); display:inline-flex; align-items:center; gap:0.9em;
}
.overline::before{ content:""; width:2.2rem; height:1px; background:var(--dark-pink); opacity:0.7; }

h2.script{
  font-family:var(--font-script); font-weight:400;
  font-size:clamp(2.6rem, 5vw, 3.4rem); line-height:1.05;
  color:var(--lavender); letter-spacing:0.01em;
}
.lead{ font-size:clamp(1.02rem,1.5vw,1.18rem); color:var(--rosy-dim); max-width:60ch; }
p{ text-wrap:pretty; }

.section-head{ margin-bottom:clamp(2rem,4vw,3rem); }
.section-head .overline{ margin-bottom:0.9rem; }

.quote{
  font-family:var(--font-serif); font-style:italic; font-weight:400;
  color:var(--lavender); line-height:1.4;
}

.tlink{ color:var(--dark-pink); border-bottom:1px solid transparent; transition:color .25s, border-color .25s; }
.tlink:hover,.tlink:focus-visible{ color:var(--lavender); border-bottom-color:var(--lavender); }

/* ============================================================
   2. KÉP-KEZELÉS (valódi színek, 50% telítettség)
   ============================================================ */
.duo{ position:relative; overflow:hidden; isolation:isolate; background:var(--royal-purple); }
.duo img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(0.5) brightness(0.97) contrast(1.04); }
.duo::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(165deg, rgba(36,16,36,0) 55%, rgba(36,16,36,0.28) 100%);
}

/* ============================================================
   3. STICKY NAVIGÁCIÓ
   ============================================================ */
.nav{
  position:sticky; top:0; z-index:100;
  background:var(--royal-purple);
  border-bottom:1px solid transparent;
  transition:box-shadow .4s ease, border-color .4s ease;
}
.nav.is-stuck{ border-bottom-color:rgba(225,172,203,0.12); box-shadow:0 14px 40px -18px rgba(0,0,0,0.6); }
.nav__inner{ max-width:var(--maxw); margin-inline:auto; padding:0.85rem var(--gutter); display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.brand{ display:flex; align-items:center; }
.brand img, .brand .brand-svg{ height:30px; width:auto; }
.menu{ display:flex; align-items:center; gap:clamp(0.9rem,1.8vw,1.8rem); list-style:none; }
.menu a{ font-size:0.86rem; letter-spacing:0.02em; color:var(--rosy-dim); position:relative; padding:0.3rem 0; transition:color .25s; }
.menu a::after{ content:""; position:absolute; left:0; bottom:-1px; height:1px; width:0; background:var(--dark-pink); transition:width .3s; }
.menu a:hover,.menu a:focus-visible{ color:var(--lavender); }
.menu a:hover::after,.menu a:focus-visible::after{ width:100%; }

.nav__tools{ display:flex; align-items:center; gap:1.1rem; }
.cta{ font-size:0.82rem; letter-spacing:0.04em; color:var(--lavender); border:1px solid var(--dark-pink); border-radius:999px; padding:0.5rem 1.05rem; transition:background .25s, color .25s; white-space:nowrap; }
.cta:hover,.cta:focus-visible{ background:var(--dark-pink); color:var(--almost-black); }

.nav__toggle{ display:none; background:none; border:0; cursor:pointer; color:var(--lavender); padding:0.4rem; }
.nav__toggle svg{ width:26px; height:26px; }

@media (max-width: 1080px){
  .menu, .nav__tools .cta{ display:none; }
  .nav__toggle{ display:inline-flex; }
  .nav.is-open .menu{ display:flex; flex-direction:column; align-items:flex-start; gap:0.2rem; position:absolute; left:0; right:0; top:100%; background:var(--royal-purple); border-bottom:1px solid var(--hairline); box-shadow:0 24px 50px -20px rgba(0,0,0,0.6); padding:1rem var(--gutter) 1.4rem; }
  .nav.is-open .menu a{ font-size:1.05rem; padding:0.55rem 0; }
  .nav.is-open .nav__tools .cta{ display:inline-block; }
}

/* ============================================================
   4. HERO — transzparens portré, lila derengés (Figma)
   ============================================================ */
.hero{
  position:relative; overflow:hidden;
  background:
    radial-gradient(46% 60% at 27% 45%, rgba(112,48,104,0.5) 0%, rgba(112,48,104,0) 72%),
    linear-gradient(100deg, #2B1330 0%, #1C0D20 46%, #0B060D 100%);
}
.hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:4px; z-index:2;
  background:var(--ink);
}
.hero .wrap{ position:relative; }
.hero__glow{
  position:absolute; inset:-20% -10%; z-index:0; pointer-events:none;
  background:radial-gradient(40% 50% at 36% 60%, rgba(157,81,125,0.22) 0%, rgba(157,81,125,0) 70%);
  animation:heroDrift 28s ease-in-out infinite alternate;
}
@keyframes heroDrift{ 0%{transform:translate3d(-2%,-2%,0) scale(1.05);} 100%{transform:translate3d(3%,2%,0) scale(1.12);} }
@media (prefers-reduced-motion: reduce){ .hero__glow{ animation:none; } }

.hero__grid{ position:relative; z-index:1; display:flex; align-items:center; min-height:min(82vh, 760px); }
.hero__intro{ width:min(58%, 620px); display:flex; flex-direction:column; justify-content:center; padding:clamp(3rem,6vw,5rem) clamp(1.5rem,3vw,2.5rem) clamp(3rem,6vw,5rem) 0; }
.hero__logo{ width:clamp(260px, 38vw, 460px); height:auto; margin-bottom:0.4rem; }
.hero__sub{ font-family:var(--font-body); font-weight:400; font-size:clamp(0.92rem,1.5vw,1.1rem); letter-spacing:0.22em; text-transform:uppercase; color:var(--dark-pink); margin-top:0.6rem; }
.hero__quote{ margin-top:clamp(2rem,4vw,2.8rem); font-size:24px; max-width:26ch; position:relative; padding-left:1.4rem; }
.hero__quote::before{ content:""; position:absolute; left:0; top:0.25em; bottom:0.25em; width:2px; background:linear-gradient(180deg, var(--dark-pink), rgba(204,119,156,0)); }
.hero__cta{ display:none; }

.hero__media{ position:absolute; top:0; right:var(--gutter); bottom:0; width:50%; z-index:0; pointer-events:none; }
.hero__media img{
  position:absolute; right:0; bottom:0;
  height:min(92%, 660px); width:auto; max-width:none;
  filter:saturate(0.5) brightness(0.97) contrast(1.04);
}

@media (max-width: 860px){
  /* „C” változat — teljes portré, overlay szöveg alul, idézet nélkül */
  .hero .wrap{ position:static; }
  .hero__grid{ min-height:min(92svh, 700px); align-items:flex-end; }
  .hero__intro{ width:100%; padding:0 0 2.4rem; }
  .hero__logo{ width:min(78%, 330px); }
  .hero__quote{ display:none; }
  .hero__cta{ display:inline-block; margin-top:1.3rem; align-self:flex-start; }
  .hero__media{ position:absolute; inset:0; width:auto; right:0; }
  .hero__media img{ right:auto; left:50%; transform:translateX(-50%); bottom:0; height:88%; }
  .hero__media::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:52%;
    background:linear-gradient(180deg, rgba(26,15,30,0) 0%, rgba(26,15,30,0.82) 55%, rgba(26,15,30,0.96) 100%); }
}

/* ============================================================
   5. SZEKCIÓ-RITMUS
   ============================================================ */
section.band{ padding-block:var(--section-y); position:relative; }
.band--ink{ background:var(--ink); }
.band--black{ background:var(--almost-black); }
.band--deep{ background:var(--deep-plum); }
.band--plum{ background:var(--plum); }

/* ============================================================
   6. MEGKÖZELÍTÉSEM (RÓlam)
   ============================================================ */
.approach__grid{ display:grid; grid-template-columns:1.04fr 0.96fr; gap:clamp(2rem,5vw,4rem); align-items:stretch; }
.approach__body{ display:flex; flex-direction:column; min-height:0; contain:size; }
.approach__scroll{ flex:1 1 0; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding-right:1rem; scrollbar-width:thin; scrollbar-color:rgba(204,119,156,0.45) transparent; }
.approach__scroll::-webkit-scrollbar{ width:6px; }
.approach__scroll::-webkit-scrollbar-track{ background:transparent; }
.approach__scroll::-webkit-scrollbar-thumb{ background:rgba(204,119,156,0.35); border-radius:999px; }
.approach__scroll::-webkit-scrollbar-thumb:hover{ background:rgba(204,119,156,0.55); }
.approach__body .overline{ margin-bottom:1rem; }
.approach__body h2{ margin-bottom:1.1rem; }
.bio-link{ display:inline-flex; align-items:center; gap:0.55em; font-size:0.92rem; letter-spacing:0.02em; margin-bottom:1.7rem; }
.bio-link svg{ width:0.9em; height:0.9em; }
.approach__scroll p + p{ margin-top:1.05rem; }
.approach__quote{ margin:1.7rem 0; font-size:clamp(1.3rem,2.1vw,1.6rem); line-height:1.4; position:relative; padding-left:1.4rem; }
.approach__quote::before{ content:""; position:absolute; left:0; top:0.2em; bottom:0.2em; width:2px; background:linear-gradient(180deg, var(--dark-pink), rgba(204,119,156,0)); }

/* két egymásra csúsztatott portré — áttűnő slideshow, keret nélkül */
.portrait-stack{ position:relative; aspect-ratio:4/4.4; }
.ps-card{
  position:absolute; width:62%; aspect-ratio:3/4.4; border-radius:6px;
  box-shadow:0 30px 70px -34px rgba(0,0,0,0.85);
  transition:left 1.4s cubic-bezier(.3,.7,.3,1), top 1.4s cubic-bezier(.3,.7,.3,1),
             transform 1.4s cubic-bezier(.3,.7,.3,1), opacity 1.4s ease;
}
.ps-back{ left:calc(0% + var(--jx, 0px)); top:calc(7% + var(--jy, 0px)); transform:rotate(calc(-2.5deg + var(--jr, 0deg))); opacity:0.65; z-index:1; }
.ps-front{ left:calc(38% + var(--jx, 0px)); top:calc(0% + var(--jy, 0px)); transform:rotate(calc(2.5deg + var(--jr, 0deg))); opacity:1; z-index:2; }
.ps-out{ z-index:3; opacity:0; }
.ps-enter{ opacity:0; }
.ps-hidden{ opacity:0; z-index:0; transition:none; }
@media (prefers-reduced-motion: reduce){ .ps-card{ transition:none; } }
@media (max-width: 860px){
  .approach__grid{ grid-template-columns:1fr; }
  .approach__body{ contain:none; }
  .approach__scroll{ flex:none; max-height:26rem; }
  .portrait-stack{ max-width:440px; margin-inline:auto; width:100%; }
}

/* ============================================================
   7. GONDOLATOK — Tango ex machina (blog grid)
   ============================================================ */
.blog-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px 32px; }
.post{ display:grid; grid-template-columns:200px 1fr; gap:28px; align-items:stretch; }
.post__thumb{ width:200px; aspect-ratio:1; border-radius:4px; }
.post__body{ display:flex; flex-direction:column; justify-content:center; padding:0.4rem 0; }
.post__title{ font-family:var(--font-body); font-weight:500; font-size:clamp(1.15rem,1.6vw,1.35rem); color:var(--cream); line-height:1.25; transition:color .25s; }
.post a:hover .post__title{ color:var(--lavender); }
.post__lead{ margin-top:0.55rem; font-size:0.92rem; color:var(--rosy-dim); line-height:1.6; }
.post__date{ margin-top:0.7rem; font-size:0.78rem; letter-spacing:0.16em; color:var(--dark-pink); }
@media (max-width: 980px){ .blog-grid{ grid-template-columns:1fr; } }
@media (max-width: 520px){ .post{ grid-template-columns:120px 1fr; gap:18px; } .post__thumb{ width:120px; } }

.section-head--row{ display:flex; align-items:flex-end; justify-content:space-between; gap:1.2rem 2rem; flex-wrap:wrap; }
.section-head--row .btn-outline{ margin-top:0; margin-bottom:0.5rem; }

/* ---- poszt-modal ---- */
.post-modal{ position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; padding:clamp(0.75rem,2vh,2rem) clamp(1rem,4vw,3rem); }
.post-modal.is-open{ display:flex; }
.post-modal__backdrop{ position:absolute; inset:0; background:rgba(26,15,30,0.74); backdrop-filter:blur(6px); }
.post-modal__dialog{ position:relative; width:min(680px,100%); max-height:100%; overflow-y:auto; overscroll-behavior:contain; background:var(--almost-black); border:1px solid var(--hairline); border-radius:18px; box-shadow:0 40px 90px -30px rgba(0,0,0,0.85); }
.post-modal__hero{ height:180px; }
.post-modal__hero img{ width:100%; height:100%; object-fit:cover; }
.post-modal__body{ padding:clamp(1.5rem,4vw,2.4rem); }
.post-modal__date{ font-size:0.78rem; letter-spacing:0.16em; color:var(--dark-pink); margin-bottom:0.6rem; }
.post-modal__title{ font-family:var(--font-body); font-weight:500; font-size:clamp(1.4rem,2.4vw,1.7rem); color:var(--cream); line-height:1.25; }
.post-modal__text{ margin-top:1rem; color:var(--rosy-dim); line-height:1.7; }
.post-modal__text p + p{ margin-top:1rem; }
.post-modal__text a{ color:var(--lavender); text-decoration:underline; text-underline-offset:3px; }
.post-modal__close{ position:sticky; top:0.9rem; z-index:2; display:flex; align-items:center; justify-content:center; width:44px; height:44px; margin:0.9rem 0.9rem calc(-44px - 0.9rem) auto; background:rgba(26,15,30,0.62); border:1px solid var(--hairline); border-radius:999px; color:var(--rosy); cursor:pointer; transition:color .2s, background .2s, border-color .2s; }
.post-modal__close:hover,.post-modal__close:focus-visible{ color:var(--lavender); border-color:var(--line-strong); }
.post-modal__close svg{ width:20px; height:20px; }

.btn-outline{ display:inline-flex; align-items:center; gap:0.7em; margin-top:2.6rem; font-size:0.8rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--line-strong); border:1px solid var(--line-strong); border-radius:2px; padding:0.85rem 2rem; transition:background .25s, color .25s; }
.btn-outline:hover,.btn-outline:focus-visible{ background:var(--line-strong); color:var(--plum); }
.btn-outline svg{ width:1em; height:1em; transition:transform .25s; }
.btn-outline:hover svg{ transform:translateX(3px); }

/* ============================================================
   8. MOZGÁS
   ============================================================ */
.motion__grid{ display:grid; grid-template-columns:0.92fr 1.08fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.motion__photo{ aspect-ratio:4/5; border-radius:6px; box-shadow:0 30px 70px -34px rgba(0,0,0,0.85); }
.motion__body .overline{ margin-bottom:1rem; }
.motion__body h2{ margin-bottom:1.2rem; }
.motion__body p + p{ margin-top:1.05rem; }
.motion__close{ margin-top:1.6rem; font-family:var(--font-serif); font-style:italic; font-size:clamp(1.15rem,1.9vw,1.45rem); color:var(--lavender); }
@media (max-width: 860px){ .motion__grid{ grid-template-columns:1fr; } .motion__photo{ order:-1; max-width:420px; } }

/* ============================================================
   9. FOTOGRÁFIA — Képek (masonry)
   ============================================================ */
.photo-grid{ columns:3; column-gap:18px; }
.photo-grid .duo{ break-inside:avoid; margin-bottom:18px; border-radius:5px; background:none; }
.photo-grid .duo img{ width:calc(100% + 2px); height:auto; margin:-1px; max-width:none; }
@media (max-width: 860px){ .photo-grid{ columns:2; } }
@media (max-width: 520px){ .photo-grid{ columns:1; } }

/* ============================================================
   10. PROJEKTEK
   ============================================================ */
.projects{ display:grid; grid-template-columns:1fr 1fr; gap:0 clamp(2rem,5vw,4rem); }
.project{ display:grid; grid-template-columns:auto 1fr; gap:1.1rem; align-items:baseline; padding:1.35rem 0; border-top:1px solid var(--hairline); }
.project__num{ font-family:var(--font-serif); font-style:italic; color:var(--purpleish); font-size:1rem; }
.project__name{ font-family:var(--font-body); font-weight:500; font-size:1.18rem; color:var(--rosy); }
.project__desc{ margin-top:0.2rem; font-size:0.92rem; color:var(--rosy-dim); }
@media (max-width: 720px){ .projects{ grid-template-columns:1fr; } }

/* ============================================================
   11. DOLGOZZUNK EGYÜTT — három út
   ============================================================ */
.paths{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2.5vw,1.6rem); }
.path{ background:var(--purpleish); border-radius:6px; padding:clamp(1.6rem,3vw,2.2rem); display:flex; flex-direction:column; box-shadow:0 22px 60px -34px rgba(0,0,0,0.75); transition:transform .3s, box-shadow .3s; }
.path:hover{ transform:translateY(-4px); box-shadow:0 30px 70px -30px rgba(0,0,0,0.8); }
.path__k{ font-size:0.7rem; letter-spacing:0.28em; text-transform:uppercase; color:var(--almost-black); opacity:0.65; }
.path h3{ font-family:var(--font-script); font-size:2rem; color:#fff; margin-top:0.2rem; font-weight:400; }
.path p{ margin-top:0.8rem; color:rgba(255,255,255,0.92); font-size:0.94rem; flex:1; }
.path__more{ margin-top:1.4rem; align-self:flex-start; font-size:0.8rem; letter-spacing:0.06em; color:#fff; border-bottom:1px solid rgba(255,255,255,0.5); padding-bottom:2px; transition:border-color .25s; }
.path__more:hover{ border-color:#fff; }
@media (max-width: 820px){ .paths{ grid-template-columns:1fr; } }

/* ============================================================
   12. KAPCSOLAT — footer
   ============================================================ */
footer{ background:var(--plum); }
.footer-grid{ max-width:var(--maxw); margin-inline:auto; padding:clamp(2.6rem,5vw,3.8rem) var(--gutter); display:flex; align-items:center; justify-content:space-between; gap:1.5rem 3rem; flex-wrap:wrap; }
.footer-logo{ width:clamp(180px,20vw,240px); height:auto; display:block; }
.footer-meta{ display:flex; flex-direction:column; align-items:flex-end; gap:1.2rem; }
.socials{ display:flex; gap:2.6rem; }
.socials a{ font-size:0.78rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--dark-pink); transition:color .25s; }
.socials a:hover{ color:var(--lavender); }
.copy{ font-size:0.85rem; color:rgba(160,136,152,1); }
@media (max-width: 640px){ .footer-meta{ align-items:flex-start; } }

/* ============================================================
   13. SCROLL REVEAL
   ============================================================ */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
.reveal.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

.skip, .skip-link{ position:absolute; left:-999px; top:0; z-index:200; background:var(--purpleish); color:#fff; padding:0.6rem 1rem; border-radius:0 0 6px 0; }
.skip:focus, .skip-link:focus{ left:0; }

/* ============================================================
   INTEGRÁCIÓS KIEGÉSZÍTÉSEK — CMS nézetek (flash, oldalfejléc, prose, űrlap, lapozó)
   a design token-nyelvén; a backend ezeket a publikus aloldalakon használja.
   ============================================================ */
.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }

/* Flash üzenetek */
.flash{ padding:0.9rem 0; font-size:0.95rem; }
.flash p{ margin:0; }
.flash .container, .flash .wrap{ padding-block:0; }
.flash-success{ background:rgba(120,180,140,0.14); color:#bfe6c9; }
.flash-error{ background:rgba(204,119,156,0.18); color:var(--lavender); }
.flash-info{ background:rgba(157,81,125,0.16); color:var(--rosy); }

/* Általános oldalfejléc (blog, galéria, kapcsolat, statikus oldalak) */
.page-hero{ padding:calc(var(--section-y) * 0.75) 0 0; }
.page-hero .wrap{ max-width:820px; }
.page-hero .overline{ margin-bottom:0.9rem; }
.page-title{ font-family:var(--font-script); font-weight:400; font-size:clamp(2.4rem,5vw,3.4rem); line-height:1.05; color:var(--lavender); }
.page-subtitle{ font-family:var(--font-serif); font-style:italic; color:var(--rosy-dim); font-size:1.2rem; margin-top:0.5rem; }

/* Prose — cikk/oldal törzs sötét háttéren */
.prose{ color:var(--rosy); font-size:1.06rem; line-height:1.85; max-width:68ch; }
.prose p{ margin:0 0 1.2em; }
.prose h2{ font-family:var(--font-script); color:var(--lavender); font-size:1.9rem; margin:1.6em 0 .5em; }
.prose h3{ color:var(--lavender); font-size:1.3rem; margin:1.4em 0 .4em; }
.prose a{ color:var(--dark-pink); border-bottom:1px solid transparent; transition:color .2s,border-color .2s; }
.prose a:hover{ border-bottom-color:var(--lavender); color:var(--lavender); }
.prose blockquote{ font-family:var(--font-serif); font-style:italic; color:var(--lavender); border-left:2px solid var(--dark-pink); padding-left:1.2rem; margin:1.4em 0; }
.prose img{ border-radius:6px; margin:1.4em 0; }
.prose ul,.prose ol{ margin:0 0 1.2em 1.3em; }

/* Űrlapok (kapcsolat) */
.form{ max-width:620px; }
.form .form-row{ margin-bottom:1.2rem; }
.form label{ display:block; font-size:0.74rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--dark-pink); margin-bottom:0.5rem; }
.form input[type=text],.form input[type=email],.form textarea{ width:100%; padding:0.8rem 0.95rem; font:inherit; color:var(--rosy); background:rgba(255,255,255,0.04); border:1px solid var(--hairline); border-radius:6px; }
.form input:focus,.form textarea:focus{ outline:none; border-color:var(--dark-pink); box-shadow:0 0 0 3px rgba(204,119,156,0.18); }
.form textarea{ resize:vertical; min-height:9rem; }
.hp-field{ position:absolute; left:-9999px; }
.btn{ display:inline-block; cursor:pointer; font-family:var(--font-body); font-size:0.82rem; letter-spacing:0.04em; color:var(--lavender); background:transparent; border:1px solid var(--dark-pink); border-radius:999px; padding:0.7rem 1.5rem; transition:background .25s,color .25s; }
.btn:hover,.btn:focus-visible{ background:var(--dark-pink); color:var(--almost-black); }

/* Lapozó */
.pagination{ display:flex; gap:0.5rem; justify-content:center; margin-top:3rem; }
.pagination a{ padding:0.5rem 0.9rem; border:1px solid var(--hairline); border-radius:6px; color:var(--rosy-dim); }
.pagination a.active,.pagination a:hover{ background:var(--dark-pink); color:var(--almost-black); border-color:var(--dark-pink); }

/* Egy blogposzt fejkép + meta */
.post-hero{ max-width:var(--maxw); margin:1.8rem auto 0; padding-inline:var(--gutter); }
.post-hero .duo{ border-radius:8px; max-height:460px; }
.post-meta{ color:var(--dark-pink); font-size:0.85rem; letter-spacing:0.04em; margin-bottom:0.6rem; }