/* Borandszoda – a PONTAHOL része. Színek, betűk, ritmus a pontahol.hu-ról. */
:root{
  --red:#A8160A; --red-deep:#8A1108; --gold:#E8A23C; --cream:#F6F0E4; --ink:#16100D;
  --line:rgba(246,240,228,.14);
  --display:'Fraunces',Georgia,serif; --mono:'Space Mono',ui-monospace,monospace; --body:'Inter',system-ui,sans-serif;
  --ease:cubic-bezier(.16,.84,.32,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--ink);color:var(--cream);font-family:var(--body);font-weight:300;line-height:1.8;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--gold);color:var(--ink)}
img{max-width:100%;display:block}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:1px solid var(--gold);outline-offset:6px}
.wrap{max-width:1080px;margin:0 auto;padding:0 clamp(24px,5vw,40px)}
.mono{font-family:var(--mono);font-size:11px;letter-spacing:.3em;text-transform:uppercase}

/* kurzor – mint a pontaholon */
@media(hover:hover){body.cur{cursor:none}body.cur a,body.cur button{cursor:none}}
.cursor,.curring{position:fixed;top:0;left:0;pointer-events:none;border-radius:50%;mix-blend-mode:difference;opacity:0;z-index:9999}
.cursor{width:6px;height:6px;background:var(--cream);transition:width .35s var(--ease),height .35s var(--ease),opacity .3s}
.curring{width:30px;height:30px;border:1px solid rgba(246,240,228,.55);z-index:9998;transition:width .45s var(--ease),height .45s var(--ease),opacity .4s,border-color .4s}
.cursor.ready,.curring.ready{opacity:1}
.cursor.big{width:46px;height:46px}.curring.big{width:58px;height:58px;border-color:rgba(232,162,60,.8)}
@media(hover:none){.cursor,.curring{display:none}}

/* menü */
.bs-nav{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;justify-content:space-between;align-items:center;gap:20px;
  padding:clamp(22px,3vw,32px) clamp(24px,5vw,40px);font-family:var(--mono);font-size:11px;letter-spacing:.22em;
  mix-blend-mode:difference;transition:opacity .5s,transform .5s var(--ease)}
.bs-nav.hide{opacity:0;transform:translateY(-100%)}
.bs-nav a{color:var(--cream);text-decoration:none;opacity:.65;transition:opacity .3s;position:relative}
.bs-nav a:hover,.bs-nav a[aria-current]{opacity:1}
.bs-nav .logo{opacity:1;display:flex;gap:9px;align-items:center}
.bs-nav .ar{display:inline-block;transition:transform .5s var(--ease)}
.bs-nav .logo:hover .ar{transform:translateX(-5px)}
.bs-nav .links{display:flex;gap:clamp(16px,3vw,34px);flex-wrap:wrap;justify-content:flex-end}
.bs-nav .links a::after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:1px;background:var(--cream);transition:width .35s var(--ease)}
.bs-nav .links a:hover::after,.bs-nav .links a[aria-current]::after{width:100%}
@media(max-width:640px){.bs-nav{align-items:flex-start}.bs-nav .links{gap:6px 14px;max-width:62%}}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;padding:120px 24px 90px}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.05);transform:scale(1.04)}
.hero::after{content:"";position:absolute;inset:0;background:
  radial-gradient(ellipse 80% 70% at 50% 45%,rgba(22,16,13,.35),rgba(22,16,13,.82) 100%),
  linear-gradient(to bottom,rgba(22,16,13,.5),transparent 30%,transparent 65%,var(--ink))}
.hero-inner{position:relative;z-index:2}
.hero .kicker{color:var(--gold);opacity:.85;margin-bottom:28px;display:block}
.hero h1{font-family:var(--display);font-weight:300;font-size:clamp(34px,8.6vw,118px);letter-spacing:.14em;padding-left:.14em;line-height:1;white-space:nowrap}
.hero h1 .ch{display:inline-block;opacity:0;transform:translateY(30px) rotate(3deg);filter:blur(10px);animation:charIn 1.2s var(--ease) forwards}
@keyframes charIn{to{opacity:1;transform:none;filter:blur(0)}}
.hero .tag{font-family:var(--display);font-style:italic;font-weight:400;font-size:clamp(20px,3vw,32px);margin-top:26px;opacity:0;animation:fadeUp 1.2s 1.2s var(--ease) forwards}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:.9;transform:none}}
.scroll-cue{position:absolute;bottom:36px;left:50%;z-index:2;width:1px;height:48px;background:linear-gradient(var(--cream),transparent);opacity:.4;transform:translateX(-50%)}

/* krém manifesztó blokk */
.manifesto{background:var(--cream);color:var(--ink);padding:clamp(110px,18vw,200px) 0;position:relative}
.manifesto .idx{position:absolute;top:clamp(40px,6vw,56px);right:clamp(24px,5vw,40px);color:var(--gold);opacity:.8;font-family:var(--mono);font-size:10px;letter-spacing:.25em}
.manifesto .eyebrow{color:#8a7a6c;opacity:1}
.manifesto .big{font-family:var(--display);font-weight:300;font-size:clamp(32px,5.2vw,64px);line-height:1.22;letter-spacing:-.015em;max-width:17ch}
.manifesto .big em{font-style:italic;font-weight:400;
  background:linear-gradient(100deg,var(--red) 0%,var(--gold) 35%,#c8381f 62%,var(--red) 100%);background-size:280% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:emflow 6s ease-in-out infinite}
@keyframes emflow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.manifesto p{max-width:50ch;margin-top:36px;font-size:clamp(16px,1.9vw,19px);color:#5a4d43;line-height:1.85}
.manifesto .cols{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(32px,6vw,80px);align-items:end}
.manifesto .cols img{border-radius:4px;filter:saturate(.9)}
@media(max-width:820px){.manifesto .cols{grid-template-columns:1fr}}

/* szekció fejek */
section.dark{padding:clamp(100px,14vw,150px) 0;position:relative}
.eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.35em;opacity:.45;display:block;margin-bottom:clamp(28px,4vw,40px);text-transform:uppercase}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:clamp(36px,5vw,56px);border-bottom:1px solid var(--line);padding-bottom:22px}
.head h2{font-family:var(--display);font-weight:300;font-size:clamp(34px,6vw,72px);line-height:1;letter-spacing:.01em}
.head a{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-decoration:none;color:var(--gold);opacity:.8;white-space:nowrap}
.head a:hover{opacity:1}

/* termék-címkék */
.labels{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);gap:0;overflow-x:auto;scroll-snap-type:x mandatory;
  border-left:1px solid var(--line);scrollbar-width:thin;scrollbar-color:rgba(232,162,60,.5) transparent}
@media(min-width:1100px){.labels{grid-auto-columns:25%}}
.label{scroll-snap-align:start;display:flex;flex-direction:column;min-height:230px;padding:26px 24px 22px;
  border-right:1px solid var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  text-decoration:none;position:relative;transition:background .5s var(--ease)}
.label::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(232,162,60,.12),transparent 70%);opacity:0;transition:opacity .5s var(--ease)}
.label:hover::before{opacity:1}
.label .maker{font-family:var(--mono);font-size:10px;letter-spacing:.3em;color:var(--gold);opacity:.7}
.label .region{font-family:var(--display);font-weight:300;font-size:clamp(32px,3.2vw,42px);line-height:1;margin:18px 0 10px;
  transition:color .4s var(--ease),transform .55s var(--ease);white-space:nowrap}
.label .region.long{font-size:clamp(26px,2.6vw,34px)}
.label:hover .region{color:var(--gold);transform:translateX(8px)}
.label .kind{font-size:14px;opacity:.7}
.label .price{margin-top:auto;padding-top:18px;display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:12px;letter-spacing:.12em}
.label .price .go{color:var(--gold);opacity:0;transform:translateX(-10px);transition:opacity .45s var(--ease),transform .45s var(--ease);font-family:var(--display);font-size:22px}
.label:hover .price .go{opacity:1;transform:none}
.label .tag{position:absolute;top:24px;right:22px;font-family:var(--mono);font-size:9px;letter-spacing:.25em;color:var(--ink);background:var(--gold);padding:3px 8px;border-radius:2px}
.label.out{opacity:.38}
.label.out:hover::before{opacity:0}
.label.out:hover .region{color:var(--cream);transform:none}
@media(hover:none){.label .price .go{opacity:.8;transform:none}}

/* fröccspong – naplemente sáv, mint a Megállóknál */
.pong{background:linear-gradient(to bottom,#e2964c 0%,#be4e2a 22%,#8a2620 48%,#3a1820 78%,var(--ink) 100%);padding:clamp(110px,16vw,170px) 0;position:relative;overflow:hidden}
.pong::after{content:"";position:absolute;left:50%;top:35%;transform:translate(-50%,-50%);width:140vw;height:90vh;background:radial-gradient(ellipse,rgba(232,162,60,.25),transparent 58%);pointer-events:none}
.pong .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(32px,6vw,72px);align-items:center}
.pong img{width:100%;max-width:380px;aspect-ratio:3/4;object-fit:cover;border-radius:4px;border:1px solid rgba(246,240,228,.25)}
.pong h2{font-family:var(--display);font-weight:300;font-size:clamp(40px,7vw,86px);line-height:1}
.pong h2 em{font-style:italic;font-weight:400}
.pong p{max-width:40ch;margin-top:22px;opacity:.85;font-size:16px}
@media(max-width:760px){.pong .wrap{grid-template-columns:1fr}.pong img{max-width:100%}}

/* gombok – szöveges linkek, mint a pontahol "biglink" */
.cta{display:inline-flex;gap:12px;align-items:baseline;margin-top:34px;margin-right:28px;font-family:var(--display);font-weight:300;
  font-size:clamp(22px,2.6vw,30px);text-decoration:none;border-bottom:1px solid rgba(246,240,228,.35);padding-bottom:4px;transition:color .4s,border-color .4s}
.cta .ga{color:var(--gold);transition:transform .45s var(--ease)}
.cta:hover{color:var(--gold);border-color:var(--gold)}
.cta:hover .ga{transform:translate(4px,-4px)}
.manifesto .cta{border-color:rgba(22,16,13,.3)}
.manifesto .cta:hover{color:var(--red);border-color:var(--red)}

/* moments */
.moments-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:clamp(20px,3vw,32px)}
.moment .media{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:4px;background:#241a16}
.moment img,.moment video{width:100%;height:100%;object-fit:cover;filter:saturate(.9);transition:transform 1.2s var(--ease)}
.moment:hover img{transform:scale(1.04)}
.moment .dur{position:absolute;left:12px;bottom:10px;font-family:var(--mono);font-size:10px;letter-spacing:.2em}
.moment h3{font-family:var(--display);font-weight:300;font-size:21px;line-height:1.2;margin:16px 0 6px}
.moment p{font-size:14px;opacity:.65;line-height:1.7}

/* ledger – a pontahol "Ebből állunk össze" sorai, itt a cikkekhez */
.ledger{border-top:1px solid var(--line)}
.row{display:flex;align-items:center;gap:clamp(16px,3vw,40px);padding:clamp(24px,3.4vw,40px) clamp(4px,1vw,12px);
  border-bottom:1px solid var(--line);text-decoration:none;position:relative}
.row::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to right,rgba(232,162,60,.10),transparent 70%);opacity:0;transition:opacity .5s var(--ease)}
.row:hover::before{opacity:1}
.ridx{font-family:var(--mono);font-size:12px;color:var(--gold);opacity:.55;letter-spacing:.1em;min-width:2.4em;transition:opacity .4s}
.row:hover .ridx{opacity:1}
.rmid{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.rtitle{font-family:var(--display);font-weight:300;font-size:clamp(24px,3.4vw,40px);line-height:1.1;transition:color .4s var(--ease),transform .55s var(--ease)}
.row:hover .rtitle{color:var(--gold);transform:translateX(clamp(6px,1.2vw,16px))}
.rdesc{font-size:14px;opacity:0;max-width:60ch;line-height:1.7;max-height:0;overflow:hidden;transition:opacity .5s var(--ease),max-height .55s var(--ease)}
.row:hover .rdesc{opacity:.65;max-height:90px}
.rmeta{font-family:var(--mono);font-size:10px;letter-spacing:.22em;opacity:.4;text-transform:uppercase}
.rthumb{width:clamp(70px,10vw,120px);aspect-ratio:4/3;object-fit:cover;border-radius:3px;opacity:.75;filter:saturate(.85);transition:opacity .4s}
.row:hover .rthumb{opacity:1}
.rarr{font-family:var(--display);font-size:clamp(22px,3vw,32px);color:var(--gold);opacity:0;transform:translateX(-12px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.row:hover .rarr{opacity:1;transform:none}
@media(hover:none){.rdesc{opacity:.6;max-height:90px}.rarr{opacity:.8;transform:none}}
@media(max-width:600px){.row{padding:24px 0;gap:14px}.rthumb{display:none}}

/* ablak – teljes szélességű fotó koordinátával */
.win{position:relative;height:clamp(440px,78vh,780px);overflow:hidden}
.win img{width:100%;height:100%;object-fit:cover;filter:saturate(.92) contrast(1.02)}
.win::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(22,16,13,.35),transparent 30%,transparent 60%,rgba(22,16,13,.6))}
.win .wtxt{position:absolute;left:clamp(24px,5vw,44px);bottom:clamp(24px,4vw,40px);z-index:2}
.win .wtxt h2{font-family:var(--display);font-weight:300;font-style:italic;font-size:clamp(56px,11vw,140px);line-height:.9}
.win .wtxt .mono{opacity:.85;display:block;margin-top:14px}

/* cikk */
.article{padding:clamp(140px,18vw,190px) 0 clamp(80px,10vw,120px)}
.article .wrap{max-width:780px}
.article .back{font-family:var(--mono);font-size:11px;letter-spacing:.22em;color:var(--gold);text-decoration:none;opacity:.8}
.article h1{font-family:var(--display);font-weight:300;font-size:clamp(36px,6vw,68px);line-height:1.05;letter-spacing:-.01em;margin:26px 0 18px}
.article .meta{font-family:var(--mono);font-size:11px;letter-spacing:.22em;opacity:.5;text-transform:uppercase}
.article .cover{margin:44px 0;border-radius:4px;width:100%}
.prose p,.prose li{font-size:clamp(16px,1.9vw,18px);line-height:1.9;opacity:.86;max-width:62ch}
.prose p+p{margin-top:1.1em}
.prose .lede{font-family:var(--display);font-weight:300;font-size:clamp(22px,2.8vw,30px);line-height:1.45;opacity:1}
.prose h2{font-family:var(--display);font-weight:300;font-size:clamp(26px,3.4vw,36px);margin:2em 0 .6em}
.prose ul,.prose ol{padding-left:1.2em;margin:1em 0}
.prose a{color:var(--gold)}

/* kapcsolat + lábléc – a pontahol.hu-val azonos */
.follow{padding:clamp(120px,16vw,180px) 0 clamp(60px,10vw,80px);text-align:center}
.follow h2{font-family:var(--display);font-weight:300;font-size:clamp(38px,7vw,84px);letter-spacing:.01em;margin-bottom:18px;line-height:1.2}
.follow h2 em{font-style:normal;color:var(--gold)}
.followsub{max-width:44ch;margin:0 auto clamp(36px,5vw,52px);font-size:15px;opacity:.7;line-height:1.85}
.socials{display:flex;flex-direction:column;align-items:center;gap:clamp(4px,1.4vw,12px)}
.biglink{font-family:var(--display);font-weight:300;font-size:clamp(30px,6.5vw,54px);letter-spacing:.02em;color:var(--cream);text-decoration:none;opacity:.6;line-height:1.3;position:relative;transition:opacity .4s var(--ease),letter-spacing .4s var(--ease)}
.biglink:hover{opacity:1;letter-spacing:.05em;font-style:italic}
.biglink .ga{display:inline-block;font-size:.45em;color:var(--gold);margin-left:.4em;vertical-align:.5em;opacity:0;transform:translate(-8px,8px);transition:opacity .4s var(--ease),transform .4s var(--ease);font-style:normal}
.biglink:hover .ga{opacity:1;transform:none}
@media(hover:none){.biglink .ga{opacity:.8;transform:none}}
.bs-foot{border-top:1px solid rgba(246,240,228,.1);padding:46px 0;text-align:center;font-family:var(--mono);font-size:10px;letter-spacing:.2em;opacity:.4}
.bs-foot .brand .tag{display:inline-block;opacity:0;transform:translateX(-6px);color:var(--gold);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.bs-foot .brand:hover .tag{opacity:1;transform:none}
.bs-foot .brand .tag .dot{color:var(--cream);opacity:.4}

/* beúszás */
.rv{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv,.hero h1 .ch,.hero .tag{opacity:1!important;transform:none!important;filter:none!important}
  .manifesto .big em{-webkit-background-clip:initial;background-clip:initial;color:var(--red)}
}

/* ===== PONTAHOL HANGULAT ===== */
/* koordinátás betöltő függöny */
.curtain{position:fixed;inset:0;z-index:200;background:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;transition:opacity 1.1s ease}
.curtain.up{opacity:0;pointer-events:none}
.curtain .cf{font-family:var(--mono);font-size:11px;letter-spacing:.5em;color:var(--cream);opacity:.5;transition:color .4s,text-shadow .4s}
.curtain .cf.lock{color:var(--gold);opacity:1;text-shadow:0 0 18px rgba(232,162,60,.55)}
.curtain .cl{width:120px;height:1px;background:rgba(246,240,228,.12);overflow:hidden}
.curtain .cl i{display:block;width:40%;height:100%;background:var(--gold);animation:scan 1.4s ease-in-out infinite}
.curtain .cf.lock~.cl{opacity:0}
@keyframes scan{0%{transform:translateX(-100%)}100%{transform:translateX(350%)}}

/* naplementés ég a nyitóképen */
.hero.sky{background:var(--ink)}
.hero.sky>img{display:none}
.hero.sky::after{background:radial-gradient(ellipse 80% 70% at 50% 42%,transparent 55%,rgba(22,16,13,.45) 100%)}
#sky{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.grain{position:absolute;inset:0;z-index:1;opacity:.05;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.hero.sky .hero-inner{z-index:2}
.hero.sky .kicker{color:var(--cream);opacity:.7}
.hero.sky .tag{text-shadow:0 2px 20px rgba(22,16,13,.35)}

/* éjszakai égbolt-átmenetek a sötét szekciókon – mint a pontahol holdkeltés része */
section.dark.night{background:linear-gradient(to bottom,var(--ink) 0%,#0e0e1e 20%,#1c1424 70%,#28161e 100%)}
section.dark.dusk{background:linear-gradient(to bottom,var(--ink) 0%,#2a1418 55%,#3a1820 100%)}
section.dark{position:relative;overflow:hidden}
section.dark>.grain{z-index:0}
section.dark>.wrap{position:relative;z-index:1}
.stars{position:absolute;inset:0;pointer-events:none;z-index:0}
.stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:var(--cream);opacity:.15;animation:tw 4s ease-in-out infinite}
@keyframes tw{0%,100%{opacity:.08}50%{opacity:.5}}

/* fotó-ablak írógépes koordinátával – mint a pontahol videó-ablak */
.win.coord .wcoord{position:absolute;left:clamp(24px,5vw,44px);bottom:clamp(22px,4vw,38px);z-index:2;font-family:var(--mono);
  font-size:clamp(11px,1.8vw,13px);letter-spacing:.32em;color:var(--cream);opacity:.88;min-height:1.4em}
.win.coord .wcoord::after{content:"_";color:var(--gold);animation:caret 1s steps(1) infinite}
.win.coord .wcoord.done::after{opacity:0;animation:none}
@keyframes caret{0%,49%{opacity:1}50%,100%{opacity:0}}
.win img{opacity:0;filter:blur(14px) saturate(.94);transform:scale(1.04);transition:opacity 1.6s var(--ease),filter 1.6s var(--ease)}
.win.in img{opacity:1;filter:blur(0) saturate(.92) contrast(1.02)}
@media(prefers-reduced-motion:reduce){.win img{opacity:1!important;filter:none!important}}

/* krém blokkban is filmszemcse */
.manifesto{overflow:hidden}
.manifesto::before{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.manifesto .wrap{position:relative;z-index:1}

/* morzsamenü: ← PONTAHOL / BORANDSZODA – egyforma méretben */
.bs-nav .crumb{display:flex;align-items:center;gap:12px;white-space:nowrap}
.bs-nav .crumb .sep{opacity:.35}
.bs-nav .crumb .here{opacity:1}
@media(max-width:640px){.bs-nav .crumb{flex-direction:column;align-items:flex-start;gap:4px}.bs-nav .crumb .sep{display:none}}

/* ===== nyitókép: fotó háttér + a nap helyén a logó ===== */
.hero.photo{background-color:var(--ink);background-size:cover;background-position:center 55%}
.hero.photo::after{background:
  radial-gradient(ellipse 80% 70% at 50% 45%,transparent 40%,rgba(22,16,13,.55) 100%),
  linear-gradient(to bottom,rgba(22,16,13,.55) 0%,rgba(138,38,32,.22) 45%,rgba(226,150,76,.18) 70%,var(--ink) 100%)}
.hero.photo .grain{z-index:1}
.hero.photo .tag{text-shadow:0 2px 20px rgba(22,16,13,.5)}
.hero.photo h1{text-shadow:0 4px 40px rgba(22,16,13,.45)}
.sunlogo{position:relative;display:block;width:clamp(96px,11vw,140px);aspect-ratio:1;margin:clamp(40px,6vw,64px) auto 0;
  opacity:0;animation:fadeUp 1.2s 1.5s var(--ease) forwards}
.sunlogo::before{content:"";position:absolute;inset:-70%;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,226,160,.45),rgba(244,168,78,.18) 40%,transparent 68%)}
.sunlogo img{position:relative;width:100%;height:100%;border-radius:50%;background:var(--cream);padding:6px;object-fit:contain;
  box-shadow:0 0 0 1px rgba(246,240,228,.3),0 10px 40px rgba(22,16,13,.35);transition:transform .9s var(--ease)}
.sunlogo:hover img,.sunlogo.spin img{transform:rotate(360deg)}
.moment video{width:100%;height:100%;object-fit:cover;background:#241a16}
/* nyitókép: a fotón lévők szabadon, a felirat alul */
.hero.photo{align-items:flex-end;padding-bottom:clamp(64px,9vh,110px)}
.hero.photo::after{background:
  linear-gradient(to bottom,rgba(22,16,13,.55) 0%,rgba(22,16,13,.05) 22%,rgba(22,16,13,.05) 45%,rgba(22,16,13,.7) 72%,var(--ink) 100%),
  linear-gradient(to top,rgba(226,150,76,.16),transparent 60%)}
.hero.photo .sunlogo{width:clamp(72px,8vw,104px);margin:0 auto clamp(26px,3.5vw,40px);animation-delay:.2s}
.hero.photo .sunlogo::before{inset:-60%}
.hero.photo h1{font-size:clamp(32px,7.6vw,104px)}

/* ===== finomhangolás ===== */
/* fekete-fehér nyitókép: meleg tónus nélkül */
.hero.photo::after{background:linear-gradient(to bottom,rgba(22,16,13,.55) 0%,rgba(22,16,13,.05) 22%,rgba(22,16,13,.05) 45%,rgba(22,16,13,.72) 72%,var(--ink) 100%)}
/* logó: nincs napfény-derengés */
.sunlogo::before,.hero.photo .sunlogo::before{display:none}
/* 2. kép (krém blokk) – nagyobb, középre igazítva */
.manifesto .cols{grid-template-columns:1fr 1.3fr;align-items:center;gap:clamp(36px,6vw,90px)}
.manifesto .cols img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 45%}
/* 3. kép (Fröccspong) – nagyobb, a szöveggel egy vonalban */
.pong .wrap{grid-template-columns:1.15fr 1fr;align-items:center}
.pong img{max-width:none;width:100%;aspect-ratio:4/5;object-fit:cover}
@media(max-width:820px){.manifesto .cols,.pong .wrap{grid-template-columns:1fr}}
/* #Fröccsinfo indexképek – telefonon is */
.rthumb{filter:grayscale(1) contrast(1.05);transition:opacity .4s,filter .5s}
.row:hover .rthumb{filter:grayscale(0)}
@media(max-width:600px){.rthumb{display:block;width:64px}}
/* krém blokk: a bringás kép nagy, a képernyő jobb széléig ér */
.manifesto.split{padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);min-height:clamp(560px,82vh,860px)}
.manifesto.split .mtext{align-self:center;position:relative;z-index:1;
  padding:clamp(90px,12vw,140px) clamp(28px,4vw,64px) clamp(90px,12vw,140px) max(clamp(24px,5vw,40px),calc((100vw - 1080px)/2 + 40px))}
.manifesto.split .mimg{position:relative;overflow:hidden}
.manifesto.split .mimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;border-radius:0}
@media(max-width:820px){
  .manifesto.split{grid-template-columns:1fr;min-height:0}
  .manifesto.split .mtext{padding:90px clamp(24px,5vw,40px) 56px}
  .manifesto.split .mimg{height:clamp(300px,70vw,520px)}
}
/* Fröccspong: a pohár-kép az elválasztó vonalakig ér, tükörképe a krém blokknak */
.pong.split{padding:0;display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);min-height:clamp(560px,82vh,860px)}
.pong.split::after{left:75%}
.pong.split .pimg{position:relative;overflow:hidden}
.pong.split .pimg img{position:absolute;inset:0;width:100%;height:100%;max-width:none;aspect-ratio:auto;object-fit:cover;object-position:50% 50%;border:0;border-radius:0}
.pong.split .ptext{align-self:center;position:relative;z-index:1;
  padding:clamp(90px,12vw,140px) max(clamp(24px,5vw,40px),calc((100vw - 1080px)/2 + 40px)) clamp(90px,12vw,140px) clamp(28px,4vw,64px)}
@media(max-width:820px){
  .pong.split{grid-template-columns:1fr;min-height:0}
  .pong.split .pimg{height:clamp(320px,90vw,560px);order:2}
  .pong.split .ptext{padding:90px clamp(24px,5vw,40px) 56px}
}
.pong.split h2{font-size:clamp(38px,4.6vw,66px)}
.manifesto.split .big{font-size:clamp(34px,4.4vw,64px)}

/* ===== olvashatóság: vastagabb, szebben tördelt szöveg ===== */
body{font-weight:400}
p{text-wrap:pretty}
h1,h2,.ptitle,.rtitle{text-wrap:balance}
.manifesto p{color:#4a3f37;font-size:clamp(16px,1.35vw,18px);line-height:1.7;max-width:42ch}
.pong p{font-size:clamp(16px,1.3vw,17px);line-height:1.7;opacity:.92;max-width:40ch}
/* szélesebb szövegoszlop a képes blokkokban */
.manifesto.split{grid-template-columns:minmax(0,1.15fr) minmax(0,1.6fr)}
.manifesto.split .mtext{padding-left:clamp(28px,7vw,120px);padding-right:clamp(28px,4vw,72px)}
.pong.split{grid-template-columns:minmax(0,1.6fr) minmax(0,1.15fr)}
.pong.split .ptext{padding-right:clamp(28px,7vw,120px);padding-left:clamp(28px,4vw,72px)}

/* ===== #Fröccsinfo kártyák ===== */
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.4vw,32px)}
@media(max-width:960px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.pgrid{grid-template-columns:1fr}}
.pcard{display:flex;flex-direction:column;text-decoration:none;background:#1e1713;border:1px solid var(--line);border-radius:4px;overflow:hidden;transition:border-color .4s var(--ease),transform .5s var(--ease)}
.pcard:hover{border-color:rgba(232,162,60,.45);transform:translateY(-4px)}
.pimgw{display:block;aspect-ratio:16/10;overflow:hidden;background:#241a16}
.pimgw img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.pcard:hover .pimgw img{transform:scale(1.04)}
.pbody{display:flex;flex-direction:column;gap:12px;padding:22px 22px 24px;flex:1}
.pauth{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;opacity:.6;text-transform:uppercase}
.pauth img{width:26px;height:26px;border-radius:50%;background:var(--cream);object-fit:contain;padding:2px}
.ptitle{font-family:var(--display);font-weight:400;font-size:clamp(21px,1.8vw,25px);line-height:1.2;transition:color .4s}
.pcard:hover .ptitle{color:var(--gold)}
.pex{font-size:15px;line-height:1.65;opacity:.72;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pmore{margin-top:auto;padding-top:6px;font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--gold);opacity:.85;text-transform:uppercase}

/* ===== záró blokk: kép + szöveg, mint a régi #borandszoda ===== */
.closing{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);min-height:clamp(520px,72vh,760px);background:#1b1411}
.closing .cimg{position:relative;overflow:hidden}
.closing .cimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.closing .ctext{align-self:center;padding:clamp(70px,9vw,120px) clamp(28px,6vw,96px)}
.closing h2{font-family:var(--display);font-weight:400;font-size:clamp(36px,4vw,56px);line-height:1;margin-bottom:20px}
.closing .lead{font-family:var(--display);font-style:italic;font-size:clamp(20px,1.8vw,24px);color:var(--gold);margin-bottom:22px}
.closing p{font-size:clamp(15px,1.2vw,17px);line-height:1.7;opacity:.85;max-width:40ch}
.closing p+p{margin-top:1em}
@media(max-width:820px){.closing{grid-template-columns:1fr}.closing .cimg{height:clamp(300px,75vw,520px)}}

/* ===== nyitókép: felirat középen ===== */
.hero.photo.center{align-items:center;padding-bottom:90px}
.hero.photo.center::after{background:radial-gradient(ellipse 75% 60% at 50% 50%,rgba(22,16,13,.5),rgba(22,16,13,.28) 70%),
  linear-gradient(to bottom,rgba(22,16,13,.45) 0%,transparent 25%,transparent 75%,var(--ink) 100%)}

/* ===== képváltó ===== */
.slider{background:#1b1411}
.slider .slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.2s var(--ease)}
.slider .slide.on{opacity:1}
.slider .slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 7s linear}
.slider .slide.on img{transform:scale(1)}
.sctrl{position:absolute;left:0;right:0;bottom:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px clamp(18px,3vw,32px);background:linear-gradient(to top,rgba(22,16,13,.55),transparent)}
.sctrl button{background:none;border:0;color:var(--cream);cursor:pointer;font-family:var(--display);font-size:24px;line-height:1;padding:6px;opacity:.75;transition:opacity .3s,color .3s}
.sctrl button:hover{opacity:1;color:var(--gold)}
.sdots{display:flex;gap:10px}
.sctrl .sdot{width:26px;height:2px;padding:0;background:rgba(246,240,228,.4);font-size:0;opacity:1}
.sctrl .sdot.on{background:var(--gold)}
@media(prefers-reduced-motion:reduce){.slider .slide img{transform:none!important}}

/* ===== Fröccspong: szöveges sáv ===== */
.pong.band{text-align:center;padding:clamp(110px,15vw,170px) 0}
.pong.band .wrap{display:block}
.pong.band h2{font-size:clamp(40px,6.4vw,84px)}
.pong.band p{margin:24px auto 0;max-width:46ch}
.pong.band .cta{margin:34px 14px 0}
/* forgó logó a fröccs-sáv tetején */
.pong.band .sunlogo{width:clamp(80px,8vw,108px);margin:0 auto clamp(30px,4vw,44px);opacity:1;animation:none}
.pong.band h2{font-size:clamp(34px,5vw,64px);line-height:1.12;max-width:20ch;margin:0 auto}

/* ===== MOBIL – a végén, hogy minden korábbi szabályt felülírjon ===== */
@media(max-width:820px){
  .manifesto.split{grid-template-columns:1fr;min-height:0}
  .manifesto.split .mtext{padding:84px 24px 52px}
  .manifesto.split .mimg{height:clamp(340px,105vw,560px)}
  .manifesto.split .big{font-size:clamp(40px,11vw,56px)}
  .manifesto p{max-width:none}
  .hero.photo.center{background-position:40% 50%}
}
@media(max-width:640px){
  .bs-nav{align-items:center;padding:18px 20px;font-size:10px;letter-spacing:.16em}
  .bs-nav .crumb{flex-direction:row;gap:8px}
  .bs-nav .crumb .sep,.bs-nav .crumb .here{display:none}
  .bs-nav .links{max-width:none;gap:16px;flex-wrap:nowrap}
  .sctrl{padding:12px 14px;gap:8px}
  .sdots{gap:6px}
  .sctrl .sdot{width:16px}
  .sctrl button{font-size:20px}
  .hero{padding:110px 20px 80px}
  .hero h1{letter-spacing:.1em;padding-left:.1em}
  .hero .tag{font-size:19px;padding:0 6px}
  .pong.band{padding:96px 0}
  .pong.band h2{font-size:clamp(30px,8.6vw,40px)}
  .pong.band .cta{margin:26px 10px 0}
  .head{flex-wrap:wrap;align-items:baseline}
  .follow h2{font-size:clamp(32px,9vw,44px)}
  .biglink{font-size:clamp(28px,8vw,40px)}
  .article{padding-top:120px}
}
.nextstop{font-family:var(--mono);font-size:10px;letter-spacing:.3em;color:var(--gold);opacity:.55;margin-bottom:clamp(48px,7vw,72px)}
.nextstop #nextcoord{color:var(--cream);opacity:.9}
