:root{--cream:#f8f7f1;--paper:#fffefa;--rose:#b98e82;--rose-dark:#95695e;--ink:#51473f;--muted:#726e64;--line:#e4d9cf;--serif:Georgia,'Times New Roman',serif;--sans:'Segoe UI',Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.65}a{color:inherit}img{max-width:100%;display:block}svg{width:25px;height:25px;flex-shrink:0}h1,h2,p{margin-top:0}h1,h2{font-family:var(--serif);font-weight:400;line-height:1.2}h1{font-size:clamp(2rem,3.2vw,3rem)}h2{font-size:1.6rem}header{background:var(--rose);color:var(--paper)}.header-inner{max-width:1760px;min-height:96px;margin:auto;padding:14px 3.2%;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0}.brand img{border-radius:50%;object-fit:cover;width:58px;height:58px}.brand strong{font:600 1.6rem var(--serif)}.brand small{display:block;letter-spacing:.17em;font-size:.75rem;margin-top:4px}nav{display:flex;gap:26px;align-items:center}nav a{text-decoration:none;font-size:1.1rem;border-bottom:1px solid transparent;padding:7px 0}nav a:hover,nav a[aria-current]{border-color:var(--paper)}.button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:1px solid var(--rose-dark);border-radius:999px;background:var(--rose-dark);color:var(--paper);font-size:1rem;font-weight:600;min-height:50px;padding:12px 28px;line-height:1.4;text-align:center;transition:background .15s}.button:hover{background:#80594f;border-color:#80594f}.nav-book{background:#f0e8db;border-color:#f0e8db;color:var(--rose);white-space:nowrap;padding:11px 26px}.nav-book:hover{background:var(--paper);border-color:var(--paper)}.container{max-width:1440px;padding:42px 48px 65px;margin:auto;min-height:calc(100vh - 205px)}.page-heading{text-align:center;max-width:1080px;margin:0 auto 46px}.eyebrow{font:400 1.3rem var(--serif);text-transform:uppercase;letter-spacing:.07em;color:var(--rose-dark);margin-bottom:16px}.page-heading h1{margin-bottom:16px}.lead{font-size:1.16rem;line-height:1.6;max-width:980px;margin:auto;color:var(--muted)}.hero{position:relative;min-height:710px;display:flex;align-items:center;overflow:hidden}.hero-image{position:absolute;inset:0 0 0 42%;background-position:center;background-size:cover;background-repeat:no-repeat}.hero-image:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--cream) 0%,rgba(248,247,241,.7) 12%,transparent 39%)}.hero-content{z-index:1;width:55%;max-width:850px;padding:50px 0 50px max(5.4vw,32px)}.hero-kicker{font-size:1.12rem;font-weight:600;color:var(--rose-dark);margin-bottom:25px}.hero h1{color:var(--rose-dark);font-size:clamp(2.8rem,4.5vw,5.25rem);line-height:1.1;margin-bottom:26px;letter-spacing:-.025em}.hero-copy{max-width:650px;font-size:1.16rem;line-height:1.65;margin-bottom:45px}.hero .button{border-radius:7px;padding:18px 32px;font-size:1.05rem}.first-meeting{display:flex;align-items:center;gap:9px;margin:24px 0 0;font-size:1rem}.first-meeting svg{color:var(--rose-dark);width:28px;height:28px;margin-right:4px}.gallery-section{padding:50px 0 65px}.gallery-section>.eyebrow{text-align:center;margin-bottom:34px}.service-layout{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:stretch}.service-photo{height:100%;min-height:560px;object-fit:cover;border-radius:22px}.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.service-card{padding:26px;background:var(--paper);border-radius:24px;box-shadow:0 4px 22px #65524406}.icon{color:var(--rose-dark);display:inline-flex;background:#f4ede5;border-radius:14px;padding:10px;margin-bottom:17px}.service-card h2{font-size:1.33rem;line-height:1.4;margin-bottom:12px}.service-card p{font-size:1rem;line-height:1.6;color:var(--muted);margin:0}.about .page-heading{margin-bottom:20px}.about blockquote{text-align:center;margin:0 auto 48px;font-size:1.15rem;color:var(--muted);max-width:1130px}.about-layout{display:grid;grid-template-columns:1.08fr 1fr;gap:64px;align-items:start}.about-photo{width:100%;height:auto;border-radius:5px;margin-top:5px}.about-copy p{margin-bottom:17px;color:var(--muted);font-size:1rem;line-height:1.75}.about-copy p:first-child{color:var(--ink);font-weight:600}.qualities{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:28px}.qualities>div{display:flex;align-items:start;gap:9px}.qualities svg{width:23px;color:var(--rose-dark)}.qualities strong{font-size:.86rem;display:block}.qualities small{font-size:.78rem;line-height:1.5;display:block;color:var(--muted);margin-top:5px}.prices .page-heading{margin-bottom:44px}.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.price-card{position:relative;background:var(--paper);border-radius:24px;padding:32px 22px 23px;display:flex;flex-direction:column;border:1px solid #eee7df}.price-card h2{text-align:center;font-size:1.65rem;min-height:64px;margin-bottom:10px}.duration{text-align:center;font-size:.94rem;margin-bottom:28px}.price{font:400 2.55rem var(--serif);color:var(--rose-dark);text-align:center;margin-bottom:14px}.addon{font-size:.8rem;text-align:center;border:1px solid var(--line);border-radius:20px;padding:7px;margin-bottom:0}.price-card ul{list-style:none;padding:18px 0 8px;margin:18px 0 15px;border-top:1px solid var(--line);flex-grow:1}.price-card li{position:relative;padding-left:25px;margin-bottom:15px;font-size:.95rem;line-height:1.65}.price-card li:before{content:'✓';position:absolute;left:0;color:var(--rose-dark);font-weight:700}.outline{color:var(--ink);background:transparent;border-color:#b69a8f;padding:11px 15px}.outline:hover{background:#efe4db;color:var(--ink);border-color:#b69a8f}.rose{background:var(--rose);color:#fffefa;border-color:var(--rose)}.rose .price,.rose li:before{color:#fffefa}.rose ul{border-color:#d9b9ac}.rose .outline{border-color:#e9d4c8;color:#fffefa}.rose .outline:hover{color:var(--ink)}.badge{position:absolute;right:19px;top:-20px;background:var(--paper);border-radius:30px;color:var(--rose-dark);padding:7px 13px;display:flex;align-items:center;gap:7px;font-size:.8rem;font-weight:600}.badge svg{width:19px;height:19px}.price-notes{margin-top:27px;background:#f1eae2;display:grid;grid-template-columns:1fr 1.5fr;border-radius:17px;padding:21px 28px;gap:30px}.price-notes>div{display:flex;gap:23px;align-items:center}.price-notes>div+div{border-left:1px solid #c6a398;padding-left:30px}.price-notes svg{width:37px;height:37px;color:var(--rose-dark)}.price-notes p{font-size:.94rem;margin:0}.faq-list{max-width:1000px;margin:auto;display:grid;gap:17px}.faq-item{background:var(--paper);border-radius:21px;padding:26px 32px}.faq-item h2{font-size:1.4rem;margin:0 0 12px}.faq-item p{margin:0;color:var(--muted);line-height:1.7}.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:90px;max-width:1180px;margin:auto}.contact-intro{font-size:1.3rem;line-height:1.55;margin:15px 0 48px}.contact-links{display:grid;gap:19px}.contact-links>a,.contact-links>div{display:flex;gap:22px;align-items:center;text-decoration:none;background:var(--paper);padding:20px 24px;border:1px solid #dfd1c7;border-radius:20px;max-width:480px}.contact-links svg{color:var(--rose-dark);width:52px;height:52px;flex:0 0 52px;background:#f4ede5;border-radius:14px;padding:11px}.contact-links span{font-size:1rem;color:var(--muted);min-width:0}.contact-links strong{display:block;font-size:1.16rem;font-weight:400;color:var(--ink);overflow-wrap:anywhere;line-height:1.5}.contact-links a:hover{box-shadow:0 0 0 1px var(--rose)}.booking-panel{background:var(--paper);padding:38px 40px;border-radius:30px;align-self:start}.booking-panel h2{font-size:2rem;margin-bottom:21px}.booking-panel p{color:var(--muted);margin-bottom:24px}.booking-panel .button{display:flex;width:100%;margin-top:14px}.booking-panel small{display:block;text-align:center;margin-top:27px;font-size:.875rem;color:var(--muted)}footer{border-top:1px solid var(--line);max-width:1440px;margin:auto;padding:25px 48px;display:flex;gap:30px;align-items:center;justify-content:space-between;color:var(--muted);font-size:.875rem}footer p{margin:0}.footer-brand{text-decoration:none;font:1.3rem var(--serif);color:var(--ink)}.footer-brand span{display:block;font:.75rem var(--sans);margin-top:6px;color:var(--muted)}.skip{position:absolute;top:-100px;left:10px;z-index:10;padding:10px;background:white;color:#222}.skip:focus{top:10px}:focus-visible{outline:3px solid #513e35;outline-offset:5px}
@media(min-width:1600px){.hero{min-height:790px}.hero-content{width:52%}}
@media(max-width:1150px){.header-inner{flex-wrap:wrap;gap:10px 25px}.brand{margin-right:auto}nav{order:3;width:100%;justify-content:center;gap:30px}.container{padding:36px 30px 50px}.hero{min-height:650px}.hero-content{width:60%}.hero h1{font-size:3.5rem}.hero-copy{font-size:1.06rem}.service-layout{gap:25px}.service-card{padding:22px}.price-grid{grid-template-columns:repeat(2,1fr);gap:30px 22px}.price-card h2{min-height:0}.about-layout{gap:32px}.qualities{grid-template-columns:1fr}.contact-layout{gap:35px}}
@media(max-width:700px){.header-inner{padding:14px 18px;gap:15px 10px}.brand{gap:8px}.brand img{width:43px;height:43px}.brand strong{font-size:1.2rem}.brand small{font-size:.6rem;letter-spacing:.09em}.nav-book{font-size:.8rem;padding:9px 12px;min-height:42px}nav{justify-content:space-between;gap:8px;flex-wrap:wrap}nav a{font-size:.88rem;padding:2px 0}.container{padding:32px 20px 42px}.page-heading{margin-bottom:28px}.eyebrow{font-size:1rem;margin-bottom:12px}.page-heading h1{font-size:2.1rem}.lead{font-size:1rem}.hero{display:block;padding-top:0;min-height:0}.hero-image{position:relative;inset:auto;height:330px;background-position:center 55%}.hero-image:after{background:linear-gradient(0deg,var(--cream),transparent 25%)}.hero-content{padding:5px 24px 32px;width:100%;max-width:none}.hero-kicker{font-size:.9rem;margin-bottom:15px}.hero h1{font-size:2.85rem;line-height:1.13}.hero h1 br{display:none}.hero-copy{font-size:1rem;margin-bottom:25px}.hero .button{padding:14px 24px}.first-meeting{font-size:.92rem;flex-wrap:wrap}.gallery-section{padding:25px 20px 40px}.service-layout,.about-layout,.contact-layout{grid-template-columns:1fr;gap:28px}.service-photo{height:360px;min-height:0;width:100%;object-position:center 40%}.service-grid{gap:15px}.service-card{padding:21px 18px}.service-card h2{font-size:1.22rem}.service-card p{font-size:.95rem}.about blockquote{font-size:1.02rem;margin-bottom:28px}.qualities{grid-template-columns:1fr;gap:17px;margin-bottom:4px}.qualities strong{font-size:.94rem}.qualities small{font-size:.85rem}.price-grid{grid-template-columns:1fr;gap:30px}.price-card{padding:28px 25px}.price-card h2{font-size:1.7rem}.price-card li{font-size:1rem}.price-notes{grid-template-columns:1fr;padding:22px;gap:20px}.price-notes>div+div{border-left:0;border-top:1px solid #c6a398;padding:20px 0 0}.faq-item{padding:23px}.faq-item h2{font-size:1.3rem}.contact-intro{font-size:1.13rem;margin:0 0 28px}.contact-links>a,.contact-links>div{max-width:none;padding:19px}.contact-links strong{font-size:1rem}.booking-panel{padding:28px 24px}.contact-layout{gap:30px}footer{margin:0 20px;padding:25px 0;flex-wrap:wrap;gap:18px}footer p{width:100%;order:3}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Matching image groups produce a seamless loop without JavaScript. */
.gallery-section { --gallery-gap: 24px; }
.gallery { overflow: hidden; }
.gallery-track { display: flex; width: max-content; animation: gallery-scroll 216s linear infinite; }
.gallery-group { display: flex; flex: none; gap: var(--gallery-gap); padding-right: var(--gallery-gap); }
.gallery-group img { width: clamp(240px, 25vw, 460px); height: clamp(320px, 32vw, 490px); max-width: none; flex: none; object-fit: cover; border-radius: 24px; }
@keyframes gallery-scroll { to { transform: translateX(-50%); } }
.gallery:has(:focus-visible) .gallery-track { animation-play-state: paused; }

@media (max-width: 700px) {
 .gallery-section { --gallery-gap: 14px; padding-left: 0; padding-right: 0; }
 .gallery-group img { width: 240px; height: 320px; border-radius: 16px; }
 .gallery-track { animation-duration: 162s; }
}
@media (prefers-reduced-motion: reduce) {
 .gallery-track { animation: none; }
 .gallery { overflow-x: auto; }
 .gallery-group[aria-hidden="true"] { display: none; }
}

.gallery-item { display: block; flex: none; cursor: zoom-in; border-radius: 24px; }
.gallery-item:focus-visible { outline-offset: -5px; }
body:has(.photo-viewer[open]) { overflow: hidden; }
body:has(.photo-viewer[open]) .gallery-track { animation-play-state: paused; }
.photo-viewer { border: 0; padding: 0; background: transparent; overflow: visible; max-width: 94vw; max-height: 94dvh; }
.photo-viewer::backdrop { background: rgba(28,23,20,.88); }
.photo-full { width: auto; height: 86dvh; max-width: 90vw; max-height: 86dvh; object-fit: contain; border-radius: 12px; }
.photo-close { position: absolute; right: 8px; top: 8px; z-index: 3; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--paper); color: var(--ink); font-size: 30px; line-height: 1; cursor: pointer; box-shadow: 0 2px 12px #0003; }
.photo-nav { position: absolute; top: 50%; z-index: 3; transform: translateY(-50%); width: 50px; height: 50px; padding: 0 0 4px; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,254,250,.94); color: var(--ink); font: 400 38px/1 var(--serif); cursor: pointer; box-shadow: 0 3px 16px #0004; }
.photo-prev { left: 12px; }
.photo-next { right: 12px; }
.photo-nav[hidden] { display: none; }

.footer-brand { display: flex; align-items: center; gap: 12px; }
.footer-brand img { width: 56px; height: 56px; border-radius: 50%; flex-shrink: 0; }

.faq-item { padding: 0; }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 28px 32px; cursor: pointer; list-style: none; border-radius: 21px; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary h2 { margin: 0; }
.faq-chevron { width: 21px; height: 21px; flex-shrink: 0; color: var(--muted); }
.faq-item[open] .faq-chevron { transform: rotate(180deg); }
.faq-item > p { padding: 0 32px 28px; }
.faq-answer ul { margin: 0; padding-left: 1.35rem; color: var(--muted); line-height: 1.75; }
.faq-answer li + li { margin-top: 8px; }
@media (max-width: 700px) {
 .faq-item summary { padding: 24px 23px; gap: 16px; }
 .faq-item > p { padding: 0 23px 24px; }
}

/* Gentle feedback, with motion reserved for controls and entrances. */
.button, .brand, .footer-brand, .contact-links a, .photo-close, .photo-nav {
 transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease;
}
nav a { position: relative; transition: color .2s ease; border-bottom-color: transparent !important; }
nav a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: center; transition: transform .22s ease; }
nav a[aria-current]::after, nav a:focus-visible::after { transform: scaleX(1); }
.gallery-item { overflow: hidden; }
.gallery-item img { transition: transform .45s ease, filter .3s ease; }
.faq-item { transition: box-shadow .2s ease; }
.faq-item summary { transition: background-color .2s ease, color .2s ease; }
.faq-chevron { transition: transform .26s ease, color .2s ease; }
.faq-item.is-closing .faq-chevron { transform: rotate(0); }
footer > a:last-child { text-underline-offset: 4px; transition: color .2s ease; }
@media (hover: hover) {
 .button:hover { transform: translateY(-2px); box-shadow: 0 6px 16px #51473f20; }
 .brand:hover, .footer-brand:hover { transform: translateY(-1px); }
 nav a:hover::after { transform: scaleX(1); }
 .contact-links a:hover { transform: translateY(-3px); box-shadow: 0 7px 20px #51473f12; }
 .gallery-item:hover img { transform: scale(1.035); filter: brightness(1.035); }
 .faq-item summary:hover { background: #f1e9e0; color: var(--rose-dark); }
 .photo-close:hover { transform: scale(1.07); background: #f0e8db; }
 .photo-nav:hover { transform: translateY(-50%) scale(1.07); background: var(--paper); }
 footer > a:last-child:hover { color: var(--rose-dark); }
}
.button:active, .contact-links a:active, .photo-close:active { transform: translateY(0) scale(.98); }
.photo-nav:active { transform: translateY(-50%) scale(.96); }
.photo-viewer[open] { animation: photo-appear .22s ease-out; }
.photo-viewer[open]::backdrop { animation: backdrop-appear .22s ease-out; }
@keyframes photo-appear { from { opacity: 0; transform: scale(.965); } to { opacity: 1; transform: scale(1); } }
@keyframes backdrop-appear { from { background: rgba(28,23,20,0); } to { background: rgba(28,23,20,.88); } }
@media (prefers-reduced-motion: reduce) {
 *, *::before, *::after { animation: none !important; transition: none !important; }
 .button:hover, .brand:hover, .footer-brand:hover, .contact-links a:hover, .gallery-item:hover img, .photo-close:hover, .photo-nav:hover,
 .button:active, .contact-links a:active, .photo-close:active, .photo-nav:active { transform: none; }
}

.service-card { transition: transform .25s ease, box-shadow .25s ease; }
@media (hover: hover) {
 .service-card:hover { transform: scale(1.025); box-shadow: 0 10px 26px #51473f16; }
}
@media (prefers-reduced-motion: reduce) {
 .service-card:hover { transform: none; }
}

@media (max-width: 700px) {
 header nav {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  width: 100%;
 }
 header nav a {
  justify-self: center;
  text-align: center;
  white-space: nowrap;
 }
}
@media (max-width: 390px) {
 header nav a { font-size: .76rem; }
}

/* ===== One-page homepage layout ===== */
html { scroll-behavior: smooth; }
.one-page .site-header { box-shadow: 0 5px 24px rgba(81,71,63,.08); }
.one-page .header-inner { max-width: 1840px; gap: 22px; }
.one-page header nav { gap: clamp(11px, 1.25vw, 24px); }
.one-page header nav a { font-size: clamp(.88rem, .95vw, 1.05rem); white-space: nowrap; }
.one-page .nav-book { padding-inline: 21px; }

.page-section { padding: 84px 0 94px; }
.section-inner { max-width: 1440px; margin: 0 auto; padding: 0 48px; }
.section-paper { background: #FFFFFF; }
.section-rosewash { background: #F3E5E2; }
.section-warm { background: #FBF5E6; }
.section-title { font-size: clamp(2rem, 3vw, 3.2rem); margin-bottom: 16px; }
.section-title, .page-heading h1 { color: var(--rose); }
.page-section .page-heading { margin-bottom: 48px; }

/* Keep hero copy safely away from the dog/photo area. */
.one-page .hero { min-height: min(760px, calc(100vh - 96px)); }
.one-page .hero-image { inset: 0 47% 0 0; }
.one-page .hero-image::after { background: linear-gradient(270deg,var(--cream) 0%,rgba(248,247,241,.92) 12%,rgba(248,247,241,.2) 38%,transparent 51%); }
.one-page .hero-content { width: 47%; max-width: 720px; margin-left: auto; padding-left: 42px; padding-right: max(5vw,32px); }
.one-page .hero h1 { font-size: clamp(2.7rem, 4vw, 4.7rem); }
.one-page .hero-copy { max-width: 590px; }

/* Blog / Nálunk jártak — one deliberately obvious, duplicate-friendly template. */
.blog-section { max-width: 1220px; }
.blog-template-card { display: grid; grid-template-columns: minmax(300px, .9fr) 1.1fr; overflow: hidden; border: 2px dashed #c5a89e; border-radius: 24px; background: #fff; box-shadow: 0 10px 30px rgba(81,71,63,.06); }
.blog-template-media { min-height: 330px; background: #eaded7; padding: 24px; display: grid; place-items: center; }
.blog-media-placeholder { width: 100%; min-height: 280px; border: 2px dashed #b98e82; border-radius: 17px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 28px; color: var(--rose-dark); }
.blog-media-placeholder strong { font-size: 1.1rem; letter-spacing: .09em; margin-bottom: 10px; }
.blog-media-placeholder span { max-width: 360px; color: var(--muted); }
.blog-template-media img, .blog-template-media iframe, .blog-template-media video { display: block; width: 100%; height: 100%; min-height: 330px; object-fit: cover; border: 0; }
.blog-template-copy { padding: clamp(30px, 4vw, 58px); align-self: center; }
.blog-template-copy h3 { font: 400 clamp(1.8rem,2.5vw,2.6rem)/1.2 var(--serif); margin: 0 0 18px; color: var(--rose-dark); }
.blog-template-copy p:last-child { margin-bottom: 0; }
.blog-meta { color: var(--rose-dark); font-size: .85rem; letter-spacing: .12em; font-weight: 700; margin-bottom: 13px; }

/* Make reused page layouts breathe naturally within stacked sections. */
.one-page .about-layout, .one-page .service-layout, .one-page .contact-layout { margin-top: 0; }
.one-page .about-photo { max-height: 620px; object-fit: cover; }
.one-page .price-grid { margin-top: 0; }
.one-page .gallery-section { padding-left: 0; padding-right: 0; }
.one-page .gallery-section .page-heading { padding: 0 30px; }
.one-page .faq-list { max-width: 1050px; margin: 0 auto; }
.one-page .faq-item { background: rgba(255,255,255,.82); }

@media (max-width: 1200px) {
  .one-page .header-inner { flex-wrap: wrap; padding-top: 10px; padding-bottom: 10px; gap: 8px 18px; }
  .one-page .brand { order: 1; }
  .one-page .nav-book { order: 2; }
  .one-page header nav { order: 3; width: 100%; overflow-x: auto; justify-content: flex-start; scrollbar-width: thin; padding: 2px 0 1px; }
  .one-page header nav a { flex: 0 0 auto; }

}

@media (max-width: 850px) {
  .section-inner { padding-inline: 24px; }
  .page-section { padding: 64px 0 72px; }
  .one-page .hero { min-height: auto; display: block; padding-bottom: 0; }
  .one-page .hero-image { position: relative; inset: auto; width: 100%; height: 54vw; min-height: 310px; max-height: 470px; background-position: 58% center; }
  .one-page .hero-image::after { display: none; }
  .one-page .hero-content { width: 100%; max-width: 720px; margin-left: 0; padding: 48px 24px 58px; }
  .one-page .hero h1 { font-size: clamp(2.55rem, 8vw, 4rem); }
  .blog-template-card { grid-template-columns: 1fr; }
  .blog-template-media { min-height: 260px; }
}

@media (max-width: 700px) {
  .one-page .site-header .header-inner { display: flex; }
  .one-page header nav { display: flex; grid-template-columns: none; gap: 18px; }
  .one-page header nav a { justify-self: auto; font-size: .88rem; }
  .one-page .brand img { width: 48px; height: 48px; }
  .one-page .brand strong { font-size: 1.3rem; }
  .one-page .brand small { font-size: .62rem; }
  .one-page .nav-book { min-height: 42px; padding: 8px 15px; font-size: .86rem; }
  .section-inner { padding-inline: 20px; }
  .blog-template-media { padding: 16px; }
  .blog-media-placeholder { min-height: 220px; padding: 22px; }
}

@media (max-width: 480px) {
  .one-page .brand span { display: none; }
  .one-page .nav-book { margin-left: auto; }
  .one-page .hero-image { min-height: 270px; }
}

/* ===== Navigation + FAQ fixes ===== */
/* header.js keeps --header-height synced to the rendered header, including wrapped/mobile layouts. */
:root { --header-height: 96px; }
/* Let anchored sections slide slightly underneath the sticky header. This removes
   the thin strip of the previous section and brings each section title closer
   to the header instead of leaving the full decorative top padding visible. */
html { scroll-padding-top: var(--header-height); }
.page-section, #tartalom { scroll-margin-top: 0; }
.site-header, .site-header a, .site-header img { -webkit-user-drag: none; }
.site-header { user-select: none; -webkit-user-select: none; }

/* At desktop/tablet widths the second header row wraps normally instead of becoming a draggable scroll strip. */
@media (min-width: 701px) and (max-width: 1200px) {
  .one-page header nav {
    overflow: visible;
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 4px;
    scrollbar-width: auto;
  }
}

/* FAQ: roomier typography and consistent card spacing without a half-card hover fill. */
.one-page .faq-list { max-width: 1120px; gap: 22px; }
.one-page .faq-item {
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(185,142,130,.14);
  border-radius: 22px;
  box-shadow: 0 5px 18px rgba(81,71,63,.045);
  overflow: hidden;
}
.one-page .faq-item summary {
  padding: 30px 36px;
  border-radius: 0;
}
.one-page .faq-item summary h2 {
  font-size: clamp(1.45rem, 2vw, 1.75rem);
  line-height: 1.3;
}
.one-page .faq-answer {
  padding: 0 36px 32px;
}
.one-page .faq-answer p,
.one-page .faq-answer li {
  font-size: 1.1rem;
  line-height: 1.8;
  color: var(--muted);
}
.one-page .faq-answer p { margin: 0; }
.one-page .faq-answer { margin-top: -12px; }
@media (hover: hover) {
  .one-page .faq-item summary:hover { background: transparent; color: var(--rose-dark); }
}
@media (max-width: 700px) {
  .one-page .faq-list { gap: 16px; }
  .one-page .faq-item summary { padding: 24px 22px; }
  .one-page .faq-item summary h2 { font-size: 1.35rem; }
  .one-page .faq-answer { padding: 0 22px 25px; margin-top: -8px; }
  .one-page .faq-answer p, .one-page .faq-answer li { font-size: 1.02rem; }
}


/* FAQ open/close motion. Height is animated in motion.js so native <details> stays accessible. */
.one-page .faq-item { will-change: height; }
.one-page .faq-item[open] { box-shadow: 0 8px 24px rgba(81,71,63,.065); }
.one-page .faq-item[open] .faq-chevron { transform: rotate(180deg); }
.one-page .faq-item.is-closing .faq-chevron { transform: rotate(0deg); }
.one-page .faq-answer { transform-origin: top; }
.one-page .faq-item.is-expanding .faq-answer { animation: faq-answer-in 300ms ease-out both; }
.one-page .faq-item.is-closing .faq-answer { animation: faq-answer-out 220ms ease-in both; }
@keyframes faq-answer-in {
  from { opacity: 0; transform: translateY(-7px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes faq-answer-out {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(-5px); }
}
@media (prefers-reduced-motion: reduce) {
  .one-page .faq-item { will-change: auto; }
}


/* ===== Stories, full gallery and image loading placeholders ===== */
img {
  background-color: #eaded7;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2NDAiIGhlaWdodD0iMzYwIiB2aWV3Qm94PSIwIDAgNjQwIDM2MCI+PHJlY3Qgd2lkdGg9IjY0MCIgaGVpZ2h0PSIzNjAiIGZpbGw9IiNlYWRlZDciLz48dGV4dCB4PSIzMjAiIHk9IjE4MCIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgZmlsbD0iIzk1Njk1ZSIgZm9udC1mYW1pbHk9IkFyaWFsLCBzYW5zLXNlcmlmIiBmb250LXNpemU9IjI0Ij5Lw6lwIGJldMO2bHTDqXNl4oCmPC90ZXh0Pjwvc3ZnPg==");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
img.image-loaded { background-image: none; background-color: transparent; }
.hero-image.image-bg-loading { background-color: #eaded7; }
.hero-image.image-bg-loading::before {
  content: 'Kép betöltése…'; position: absolute; inset: 0; display: grid; place-items: center;
  color: var(--rose-dark); font-weight: 600; letter-spacing: .03em; z-index: 0;
  transition: opacity .2s ease;
}
.hero-image.image-bg-loaded::before { opacity: 0; pointer-events: none; }
.hero-image::after { z-index: 1; }

.section-action { display: flex; justify-content: center; margin-top: 36px; }
.gallery-more { padding: 0 24px; }

.stories-section { max-width: 1260px; }
.story-post {
  background: var(--paper); border: 1px solid var(--line); border-radius: 28px; overflow: hidden;
  box-shadow: 0 10px 34px rgba(81,71,63,.07); margin-bottom: 54px;
}
.story-post:last-child { margin-bottom: 0; }
.story-media { display: grid; background: #eaded7; }
.story-media img { cursor: zoom-in; }
.story-media img:focus-visible { outline-offset: -5px; }
.story-media-three { grid-template-columns: 1.35fr .85fr; grid-template-rows: 1fr 1fr; min-height: 520px; }
.story-media-three img, .story-media-three iframe, .story-media-three video { width: 100%; height: 100%; object-fit: cover; min-width: 0; min-height: 0; border: 0; }
.story-media-three > :first-child { grid-row: 1 / span 2; }
.story-copy { padding: clamp(30px, 5vw, 64px); max-width: 1080px; margin: 0 auto; }
.story-copy h3 { font: 400 clamp(1.9rem, 3vw, 3rem)/1.2 var(--serif); color: var(--rose-dark); margin: 0 0 24px; }
.story-copy p { color: var(--muted); font-size: 1.04rem; line-height: 1.8; margin-bottom: 18px; }
.story-copy p:last-child { margin-bottom: 0; }
.story-meta { color: var(--rose-dark) !important; font-size: .9rem !important; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; margin-bottom: 14px !important; }
.stories-list { max-width: 1260px; }

.subpage .site-header { box-shadow: 0 5px 24px rgba(81,71,63,.08); }
.subpage-hero { padding: 76px 0 70px; text-align: center; }
.subpage-hero .section-inner { max-width: 1050px; }
.subpage-hero h1 { color: var(--rose-dark); font-size: clamp(2.5rem, 5vw, 4.8rem); margin-bottom: 20px; }
.subpage-hero .lead { max-width: 820px; }

/* ===== v6.3 — gallery tiles always match their visible images =====
   The old grid-row: span 2 and mixed image min/max heights left empty space
   inside some tall cards. Keep every card at a reliable 3:4 ratio instead. */
.gallery-grid-large {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  align-items: start;
}
.gallery-grid-large > .gallery-grid-item {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 0;
  aspect-ratio: 3 / 4;
  background: #eaded7;
  border-radius: 24px;
  overflow: hidden;
}
.gallery-grid-large > .gallery-grid-item > img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  object-fit: cover;
  border-radius: inherit;
}

@media (max-width: 1000px) {
  .story-media-three { min-height: 430px; }
  .gallery-grid-large { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
}
@media (max-width: 700px) {
  .subpage-hero { padding: 52px 0 48px; }
  .story-media-three { grid-template-columns: 1fr 1fr; grid-template-rows: 290px 190px; min-height: 0; }
  .story-media-three > :first-child { grid-column: 1 / -1; grid-row: auto; }
  .story-copy { padding: 28px 22px 32px; }
  .story-copy h3 { font-size: 1.9rem; }
  .story-copy p { font-size: 1rem; }
  .gallery-grid-large { gap: 12px; }
  .gallery-grid-large > .gallery-grid-item { border-radius: 16px; }
}

/* ===== Shared header + compact homepage story preview ===== */
canine-header { display: block; position: sticky; top: 0; z-index: 1000; }
.home-page .latest-story {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  align-items: stretch;
  margin-bottom: 0;
}
.home-page .latest-story .story-media-three {
  min-height: 390px;
}
.home-page .latest-story .story-copy {
  padding: clamp(30px, 4vw, 48px);
  max-width: none;
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.home-page .latest-story .story-copy h3 {
  font-size: clamp(1.75rem, 2.4vw, 2.55rem);
  margin-bottom: 18px;
}
.home-page .story-excerpt {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  overflow: hidden;
  margin-bottom: 26px !important;
}
.story-read-more {
  align-self: flex-start;
  min-height: 46px;
  padding: 10px 24px;
}
.story-post[id] { scroll-margin-top: 0; }

@media (max-width: 900px) {
  .home-page .latest-story { grid-template-columns: 1fr; }
  .home-page .latest-story .story-media-three { min-height: 380px; }
}
@media (max-width: 700px) {
  .home-page .latest-story .story-media-three { min-height: 0; }
  .home-page .story-excerpt { -webkit-line-clamp: 6; }
  .story-read-more { width: 100%; }
}

@media (max-width: 700px) {
  .photo-full { max-width: 94vw; max-height: 82dvh; height: auto; }
  .photo-nav { width: 44px; height: 44px; font-size: 34px; }
  .photo-prev { left: 6px; }
  .photo-next { right: 6px; }
  .photo-close { right: 6px; top: 6px; }
}



/* ===== v2.11 — canonical shared header sizing/layout =====
   Header markup already comes from header.js on every page. These rules make
   its typography and positioning identical on the homepage and sub-pages. */
.site-header .header-inner {
  max-width: 1840px;
  gap: 22px;
}
.site-header nav {
  gap: clamp(11px, 1.25vw, 24px);
}
.site-header nav a {
  font-size: clamp(.88rem, .95vw, 1.05rem);
  white-space: nowrap;
}
.site-header .nav-book {
  padding-inline: 21px;
}

@media (max-width: 1200px) {
  .site-header .header-inner {
    flex-wrap: wrap;
    padding-top: 10px;
    padding-bottom: 10px;
    gap: 8px 18px;
  }
  .site-header .brand { order: 1; }
  .site-header .nav-book { order: 2; }
  .site-header nav {
    order: 3;
    width: 100%;
    display: flex;
    overflow-x: auto;
    justify-content: flex-start;
    gap: clamp(11px, 1.25vw, 24px);
    scrollbar-width: thin;
    padding: 2px 0 1px;
  }
  .site-header nav a { flex: 0 0 auto; }
}

@media (max-width: 700px) {
  .site-header .header-inner { display: flex; }
  .site-header nav {
    display: flex;
    grid-template-columns: none;
    gap: 18px;
  }
  .site-header nav a {
    justify-self: auto;
    font-size: .88rem;
  }
  .site-header .brand img { width: 48px; height: 48px; }
  .site-header .brand strong { font-size: 1.3rem; }
  .site-header .brand small { font-size: .62rem; }
  .site-header .nav-book {
    min-height: 42px;
    padding: 8px 15px;
    font-size: .86rem;
  }
}

@media (max-width: 480px) {
  .site-header .brand span { display: none; }
  .site-header .nav-book { margin-left: auto; }
}

@media (min-width: 701px) and (max-width: 1200px) {
  .site-header nav {
    overflow: visible;
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 4px;
    scrollbar-width: auto;
  }
}

/* ===== v2.13 — editorial Nálunk jártak story layout =====
   Each story flows chronologically: dog portrait -> therapy -> closing image.
   Keep these three blocks when duplicating an article manually. */
.stories-page .stories-list {
  max-width: 1420px;
}
.stories-page .story-post-editorial {
  overflow: hidden;
}
.stories-page .story-opening,
.stories-page .story-middle,
.stories-page .story-ending {
  display: grid;
  align-items: stretch;
}
.stories-page .story-opening {
  grid-template-columns: minmax(320px, .78fr) minmax(0, 1.22fr);
}
.stories-page .story-middle {
  grid-template-columns: minmax(0, 1.18fr) minmax(340px, .82fr);
  border-top: 1px solid var(--line);
}
.stories-page .story-ending {
  grid-template-columns: minmax(380px, 1.08fr) minmax(0, .92fr);
  border-top: 1px solid var(--line);
}
.stories-page .story-copy {
  max-width: none;
  margin: 0;
  padding: clamp(36px, 4.2vw, 64px);
}
.stories-page .story-copy-opening {
  align-self: start;
}
.stories-page .story-copy-section {
  align-self: center;
}
.stories-page .story-media {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: #eaded7;
}
.stories-page .story-media img,
.stories-page .story-media iframe,
.stories-page .story-media video {
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  border: 0;
}
.stories-page .story-media-opening {
  min-height: 560px;
}
.stories-page .story-media-opening img {
  object-position: center center;
}
.stories-page .story-media-therapy {
  min-height: 520px;
}
.stories-page .story-media-ending {
  min-height: 450px;
}
.stories-page #zseni .story-media-ending img {
  object-position: center 45%;
}
.stories-page #lea .story-media-therapy img {
  object-position: center center;
}
.stories-page .story-copy h3 {
  margin-top: 0;
}

@media (max-width: 1050px) {
  .stories-page .story-opening,
  .stories-page .story-middle,
  .stories-page .story-ending {
    grid-template-columns: 1fr 1fr;
  }
  .stories-page .story-media-opening,
  .stories-page .story-media-therapy,
  .stories-page .story-media-ending {
    min-height: 460px;
  }
}

@media (max-width: 760px) {
  .stories-page .story-opening,
  .stories-page .story-middle,
  .stories-page .story-ending {
    grid-template-columns: 1fr;
  }
  .stories-page .story-opening .story-media { order: 1; }
  .stories-page .story-opening .story-copy { order: 2; }
  .stories-page .story-middle .story-copy { order: 1; }
  .stories-page .story-middle .story-media { order: 2; }
  .stories-page .story-ending .story-copy { order: 1; }
  .stories-page .story-ending .story-media { order: 2; }
  .stories-page .story-copy {
    padding: 30px 22px 34px;
  }
  .stories-page .story-media-opening {
    min-height: 0;
    aspect-ratio: 4 / 5;
  }
  .stories-page .story-media-therapy {
    min-height: 0;
    aspect-ratio: 4 / 3;
  }
  .stories-page .story-media-ending {
    min-height: 0;
    aspect-ratio: 4 / 3;
  }
  .stories-page .story-media img {
    min-height: 0;
  }
}

/* ===== v2.15 — mobile horizontal-overflow fix =====
   Keep every homepage section inside the visual viewport. The Services grid
   contains replaced/grid elements whose intrinsic width could otherwise make
   the document a few pixels wider than the mobile viewport when zooming. */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
  overflow-x: clip;
}

main,
.page-section,
.section-inner,
.service-layout,
.service-layout > *,
.service-grid,
.service-card {
  min-width: 0;
}

@media (max-width: 700px) {
  .section-inner,
  .service-layout,
  .service-grid {
    width: 100%;
    max-width: 100%;
  }

  .service-layout > * {
    width: 100%;
    max-width: 100%;
  }

  .service-photo {
    display: block;
    width: 100%;
    max-width: 100%;
  }

  .service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .service-card {
    width: 100%;
    max-width: 100%;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 430px) {
  /* Give the service cards enough room on very narrow phones without ever
     forcing the page wider than the viewport. */
  .service-grid {
    grid-template-columns: 1fr;
  }
}

/* ===== v2.17 — hero image right, copy left =====
   Keep a strict split between copy and photography so headline/body text can
   never drift across the dog's head at desktop widths. */
@media (min-width: 851px) {
  .one-page .hero {
    min-height: min(760px, calc(100vh - var(--header-height)));
  }

  .one-page .hero-image {
    inset: 0 0 0 50%;
    background-position: center center;
  }

  .one-page .hero-image::after {
    display: block;
    background: linear-gradient(
      90deg,
      var(--cream) 0%,
      rgba(248,247,241,.94) 10%,
      rgba(248,247,241,.55) 24%,
      transparent 42%
    );
  }

  .one-page .hero-content {
    width: 50%;
    max-width: none;
    margin-left: 0;
    margin-right: auto;
    padding-left: max(5.4vw, 44px);
    padding-right: clamp(32px, 4vw, 68px);
  }

  .one-page .hero h1,
  .one-page .hero-copy {
    max-width: 650px;
  }
}

@media (max-width: 850px) {
  .one-page .hero-image {
    background-position: 56% center;
  }
}

/* ===== v2.19 — contained split hero based on the alternate design =====
   Text and photography are separate grid columns. This keeps the copy clear of
   the dog's face at every desktop width while preserving a roomy editorial hero. */
.one-page .hero {
  min-height: auto;
  background: #FBF5E6;
  display: block;
  overflow: hidden;
}

.one-page .hero-inner {
  width: 100%;
  max-width: 1760px;
  min-height: min(710px, calc(100vh - var(--header-height)));
  margin: 0 auto;
  padding: clamp(58px, 5vw, 86px) clamp(34px, 4vw, 68px);
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
  gap: clamp(52px, 6vw, 104px);
  align-items: center;
}

.one-page .hero-content {
  width: 100%;
  max-width: 700px;
  margin: 0;
  padding: 0;
  z-index: 1;
}

.one-page .hero-image {
  position: relative;
  inset: auto;
  width: 100%;
  height: clamp(455px, 37vw, 610px);
  min-height: 0;
  max-height: none;
  border-radius: 24px;
  overflow: hidden;
  background-size: cover;
  background-position: center 54%;
  box-shadow: 0 10px 34px rgba(81,71,63,.08);
}

.one-page .hero-image::after {
  display: none;
}

.one-page .hero-kicker {
  color: var(--rose);
  font-size: clamp(1.05rem, 1.15vw, 1.3rem);
  margin-bottom: 28px;
}

.one-page .hero h1 {
  color: var(--rose);
  max-width: 690px;
  font-size: clamp(3.05rem, 4.25vw, 5rem);
  line-height: 1.08;
  letter-spacing: -.025em;
  margin-bottom: 30px;
}

.one-page .hero-copy {
  max-width: 690px;
  color: var(--ink);
  font-size: clamp(1.05rem, 1.18vw, 1.24rem);
  line-height: 1.58;
  margin-bottom: 34px;
}

.one-page .hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
}

.one-page .hero .button {
  min-height: 54px;
  border-radius: 999px;
  padding: 13px 26px;
  font-size: 1rem;
}

.one-page .hero-primary {
  background: var(--rose);
  border-color: var(--rose);
  color: var(--paper);
  gap: 10px;
}

.one-page .hero-primary svg {
  width: 21px;
  height: 21px;
}

.one-page .hero-secondary {
  background: transparent;
  border-color: var(--rose);
  color: var(--rose);
}

@media (hover: hover) {
  .one-page .hero-primary:hover {
    background: var(--rose-dark);
    border-color: var(--rose-dark);
  }

  .one-page .hero-secondary:hover {
    background: rgba(185,142,130,.10);
    border-color: var(--rose);
    color: var(--rose-dark);
  }
}

.one-page .first-meeting {
  margin-top: 26px;
  color: var(--ink);
}

.one-page .first-meeting svg {
  color: var(--rose);
}

@media (max-width: 1050px) and (min-width: 851px) {
  .one-page .hero-inner {
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    gap: 42px;
    padding-inline: 34px;
  }

  .one-page .hero h1 {
    font-size: clamp(2.8rem, 5vw, 3.8rem);
  }

  .one-page .hero-image {
    height: clamp(420px, 44vw, 530px);
  }
}

@media (max-width: 850px) {
  .one-page .hero-inner {
    min-height: 0;
    padding: 0;
    display: flex;
    flex-direction: column-reverse;
    gap: 0;
    align-items: stretch;
  }

  .one-page .hero-image {
    width: calc(100% - 40px);
    height: 58vw;
    min-height: 285px;
    max-height: 470px;
    margin: 28px 20px 0;
    border-radius: 20px;
    background-position: center 54%;
  }

  .one-page .hero-content {
    max-width: 720px;
    padding: 40px 24px 56px;
  }

  .one-page .hero-kicker {
    margin-bottom: 18px;
  }

  .one-page .hero h1 {
    font-size: clamp(2.55rem, 8vw, 4rem);
    margin-bottom: 24px;
  }

  .one-page .hero-copy {
    font-size: 1rem;
    margin-bottom: 28px;
  }
}

@media (max-width: 480px) {
  .one-page .hero-image {
    width: calc(100% - 28px);
    margin-inline: 14px;
    min-height: 250px;
    border-radius: 16px;
  }

  .one-page .hero-content {
    padding: 34px 20px 48px;
  }

  .one-page .hero h1 br {
    display: none;
  }

  .one-page .hero-actions {
    gap: 12px;
  }

  .one-page .hero .button {
    min-height: 50px;
    padding-inline: 20px;
  }
}

/* v2.21 refinements */
/* Soft circular badges for the three "Rólam" qualities. */
.qualities > div > svg {
  width: 38px;
  height: 38px;
  padding: 8px;
  border-radius: 12px;
  background: #eadbd2;
  color: var(--rose-dark);
  flex: 0 0 38px;
}

/* Give CTA-style controls a consistent, subtle lift. */
.button {
  box-shadow: 0 7px 18px rgba(81, 71, 63, .22);
}
.photo-close,
.photo-nav {
  box-shadow: 0 5px 14px rgba(18, 15, 13, .22);
}

@media (hover: hover) {
  .button:hover {
    box-shadow: 0 10px 26px rgba(81, 71, 63, .28);
  }
}

.booking-panel .button:first-of-type {
  background: var(--rose);
  border-color: var(--rose);
  color: var(--paper);
}
@media (hover: hover) {
  .booking-panel .button:first-of-type:hover {
    background: var(--rose-dark);
    border-color: var(--rose-dark);
  }
}


/* ===== v3.5: client update ===== */
/* Hero: textual content uses the requested warm brown, while CTA colors
   retain the pre-v4 appearance. */
.one-page .hero,
.one-page .hero-kicker,
.one-page .hero h1,
.one-page .hero-copy,
.one-page .first-meeting,
.one-page .first-meeting strong {
  color: #6d5854;
}
.one-page .hero-primary {
  color: var(--paper);
}
.one-page .hero-secondary {
  color: var(--rose);
  border-color: var(--rose);
}
@media (hover:hover) {
  .one-page .hero-secondary:hover {
    color: var(--rose-dark);
    border-color: var(--rose);
  }
}

/* Homepage blog: one-image preview. */
.home-blog-card {
  display: grid;
  grid-template-columns: minmax(320px, .82fr) minmax(0, 1.18fr);
  max-width: 1180px;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 28px;
  background: var(--paper);
  border: 1px solid #e4d6cc;
  box-shadow: 0 12px 30px rgba(81,71,63,.08);
}
.home-blog-image { min-height: 500px; background: #eaded7; }
.home-blog-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.home-blog-copy { padding: clamp(34px, 5vw, 68px); margin: 0; align-self: center; }
.home-blog-copy h3 { font: 400 clamp(2rem, 3.1vw, 3.2rem)/1.18 var(--serif); color: var(--rose-dark); margin: 0 0 24px; }
.home-blog-copy .story-excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; }
.home-blog-copy .story-read-more { margin-top: 8px; }

/* Blog subpage inspired by the supplied editorial PDF. */
.blog-editorial-main { background: #fff; padding-bottom: 120px; }
.blog-page-intro { max-width: 1240px; margin: 0 auto; padding: 54px 52px 8px; }
.blog-page-intro .eyebrow { margin-bottom: 7px; }
.blog-page-intro h1 { margin: 0; color: var(--rose-dark); font-size: clamp(2.2rem,4vw,4rem); }
.blog-article-section { padding: 62px 0 100px; }
.blog-article-section + .blog-article-section { border-top: 1px solid #eadfd7; }
.pdf-story { max-width: 1240px; margin: 0 auto; padding: 0 52px; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.pdf-story-header { margin-bottom: 66px; }
.pdf-story-date { color: var(--muted); font-size: 1.02rem; margin: 0 0 14px; }
.pdf-story-header h2 { font-size: clamp(2rem,3vw,3.25rem); color: var(--rose); margin: 0; line-height: 1.12; }
.pdf-story-header h2 span { display: block; color: var(--ink); font-size: .82em; margin-bottom: 3px; }
.pdf-story-grid { display: grid; grid-template-columns: minmax(300px,.88fr) minmax(0,1.25fr); gap: clamp(38px,5vw,76px); align-items: start; margin-bottom: 68px; }
.pdf-story-grid-middle { grid-template-columns: minmax(0,1fr) minmax(330px,1.12fr); align-items: center; }
.pdf-story-media { background: transparent; border-radius: 24px; overflow: hidden; }
.pdf-story-media img { display: block; width: 100%; height: auto; max-height: 600px; object-fit: cover; border-radius: 24px; cursor: zoom-in; }
.pdf-story-grid-opening .pdf-story-media img { aspect-ratio: 4 / 5.1; object-position: center; }
.pdf-story-media-wide img { aspect-ratio: 1.35 / 1; object-position: center; }
.pdf-story-copy { padding: 0; margin: 0; max-width: none; }
.pdf-story-copy h3 { color: var(--rose); font: 400 clamp(1.45rem,2.1vw,2rem)/1.25 var(--serif); margin: 0 0 20px; }
.pdf-story-copy p { color: var(--ink); font-size: 1rem; line-height: 1.62; margin: 0 0 20px; }
.pdf-story-closing { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(38px,6vw,90px); align-items: start; }
.pdf-story-closing > p { color: var(--ink); font-size: 1rem; line-height: 1.62; margin: 0; }
.pdf-story-closing blockquote { margin: 0; color: var(--rose); font: 400 clamp(1.55rem,2.35vw,2.3rem)/1.45 var(--serif); }
.pdf-story-closing-lea .pdf-story-copy { max-width: none; }
.pdf-story-closing-lea blockquote { align-self: center; }

/* Shared legal/footer presentation. */
footer { max-width: 1440px; }
.footer-links { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; }
.footer-links a { color: var(--muted); text-decoration: none; text-underline-offset: 4px; }
.footer-links a:hover { color: var(--rose-dark); text-decoration: underline; }
.footer-links span { color: #c9bcb2; }
.legal-main { background: #fff; }
.legal-inner { max-width: 1040px; margin: 0 auto; padding-left: 44px; padding-right: 44px; }
.legal-hero { padding: 70px 0 62px; }
.legal-hero h1 { color: var(--rose-dark); font-size: clamp(2.5rem,5vw,4.6rem); margin: 0 0 16px; }
.legal-effective { color: var(--muted); margin: 0; }
.legal-document { padding-top: 64px; padding-bottom: 90px; }
.legal-document section { margin: 0 0 52px; scroll-margin-top: calc(var(--header-height) + 25px); }
.legal-document h2 { color: var(--rose-dark); font-size: clamp(1.6rem,2.5vw,2.15rem); margin: 0 0 20px; }
.legal-document h3 { color: var(--rose-dark); font: 400 1.25rem/1.35 var(--serif); margin: 28px 0 12px; }
.legal-document p, .legal-document li, .legal-document dd, .legal-document dt { font-size: 1rem; line-height: 1.72; }
.legal-document p { margin: 0 0 18px; }
.legal-document a { color: var(--rose-dark); overflow-wrap: anywhere; }
.legal-intro { font-size: 1.08rem !important; color: var(--muted); }
.legal-data { margin: 0; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.legal-data div { display: grid; grid-template-columns: minmax(190px,.7fr) 1fr; gap: 22px; padding: 12px 18px; }
.legal-data div + div { border-top: 1px solid var(--line); }
.legal-data dt { color: var(--muted); }
.legal-data dd { margin: 0; font-weight: 600; }
.legal-toc { background: #F8F1E7; border-radius: 20px; padding: 25px 30px; margin: 34px 0 50px; }
.legal-toc strong { display: block; font-family: var(--serif); font-size: 1.35rem; color: var(--rose-dark); margin-bottom: 10px; }
.legal-toc ol { margin: 0; padding-left: 1.2rem; columns: 2; column-gap: 45px; }
.legal-toc li { break-inside: avoid; margin: 5px 0; }
.legal-toc a { color: var(--ink); text-decoration: none; }
.legal-toc a:hover { color: var(--rose-dark); text-decoration: underline; }
.legal-table-wrap { overflow-x: auto; margin: 24px 0; }
.legal-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.legal-table th, .legal-table td { border: 1px solid #cfc3ba; padding: 12px 13px; text-align: left; vertical-align: top; line-height: 1.5; }
.legal-table th { background: #F8F1E7; color: var(--rose-dark); }
.legal-signoff { margin-top: 70px; padding-top: 28px; border-top: 1px solid var(--line); display: grid; gap: 5px; color: var(--muted); }
.legal-signoff strong { color: var(--ink); }

@media (max-width: 850px) {
  .home-blog-card { grid-template-columns: 1fr; }
  .home-blog-image { min-height: 0; height: min(105vw, 520px); }
  .home-blog-copy { padding: 30px 24px 34px; }
  .pdf-story { padding-inline: 24px; }
  .blog-page-intro { padding: 42px 24px 4px; }
  .blog-article-section { padding: 48px 0 72px; }
  .pdf-story-header { margin-bottom: 38px; }
  .pdf-story-grid, .pdf-story-grid-middle, .pdf-story-closing { grid-template-columns: 1fr; gap: 28px; margin-bottom: 48px; }
  .pdf-story-grid-middle .pdf-story-copy { order: 1; }
  .pdf-story-grid-middle .pdf-story-media { order: 2; }
  .pdf-story-grid-opening .pdf-story-media img { aspect-ratio: auto; max-height: 580px; }
  .pdf-story-media-wide img { aspect-ratio: auto; max-height: 520px; }
  .pdf-story-closing blockquote { padding: 8px 0 0; }
  .legal-inner { padding-left: 22px; padding-right: 22px; }
  .legal-hero { padding: 48px 0 42px; }
  .legal-document { padding-top: 42px; padding-bottom: 68px; }
  .legal-toc ol { columns: 1; }
  .legal-data div { grid-template-columns: 1fr; gap: 1px; }
  footer { margin-inline: 20px; }
  .footer-links { width: 100%; margin-left: 0; justify-content: flex-start; }
}

.footer-links a { border-bottom: 0; padding: 0; font-size: .9rem; }
.footer-links a::after { display: none !important; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

/* ===== v4.3 fixes ===== */
/* Limit the global header background styling to the actual site header only.
   Story/article headers on the blog page must stay transparent. */
.pdf-story-header {
  background: transparent;
  color: inherit;
}

/* On the privacy page, show a clean single underline only on hover. */
.legal-document a {
  color: var(--rose-dark);
  overflow-wrap: anywhere;
  text-decoration: none;
}
.legal-document a:hover {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

/* ===== v4.4 legal link hover cleanup ===== */
/* Keep links on the legal pages clean: no text or generated underlines. */
.legal-main a,
.legal-page footer a {
  text-decoration: none !important;
}
.legal-main nav a::after,
.legal-page footer nav a::after {
  content: none !important;
  display: none !important;
}
.legal-main a:hover,
.legal-page footer a:hover {
  color: var(--rose) !important;
  text-decoration: none !important;
}


/* ===== v4.5 hero color correction ===== */
/* Kicker/body/first-meeting stay dark; the main hero title uses the brighter rose. */
.one-page .hero-kicker,
.one-page .hero-copy,
.one-page .first-meeting,
.one-page .first-meeting strong {
  color: #6d5854;
}
.one-page .hero h1 {
  color: var(--rose);
}


/* ===== v4.9 cookie consent ===== */
.cookie-banner[hidden] { display: none !important; }
.cookie-banner {
  position: fixed; z-index: 1900; left: 50%; bottom: 22px; transform: translateX(-50%);
  width: min(1180px, calc(100% - 40px)); display: grid; grid-template-columns: auto minmax(0,1fr) auto;
  gap: 22px; align-items: center; padding: 20px 24px; background: rgba(255,254,250,.98);
  border: 1px solid #e2d5cb; border-radius: 22px; box-shadow: 0 14px 42px rgba(81,71,63,.2);
  color: var(--ink); backdrop-filter: blur(12px);
}
.cookie-banner-icon { width: 60px; height: 60px; display: grid; place-items: center; border-radius: 50%; background: #f1dfc4; font-size: 2rem; }
.cookie-banner-copy h2 { font: 600 1.12rem/1.25 var(--serif); margin: 0 0 5px; color: var(--ink); }
.cookie-banner-copy p { margin: 0; font-size: .9rem; line-height: 1.5; color: var(--ink); max-width: 690px; }
.cookie-banner-links, .cookie-panel-links { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; margin-top: 7px; font-size: .8rem; color: var(--muted); }
.cookie-banner-links a, .cookie-panel-links a { color: var(--rose-dark); text-decoration: none; transition: color .18s ease; }
.cookie-banner-links a:hover, .cookie-panel-links a:hover { color: var(--rose); }
.cookie-banner-actions { display: flex; gap: 12px; align-items: center; }
.cookie-button { border: 1px solid #d6c4b9; border-radius: 999px; padding: 10px 20px; min-height: 44px; font: 600 .86rem/1 var(--sans); cursor: pointer; box-shadow: 0 5px 14px rgba(81,71,63,.10); transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease, border-color .18s ease; }
.cookie-button-primary { background: var(--rose); border-color: var(--rose); color: var(--paper); }
.cookie-button-secondary { background: var(--paper); color: var(--rose-dark); }
@media (hover:hover) { .cookie-button:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(81,71,63,.16); } .cookie-button-primary:hover { background: var(--rose-dark); border-color: var(--rose-dark); } }
.cookie-button:focus-visible, .cookie-tab:focus-visible, .cookie-dialog-close:focus-visible, .cookie-switch input:focus-visible + span { outline: 3px solid #6d5854; outline-offset: 3px; }

.cookie-dialog { width: min(850px, calc(100% - 32px)); max-height: min(740px, calc(100vh - 32px)); padding: 0; border: 0; border-radius: 26px; background: var(--paper); color: var(--ink); box-shadow: 0 22px 70px rgba(43,35,31,.28); overflow: auto; }
.cookie-dialog::backdrop { background: rgba(42,35,31,.46); backdrop-filter: blur(2px); }
.cookie-dialog-shell { padding: 0; }
.cookie-dialog-head { display: flex; align-items: center; justify-content: space-between; padding: 24px 28px 18px; border-bottom: 1px solid var(--line); }
.cookie-dialog-head h2 { margin: 0; font-size: 1.45rem; color: var(--ink); }
.cookie-dialog-close { border: 0; background: transparent; color: var(--ink); font-size: 2rem; line-height: 1; cursor: pointer; width: 42px; height: 42px; border-radius: 50%; }
.cookie-dialog-body { display: grid; grid-template-columns: 235px minmax(0,1fr); min-height: 390px; }
.cookie-tabs { padding: 22px 14px; border-right: 1px solid var(--line); background: #fffdf8; }
.cookie-tab { width: 100%; display: flex; align-items: center; gap: 10px; border: 0; background: transparent; color: var(--ink); border-radius: 10px; padding: 12px 14px; text-align: left; font: 500 .9rem/1.25 var(--sans); cursor: pointer; }
.cookie-tab + .cookie-tab { margin-top: 5px; }
.cookie-tab.is-active { background: var(--rose); color: var(--paper); }
.cookie-panels { padding: 30px 30px 24px; display: flex; flex-direction: column; min-width: 0; }
.cookie-panel[hidden] { display: none !important; }
.cookie-panel h3 { margin: 0 0 8px; font: 600 1.05rem/1.3 var(--serif); color: var(--ink); }
.cookie-panel p { margin: 0; font-size: .92rem; line-height: 1.58; color: var(--ink); }
.cookie-panel-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.cookie-status { flex: 0 0 auto; background: #edf3e7; color: #587247; border-radius: 999px; padding: 6px 11px; font-size: .76rem; font-weight: 600; }
.cookie-switch { display: flex; flex: 0 0 auto; align-items: center; gap: 9px; cursor: pointer; }
.cookie-switch input { position: absolute; opacity: 0; pointer-events: none; }
.cookie-switch span { position: relative; display: block; width: 48px; height: 26px; border-radius: 999px; background: #d8cec7; transition: background .2s ease; }
.cookie-switch span::after { content: ''; position: absolute; top: 4px; left: 4px; width: 18px; height: 18px; border-radius: 50%; background: white; box-shadow: 0 2px 5px rgba(0,0,0,.16); transition: transform .2s ease; }
.cookie-switch input:checked + span { background: var(--rose); }
.cookie-switch input:checked + span::after { transform: translateX(22px); }
.cookie-switch em { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cookie-panel-links { margin-top: auto; padding-top: 36px; }
.cookie-dialog-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }

@media (max-width: 850px) {
  .cookie-banner { bottom: 12px; width: calc(100% - 24px); grid-template-columns: auto 1fr; gap: 14px; padding: 17px; }
  .cookie-banner-icon { width: 48px; height: 48px; font-size: 1.65rem; align-self: start; }
  .cookie-banner-actions { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
  .cookie-banner-actions .cookie-button-primary { grid-column: 1 / -1; grid-row: 1; }
  .cookie-banner-actions .cookie-button { width: 100%; }
  .cookie-dialog-body { grid-template-columns: 1fr; }
  .cookie-tabs { border-right: 0; border-bottom: 1px solid var(--line); display: flex; gap: 8px; padding: 14px; }
  .cookie-tab { width: auto; flex: 1; justify-content: center; text-align: center; }
  .cookie-tab + .cookie-tab { margin-top: 0; }
  .cookie-panels { padding: 24px 20px 20px; }
}
@media (max-width: 520px) {
  .cookie-banner-copy p { font-size: .84rem; }
  .cookie-banner-links { font-size: .75rem; }
  .cookie-banner-actions { grid-template-columns: 1fr; }
  .cookie-banner-actions .cookie-button-primary { grid-column: auto; grid-row: auto; }
  .cookie-dialog { width: calc(100% - 20px); max-height: calc(100vh - 20px); border-radius: 20px; }
  .cookie-dialog-head { padding: 19px 18px 14px; }
  .cookie-tabs { flex-direction: column; }
  .cookie-panel-title { flex-direction: column; gap: 18px; }
  .cookie-switch { align-self: flex-start; }
  .cookie-dialog-actions { flex-direction: column-reverse; }
  .cookie-dialog-actions .cookie-button { width: 100%; }
}


/* ===== v5.3 cookie motion ===== */
/* Wait for the page entrance, then bring the consent bar fully up from below
   the viewport. No opacity fade is used. */
.cookie-banner.is-opening {
  animation: cookie-banner-in .52s cubic-bezier(.16,.82,.24,1) both;
}
.cookie-banner.is-closing {
  pointer-events: none;
  animation: cookie-banner-out .34s cubic-bezier(.55,.05,.85,.35) both;
}
@keyframes cookie-banner-in {
  from { transform: translate(-50%, calc(100% + 48px)); }
  to   { transform: translate(-50%, 0); }
}
@keyframes cookie-banner-out {
  from { transform: translate(-50%, 0); }
  to   { transform: translate(-50%, calc(100% + 48px)); }
}

/* Settings dialog uses a short scale/slide transition, with a matching backdrop fade. */
.cookie-dialog[open] {
  animation: cookie-dialog-in .24s cubic-bezier(.2,.76,.28,1) both;
}
.cookie-dialog[open]::backdrop {
  animation: cookie-backdrop-in .24s ease-out both;
}
.cookie-dialog.is-closing {
  animation: cookie-dialog-out .20s ease-in both;
}
.cookie-dialog.is-closing::backdrop {
  animation: cookie-backdrop-out .20s ease-in both;
}
@keyframes cookie-dialog-in {
  from { opacity: 0; transform: translateY(16px) scale(.975); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes cookie-dialog-out {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to   { opacity: 0; transform: translateY(10px) scale(.985); }
}
@keyframes cookie-backdrop-in {
  from { background: rgba(42,35,31,0); backdrop-filter: blur(0); }
  to   { background: rgba(42,35,31,.46); backdrop-filter: blur(2px); }
}
@keyframes cookie-backdrop-out {
  from { background: rgba(42,35,31,.46); backdrop-filter: blur(2px); }
  to   { background: rgba(42,35,31,0); backdrop-filter: blur(0); }
}

/* Category content changes should feel connected rather than instantly swapping. */
.cookie-panel.is-entering {
  animation: cookie-panel-in .18s ease-out both;
}
@keyframes cookie-panel-in {
  from { opacity: 0; transform: translateX(7px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* Keep motion accessibility intact. */
@media (prefers-reduced-motion: reduce) {
  .cookie-banner.is-opening,
  .cookie-banner.is-closing,
  .cookie-dialog[open],
  .cookie-dialog.is-closing,
  .cookie-dialog[open]::backdrop,
  .cookie-dialog.is-closing::backdrop,
  .cookie-panel.is-entering {
    animation: none !important;
  }
}

/* ===== v5.7 — homepage blog mobile image containment =====
   Keep Zseni's image in its own block so it can never extend underneath the
   preview copy on narrow screens. */
@media (max-width: 850px) {
  .home-blog-card {
    display: flex;
    flex-direction: column;
  }

  .home-blog-image {
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 5 / 4;
    overflow: hidden;
    flex: 0 0 auto;
  }

  .home-blog-image img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: cover;
    object-position: center 45%;
  }

  .home-blog-copy {
    position: relative;
    z-index: 1;
    width: 100%;
    background: var(--paper);
  }
}

/* ===== v6.5 - section reorder / featured story emphasis ===== */
/* Keep Zseni's card distinct against the new white Nálunk jártak background. */
.one-page #blog .home-blog-card {
  box-shadow: 0 18px 48px rgba(81, 71, 63, .16),
              0 3px 12px rgba(81, 71, 63, .06);
}
