:root {
  --ink: #1b1a22;
  --paper: #f7f4ee;
  --paper-deep: #ece5d8;
  --gold: #b78a42;
  --gold-light: #dfc48f;
  --violet: #302c46;
  --muted: #6d6874;
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "Mulish", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; }
.event-page { color: var(--ink); background: var(--paper); font-family: var(--sans); }

.draft-banner {
  position: relative; z-index: 20; padding: .62rem 1rem; text-align: center;
  color: #fff; background: #252231; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase;
}

.hero {
  min-height: min(780px, calc(100svh - 116px)); position: relative; isolation: isolate; overflow: hidden;
  display: grid; place-items: center; padding: clamp(3.5rem, 6vw, 5.75rem) 1.25rem 4rem;
  background: radial-gradient(circle at 50% 42%, #fffdf8 0, var(--paper) 47%, var(--paper-deep) 100%);
}
.hero-atmosphere { position: absolute; inset: 0 0 0 58%; z-index: -4; background: linear-gradient(90deg, var(--paper) 0, rgba(247,244,238,.72) 30%, rgba(247,244,238,.22) 100%), url("renginio-vizualas-originalas.png") center / cover no-repeat; opacity: .24; filter: saturate(.72); }
.hero::before { content: ""; position: absolute; inset: 5% 18%; z-index: -2; border: 1px solid rgba(183, 138, 66, .18); border-radius: 50%; transform: rotate(-8deg); }
.hero::after { content: ""; position: absolute; width: min(72vw, 850px); aspect-ratio: 1; z-index: -3; border: 1px solid rgba(48, 44, 70, .08); border-radius: 50%; }
.hero-content { width: min(920px, 100%); text-align: center; }
.eyebrow, .section-kicker { color: var(--gold); font-size: .72rem; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; }
.event-page h1 { margin: .42em 0 .32em; font-family: var(--serif); font-size: clamp(3.35rem, 8.7vw, 7.7rem); font-weight: 500; letter-spacing: -.045em; line-height: .82; text-wrap: balance; }
.subtitle { max-width: 760px; margin: 0 auto; color: #4c4651; font-family: var(--serif); font-size: clamp(1.38rem, 2.6vw, 2.05rem); font-style: italic; line-height: 1.2; text-wrap: balance; }
.event-quickfacts { margin: 1.8rem auto 0; display: flex; justify-content: center; gap: 0; color: #393440; }
.event-quickfacts > span { min-width: 150px; padding: 0 1.2rem; display: grid; border-right: 1px solid rgba(183,138,66,.28); }
.event-quickfacts > span:last-child { border-right: 0; }
.event-quickfacts strong { font-family: var(--serif); font-size: 1.05rem; font-weight: 600; }
.event-quickfacts small { margin-top: .18rem; color: var(--muted); font-size: .6rem; letter-spacing: .09em; text-transform: uppercase; }
.hero-actions { margin-top: 1.8rem; display: flex; flex-wrap: wrap; justify-content: center; gap: .8rem; }
.button { min-height: 48px; padding: 0 1.7rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }
.button-primary { color: #fff; background: var(--violet); box-shadow: 0 12px 28px rgba(37, 34, 49, .14); }
.button-outline { color: #514a55; border: 1px solid rgba(83,75,87,.22); background: rgba(255,255,255,.5); }
.button-muted { color: #756e77; border: 1px solid rgba(83, 75, 87, .22); background: rgba(255,255,255,.42); cursor: not-allowed; }
.orb { position: absolute; z-index: -1; border-radius: 50%; filter: blur(1px); opacity: .5; }
.orb-one { width: 155px; aspect-ratio: 1; left: 7%; top: 19%; background: radial-gradient(circle at 35% 30%, #f7e8bd, rgba(183,138,66,.05) 72%); }
.orb-two { width: 245px; aspect-ratio: 1; right: -65px; bottom: 8%; background: radial-gradient(circle at 35% 30%, rgba(107,94,141,.28), rgba(107,94,141,.02) 68%); }
.thought-lines { position: absolute; width: 350px; height: 350px; right: 7%; top: 10%; z-index: -1; opacity: .19; }
.thought-lines span { position: absolute; inset: calc(var(--i, 0) * 25px); border: 1px solid var(--gold); border-radius: 46% 54% 61% 39% / 52% 36% 64% 48%; transform: rotate(calc(var(--i, 0) * 19deg)); }
.thought-lines span:nth-child(2){--i:1}.thought-lines span:nth-child(3){--i:2}.thought-lines span:nth-child(4){--i:3}.thought-lines span:nth-child(5){--i:4}
.scroll-cue { position: absolute; bottom: 1.4rem; display: grid; justify-items: center; gap: .45rem; color: var(--muted); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; }
.scroll-cue span { width: 1px; height: 28px; background: var(--gold); }

.visual-story { padding: clamp(1rem, 2vw, 1.75rem) clamp(1rem, 4vw, 4rem) clamp(3rem, 6vw, 5rem); }
.visual-frame { overflow: hidden; border: 1px solid rgba(183,138,66,.24); background: #d9c7a7; box-shadow: 0 26px 70px rgba(41,33,27,.13); }
.visual-frame img { width: 100%; height: auto; display: block; }
.visual-caption { max-width: 820px; margin: clamp(1.75rem, 3vw, 3rem) auto 0; text-align: center; }
.visual-caption h2 { margin: .45em 0 .6em; font-family: var(--serif); font-size: clamp(2.25rem, 4.6vw, 4.2rem); font-weight: 500; line-height: 1; text-wrap: balance; }
.visual-caption > p:last-child { max-width: 720px; margin: 0 auto; color: var(--muted); line-height: 1.8; }

.intro { max-width: 930px; margin: 0 auto; padding: clamp(4rem, 7vw, 6.5rem) 1.5rem; text-align: center; }
.intro h2, .ticket-preview h2 { margin: .4em 0 .6em; font-family: var(--serif); font-size: clamp(2.4rem, 5vw, 4.5rem); font-weight: 500; line-height: 1; text-wrap: balance; }
.intro > p:last-child, .ticket-preview > p { max-width: 760px; margin-inline: auto; color: var(--muted); line-height: 1.85; }
.story-copy { max-width: 760px; margin: 2rem auto 0; color: var(--muted); font-size: 1rem; line-height: 1.9; }
.story-copy strong { color: var(--ink); font-family: var(--serif); font-size: 1.35rem; font-weight: 500; }

.experience { padding: clamp(4rem, 7vw, 6.5rem) clamp(1.25rem, 5vw, 5.5rem); background: #f0eadd; }
.section-heading { max-width: 840px; margin: 0 auto clamp(2.5rem, 5vw, 4.5rem); text-align: center; }
.section-heading h2, .takeaway h2, .host h2, .faq h2 { margin: .4em 0 .5em; font-family: var(--serif); font-size: clamp(2.5rem, 5vw, 4.7rem); font-weight: 500; line-height: 1; text-wrap: balance; }
.section-heading > p:last-child { max-width: 690px; margin: 0 auto; color: var(--muted); line-height: 1.8; }
.experience-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.placeholder-card { min-height: 235px; padding: 2rem; border: 1px solid rgba(183,138,66,.2); background: rgba(255,255,255,.45); }
.placeholder-card { grid-column: auto; }
.placeholder-card span { color: var(--gold); font-family: var(--serif); font-size: 1.4rem; }
.placeholder-card h3 { margin: 2.1rem 0 .7rem; font-family: var(--serif); font-size: 1.8rem; font-weight: 500; }
.placeholder-card p { color: var(--muted); font-size: .92rem; line-height: 1.7; }

.workbook { max-width: 1080px; margin: clamp(3.5rem, 7vw, 6rem) auto; padding: 0 1.5rem; display: grid; grid-template-columns: minmax(240px, .72fr) 1.28fr; gap: clamp(2rem, 6vw, 5rem); align-items: center; }
.workbook-motif { position: relative; min-height: 300px; overflow: hidden; border: 1px solid rgba(183,138,66,.28); border-radius: 3px 14px 14px 3px; background: repeating-linear-gradient(to bottom, transparent 0 34px, rgba(183,138,66,.14) 34px 35px), linear-gradient(115deg, #fffdf8, #efe5d3); box-shadow: 0 20px 55px rgba(55,44,35,.11); }
.workbook-motif::before { content: "Mintys  ·  Emocijos  ·  Reakcijos  ·  Pasirinkimai"; position: absolute; inset: 2.1rem; color: var(--ink); font-family: var(--serif); font-size: clamp(1.65rem, 2.5vw, 2.35rem); line-height: 1.3; }
.workbook-motif::after { content: ""; position: absolute; top: 0; bottom: 0; left: 2.7rem; width: 1px; background: rgba(185,95,75,.22); }
.workbook-motif span { position: absolute; right: 1.5rem; width: 8px; height: 8px; border: 1px solid var(--gold); border-radius: 50%; }
.workbook-motif span:nth-child(1) { bottom: 4rem; }.workbook-motif span:nth-child(2) { bottom: 2.7rem; }.workbook-motif span:nth-child(3) { bottom: 1.4rem; }
.workbook-copy h2 { margin: .35em 0 .45em; font-family: var(--serif); font-size: clamp(2.5rem, 5vw, 4.5rem); font-weight: 500; line-height: 1; }
.workbook-copy > p:not(.section-kicker) { color: var(--muted); line-height: 1.8; }

.takeaway { padding: clamp(4rem, 7vw, 6.5rem) clamp(1.25rem, 7vw, 8rem); display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 8vw, 8rem); align-items: start; background: #f2ece1; }
.takeaway-copy { padding-top: 1rem; color: var(--muted); line-height: 1.85; }
.takeaway blockquote { margin: 2rem 0 0; padding-left: 1.5rem; border-left: 2px solid var(--gold); color: var(--ink); font-family: var(--serif); font-size: clamp(1.5rem, 2.4vw, 2.1rem); font-style: italic; line-height: 1.25; }

.host { padding: clamp(4rem, 7vw, 6rem) 1.5rem; background: #fffdf8; }
.host-inner { width: min(1040px, 100%); margin: 0 auto; display: grid; grid-template-columns: minmax(250px, 360px) minmax(0, 1fr); gap: clamp(2.5rem, 6vw, 5.5rem); align-items: center; }
.host-portrait { aspect-ratio: 4 / 5; margin: 0; overflow: hidden; border: 1px solid rgba(183,138,66,.2); border-radius: 18px; background: var(--paper-deep); box-shadow: 0 22px 55px rgba(48,44,70,.16); }
.host-portrait img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center 22%; }
.host-copy { text-align: left; }
.host-copy > p:not(.section-kicker) { max-width: 650px; margin: .7rem 0; color: var(--muted); line-height: 1.8; }
.host .host-values { margin-top: 2rem; color: var(--ink); font-family: var(--serif); font-size: 1.45rem; font-style: italic; }

.ticket-preview { padding: clamp(4rem, 7vw, 6rem) 1.5rem; text-align: center; background: #272432; color: #f9f5ed; }
.ticket-preview > p { color: #c7c0c8; }
.ticket-preview .button { margin-top: 1.2rem; color: #cfc8d0; border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.04); }
.details-grid { width: min(940px, 100%); margin: 2.5rem auto 1.2rem; display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid rgba(255,255,255,.14); }
.details-grid > div { min-height: 130px; padding: 1.5rem; display: grid; place-content: center; border-right: 1px solid rgba(255,255,255,.14); }
.details-grid > div:last-child { border-right: 0; }
.details-grid small, .ticket-tiers small { color: var(--gold-light); letter-spacing: .12em; text-transform: uppercase; }
.details-grid strong { margin-top: .35rem; font-family: var(--serif); font-size: 1.5rem; font-weight: 500; }
.details-grid span { margin-top: .25rem; color: #bdb6bf; font-size: .8rem; }
.ticket-tiers { width: min(660px, 100%); margin: 1rem auto 2rem; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.ticket-tiers > div { position: relative; padding: 1.65rem 1.4rem 1.35rem; display: grid; border: 1px solid rgba(223,196,143,.35); }
.ticket-tier-early { background: rgba(223,196,143,.08); border-color: rgba(223,196,143,.62) !important; }
.ticket-badge { justify-self: center; margin: -2.55rem 0 1rem; padding: .42rem .8rem; border-radius: 999px; color: #272432; background: var(--gold-light); font-size: .58rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.ticket-badge-quiet { color: #ded7df; background: #3a3647; border: 1px solid rgba(255,255,255,.14); }
.ticket-tiers strong { margin-top: .3rem; font-family: var(--serif); font-size: 2.25rem; font-weight: 500; }
.ticket-tiers p { margin: .55rem 0 0; color: #aaa3ac; font-size: .72rem; line-height: 1.55; }
.draft-note { margin-top: 1rem; display: block; color: #928b95; letter-spacing: .08em; text-transform: uppercase; }

.faq { max-width: 920px; margin: 0 auto; padding: clamp(4rem, 7vw, 6rem) 1.5rem; }
.faq > .section-kicker, .faq > h2 { text-align: center; }
.faq details { padding: 1.35rem 0; border-bottom: 1px solid rgba(183,138,66,.22); }
.faq summary { cursor: pointer; font-family: var(--serif); font-size: 1.45rem; font-weight: 500; }
.faq details p { max-width: 750px; color: var(--muted); line-height: 1.75; }
@media (max-width: 760px) {
  .draft-banner { padding-block: .5rem; font-size: .66rem; }
  .hero { min-height: auto; padding: 3rem 1.1rem 3.25rem; }
  .hero-atmosphere { inset: 0; background: linear-gradient(180deg, rgba(247,244,238,.9), rgba(247,244,238,.68)), url("renginio-vizualas-originalas.png") center / cover no-repeat; opacity: .18; }
  .hero::before { inset: 9% -23%; }
  .event-page h1 { margin-top: .32em; font-size: clamp(3rem, 15vw, 4.3rem); line-height: .86; }
  .subtitle { max-width: 22ch; font-size: clamp(1.3rem, 5.8vw, 1.65rem); line-height: 1.2; }
  .event-quickfacts { margin-top: 1.4rem; }
  .event-quickfacts > span { min-width: 0; padding: 0 .55rem; }
  .event-quickfacts strong { font-size: .92rem; }
  .event-quickfacts small { font-size: .53rem; line-height: 1.35; }
  .hero-actions { align-items: stretch; flex-direction: column; width: min(310px, 100%); margin: 1.35rem auto 0; }
  .thought-lines { width: 210px; height: 210px; right: -65px; top: 9%; }
  .orb-one { left: -55px; top: 28%; }
  .scroll-cue { display: none; }
  .visual-story { padding: .75rem 0 3.25rem; }
  .visual-frame { border-left: 0; border-right: 0; }
  .visual-frame img { width: 100%; }
  .visual-caption { margin-top: 1.75rem; padding-inline: 1.25rem; }
  .visual-caption h2 { font-size: 2.4rem; }
  .intro, .experience, .takeaway, .host, .ticket-preview, .faq { padding-top: 3.5rem; padding-bottom: 3.5rem; }
  .story-copy { line-height: 1.78; }
  .experience-grid { grid-template-columns: 1fr; }
  .placeholder-card { min-height: 0; padding: 1.55rem; }
  .placeholder-card h3 { margin-top: 1.1rem; }
  .workbook { margin: 3.5rem auto; grid-template-columns: 1fr; gap: 1.75rem; }
  .workbook-motif { min-height: 220px; }
  .workbook-motif::before { inset: 1.7rem; padding-left: 1.2rem; font-size: 1.75rem; }
  .takeaway { grid-template-columns: 1fr; }
  .host-inner { grid-template-columns: 1fr; gap: 2rem; }
  .host-portrait { width: min(310px, 86vw); margin-inline: auto; aspect-ratio: 4 / 5; border-radius: 14px; }
  .host-copy { text-align: center; }
  .host-copy > p:not(.section-kicker) { margin-inline: auto; }
  .details-grid, .ticket-tiers { grid-template-columns: 1fr; }
  .details-grid > div { min-height: 110px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.14); }
  .details-grid > div:last-child { border-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
