/* Intent-specific layouts layered on top of the shared DeepSeek framework. */
.showcase { padding-top: 42px; }
.showcase-copy { max-width: 680px; margin-bottom: 32px; }
.showcase-copy h2 { margin: 12px 0; }
.showcase-copy p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.55; }

/* Presentations: an ordered slide deck. */
.slide-deck { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 14px; align-items: stretch; }
.slide-deck article { min-height: 250px; padding: 24px; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.slide-deck article:first-child { background: #28282b; color: #fff; }
.slide-deck b { color: var(--blue); font-size: 13px; font-weight: 500; }
.slide-deck h3 { max-width: 290px; margin: auto 0 22px; font-size: 22px; line-height: 1.25; }
.slide-deck article span { width: 45%; height: 4px; border-radius: 4px; background: var(--blue); }

/* Photo: asymmetric visual cards without remote stock assets. */
.page-foto .hero { grid-template-columns: .92fr 1.08fr; }
.page-foto .hero-copy { order: 2; }
.page-foto .prompt-card { order: 1; min-height: 330px; background: radial-gradient(circle at 22% 18%,#d9e4ff,transparent 34%),linear-gradient(145deg,#f8f9ff,#e8edfa); }
.visual-lab { display: grid; grid-template-columns: 1.15fr .85fr; grid-template-rows: 180px 180px; gap: 14px; }
.visual-card { position: relative; overflow: hidden; padding: 22px; display: flex; flex-direction: column; justify-content: space-between; border-radius: 12px; color: #fff; }
.visual-card::before { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg,transparent 35%,rgba(0,0,0,.62)); }
.visual-card > * { position: relative; z-index: 1; }
.visual-card span { font-size: 13px; opacity: .8; }
.visual-card h3 { max-width: 420px; margin: auto 0 0; font-size: 22px; line-height: 1.3; }
.visual-card-1 { grid-row: 1/3; background: radial-gradient(circle at 60% 32%,#ffd9c8 0 14%,transparent 34%),linear-gradient(145deg,#715f62,#1f252d); }
.visual-card-2 { background: radial-gradient(circle at 75% 20%,#99c7ff,transparent 34%),linear-gradient(135deg,#315a91,#172436); }
.visual-card-3 { background: radial-gradient(circle at 20% 30%,#ffe0a1,transparent 32%),linear-gradient(145deg,#8c6849,#2b2422); }

/* Text: editor workspace. */
.page-tekst .hero { grid-template-columns: 1fr; max-width: 970px; }
.page-tekst .hero-copy { max-width: 760px; }
.page-tekst .prompt-card { max-width: 760px; width: 100%; margin-left: auto; min-height: 190px; }
.text-workspace { overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 12px 34px #0000000b; }
.editor-bar { height: 54px; padding: 0 20px; display: flex; align-items: center; gap: 7px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 13px; }
.editor-bar i { width: 9px; height: 9px; border-radius: 50%; background: #dedee2; }
.editor-bar span { margin-left: 10px; }
.editor-body { min-height: 390px; display: grid; grid-template-columns: 220px 1fr; }
.editor-body aside { padding: 26px 20px; display: flex; flex-direction: column; gap: 17px; background: var(--soft); border-right: 1px solid var(--line); }
.editor-body aside span { color: var(--muted); font-size: 12px; text-transform: uppercase; }
.editor-body aside b { font-size: 14px; font-weight: 500; }
.editor-body article { padding: 38px; }
.editor-body article h2 { max-width: 560px; }
.editor-body article > p { max-width: 650px; color: var(--muted); font-size: 16px; line-height: 1.6; }
.editor-suggestions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.editor-suggestions span { padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font-size: 13px; }

/* Music: dark studio and a generated waveform. */
.page-pesni .hero { max-width: 1128px; margin-top: 42px; padding: 64px; min-height: 510px; background: #18181c; border: 1px solid #23232b; border-radius: 12px; }
.page-pesni .hero h1 { color: #f8f8f8; }
.page-pesni .hero-copy > p, .page-pesni .trust { color: #b0b0b5; }
.page-pesni .hero .button { background: #f8f8f8; color: #18181c; }
.page-pesni .hero .button:hover { background: var(--blue); color: #fff; }
.page-pesni .hero .text-link { color: #f8f8f8; }
.page-pesni .prompt-card { background: #202126; border-color: #303139; box-shadow: none; }
.page-pesni .prompt-label, .page-pesni .prompt-card p { color: #f0f0f2; }
.music-studio { padding: 44px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 60px; align-items:center; background: #18181c; border-radius: 12px; color: #fff; }
.studio-copy h2 { color: #fff; }
.studio-copy p { color: #b0b0b5; line-height: 1.6; }
.track-tags { display: flex; flex-direction: column; gap: 8px; margin-top: 24px; }
.track-tags span { padding: 10px 12px; border: 1px solid #303139; border-radius: 6px; color: #d8d8dd; font-size: 14px; }
.waveform { height: 220px; display: flex; align-items: center; gap: 5px; }
.waveform i { width: 100%; height: var(--bar); border-radius: 4px; background: linear-gradient(180deg,#6f91ff,#386fde); transform-origin: center; animation: wave-pulse 2.8s ease-in-out infinite alternate; animation-delay: calc(var(--bar) * -20ms); }
@keyframes wave-pulse { to { transform: scaleY(.68); opacity: .65; } }

/* Video: a true storyboard. */
.page-video .prompt-card { min-height: 290px; background: #202124; color: #fff; border-color: #2c2d32; }
.page-video .prompt-label, .page-video .prompt-card p { color: #f3f3f4; }
.storyboard { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.storyboard article { padding: 5px 5px 18px; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.storyboard article > div { aspect-ratio: 16/10; padding: 14px; display: flex; justify-content: space-between; align-items: flex-start; border-radius: 8px; color: #fff; background: linear-gradient(145deg,#454852,#1c1d22); }
.storyboard article:nth-child(2) > div { background: linear-gradient(145deg,#44628c,#1b2737); }
.storyboard article:nth-child(3) > div { background: linear-gradient(145deg,#7a6257,#28211f); }
.storyboard article div span { font-size: 12px; opacity: .75; }
.storyboard article div i { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: #ffffff1c; font-style: normal; }
.storyboard h3 { margin: 16px 14px 0; font-size: 17px; line-height: 1.4; }

/* Long-form, intent-focused content. */
.content-guide { padding-top: 52px; }
.guide-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.guide-grid article { padding: 30px; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.guide-grid article > span { color: var(--blue); font-size: 13px; }
.guide-grid article h2 { margin: 32px 0 12px; font-size: 24px; line-height: 1.25; }
.guide-grid article p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.7; }

@media (max-width: 900px) {
  .slide-deck, .storyboard { grid-template-columns: 1fr; }
  .slide-deck article { min-height: 180px; }
  .page-foto .hero { grid-template-columns: 1fr; }
  .page-foto .hero-copy { order: 1; }
  .page-foto .prompt-card { order: 2; min-height: 240px; }
  .visual-lab { grid-template-columns: 1fr 1fr; }
  .visual-card-1 { grid-column: 1/3; grid-row: auto; }
  .editor-body { grid-template-columns: 170px 1fr; }
  .music-studio { grid-template-columns: 1fr; gap: 30px; }
  .waveform { height: 150px; }
}
@media (max-width: 576px) {
  .showcase { padding-top: 28px; }
  .visual-lab, .guide-grid { grid-template-columns: 1fr; grid-template-rows: none; }
  .visual-card, .visual-card-1 { grid-column: auto; grid-row: auto; min-height: 190px; }
  .editor-body { grid-template-columns: 1fr; }
  .editor-body aside { display: none; }
  .editor-body article { padding: 26px 20px; }
  .page-pesni .hero { margin: 14px; padding: 42px 20px; }
  .music-studio { padding: 28px 20px; }
  .waveform { height: 110px; gap: 3px; }
  .storyboard article > div { aspect-ratio: 16/9; }
  .guide-grid article { padding: 24px 20px; }
}
@media (prefers-reduced-motion: reduce) { .waveform i { animation: none; } }
