/* === Claude Design Workshop Landing – claude-workshop.css === */
:root {
  --white: #ffffff;
  --bg: #ffffff;
  --fg: #1a1a1a;
  --gold: #96791c;
  --gold-bright: #c8a45e;
  --gold-light: #f5edda;
  --gold-glow: rgba(200,164,94,0.25);
  --gold-soft: rgba(150,121,28,0.08);
  --dark: #111111;
  --dark-gray: #2d2d2d;
  --mid-gray: #555;
  --light-gray: #888;
  --surface: #f8f8f8;
  --surface-warm: #faf7f2;
  --border: rgba(0,0,0,0.08);
  --border-gold: rgba(200,164,94,0.3);
  --font-heading: 'Space Grotesk', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-accent: 'Cormorant Garamond', serif;
  --font-mono: 'JetBrains Mono', monospace;
  --content-width: 1240px;
  --radius: 16px;
  --radius-sm: 10px;
  --radius-xs: 6px;
}

.cw-page *, .cw-page *::before, .cw-page *::after { box-sizing: border-box; margin: 0; padding: 0; }
.cw-page { font-family: var(--font-body); background: var(--bg); color: var(--fg); font-size: 17px; line-height: 1.65; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
.cw-page .container { max-width: var(--content-width); margin: 0 auto; padding: 0 32px; }
.cw-page section { padding: 120px 0; position: relative; }
.cw-page h1,.cw-page h2,.cw-page h3,.cw-page h4 { font-family: var(--font-heading); font-weight: 700; line-height: 1.08; color: var(--fg); }
.cw-page h1 { font-size: clamp(3.5rem, 2rem + 7vw, 7.5rem); letter-spacing: -0.04em; }
.cw-page h2 { font-size: clamp(2.2rem, 1.5rem + 3.5vw, 4rem); letter-spacing: -0.03em; }
.cw-page h3 { font-size: clamp(1.3rem, 1rem + 1vw, 1.8rem); letter-spacing: -0.01em; }
.cw-page .accent { font-family: var(--font-accent); font-style: italic; color: var(--gold); }
.cw-page .mono { font-family: var(--font-mono); }
.cw-page .gold { color: var(--gold); }
.cw-page .muted { color: var(--light-gray); }
.cw-page .text-center { text-align: center; }

/* PILL */
.cw-page .pill { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 13px; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; color: var(--gold); background: var(--gold-soft); border: 1px solid var(--gold-glow); padding: 8px 20px; border-radius: 100px; margin-bottom: 28px; }

/* BUTTONS */
.cw-page .btn { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-heading); font-weight: 600; font-size: 1.05rem; padding: 18px 36px; border-radius: 12px; text-decoration: none; transition: all 0.3s cubic-bezier(0.4,0,0.2,1); cursor: pointer; border: none; position: relative; overflow: hidden; }
.cw-page .btn-primary { background: linear-gradient(135deg, var(--gold) 0%, var(--gold-bright) 100%); color: var(--white); box-shadow: 0 4px 24px rgba(150,121,28,0.3); }
.cw-page .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 32px rgba(150,121,28,0.4); }
.cw-page .btn-dark { background: var(--dark); color: var(--white); box-shadow: 0 4px 24px rgba(0,0,0,0.15); }
.cw-page .btn-dark:hover { transform: translateY(-2px); box-shadow: 0 8px 32px rgba(0,0,0,0.25); }
.cw-page .btn-outline { background: transparent; color: var(--fg); border: 2px solid var(--border); }
.cw-page .btn-outline:hover { border-color: var(--gold); color: var(--gold); }
.cw-page .btn-lg { padding: 22px 48px; font-size: 1.15rem; border-radius: 14px; }

/* HERO */
.cw-page .hero { min-height: 100vh; display: flex; align-items: center; padding: 120px 0 80px; position: relative; background: var(--white); overflow: hidden; }
.cw-page .hero::before { content: ''; position: absolute; top: -300px; right: -200px; width: 900px; height: 900px; background: radial-gradient(circle, rgba(200,164,94,0.12) 0%, transparent 60%); pointer-events: none; }
.cw-page .hero::after { content: ''; position: absolute; bottom: -200px; left: -100px; width: 600px; height: 600px; background: radial-gradient(circle, rgba(150,121,28,0.06) 0%, transparent 60%); pointer-events: none; }

/* SPARKS */
.cw-page .hero-spark { position: absolute; pointer-events: none; z-index: 0; will-change: transform; transition: transform 0.1s linear; }
.cw-page .hero-spark svg { width: 100%; height: 100%; }
.cw-page .hero-spark--1 { width: 180px; height: 180px; top: 5%; right: 4%; opacity: 0.2; filter: blur(0px); }
.cw-page .hero-spark--2 { width: 100px; height: 100px; top: 18%; left: 3%; opacity: 0.15; filter: blur(1px); }
.cw-page .hero-spark--3 { width: 280px; height: 280px; bottom: 5%; right: 10%; opacity: 0.08; filter: blur(4px); }
.cw-page .hero-spark--4 { width: 70px; height: 70px; top: 50%; left: 10%; opacity: 0.22; filter: blur(0px); }
.cw-page .hero-spark--5 { width: 140px; height: 140px; bottom: 15%; left: 1%; opacity: 0.1; filter: blur(2px); }
.cw-page .hero-spark--6 { width: 220px; height: 220px; top: 2%; left: 30%; opacity: 0.06; filter: blur(5px); }
.cw-page .hero-spark--7 { width: 55px; height: 55px; bottom: 30%; right: 3%; opacity: 0.25; filter: blur(0px); }
.cw-page .hero-spark--8 { width: 120px; height: 120px; top: 65%; right: 30%; opacity: 0.1; filter: blur(2px); }
.cw-page .hero-spark--9 { width: 90px; height: 90px; top: 35%; right: 18%; opacity: 0.16; filter: blur(1px); }
.cw-page .hero-spark--10 { width: 160px; height: 160px; bottom: 25%; left: 25%; opacity: 0.07; filter: blur(3px); }
.cw-page .hero-spark--11 { width: 45px; height: 45px; top: 12%; left: 18%; opacity: 0.2; filter: blur(0px); }
.cw-page .hero-spark--12 { width: 200px; height: 200px; top: 42%; right: 1%; opacity: 0.05; filter: blur(6px); }

.cw-page .hero .container { position: relative; z-index: 1; }
.cw-page .hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; margin-top: 48px; }
.cw-page .hero-title { display: flex; align-items: flex-start; gap: clamp(16px,3vw,40px); margin-bottom: 32px; }
.cw-page .hero-title-top, .cw-page .hero-title-bottom { font-family: var(--font-heading); font-weight: 700; font-size: clamp(3rem,2rem + 6vw,7rem); line-height: 0.95; letter-spacing: -0.04em; }
.cw-page .hero-title-top { color: var(--fg); }
.cw-page .hero-title-bottom { background: linear-gradient(90deg, #e84855 0%, #f47a2e 18%, #f9c846 36%, #2eb872 54%, #2e8bd8 72%, #7b4fd4 88%, #c74bbe 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.cw-page .hero-subtitle { font-size: clamp(1.1rem,1rem + 0.5vw,1.35rem); color: var(--mid-gray); max-width: 520px; margin-bottom: 20px; line-height: 1.65; }
.cw-page .hero-bold { font-size: 1.05rem; color: var(--fg); max-width: 520px; margin-bottom: 40px; line-height: 1.7; font-weight: 500; }
.cw-page .hero-cta { display: flex; flex-wrap: wrap; gap: 16px; }
.cw-page .hero-meta { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 40px; }
.cw-page .hero-meta-tag { display: flex; align-items: center; gap: 8px; font-size: 0.92rem; color: var(--mid-gray); background: var(--surface); padding: 10px 18px; border-radius: 10px; border: 1px solid var(--border); white-space: nowrap; }
.cw-page .hero-meta-tag svg { width: 16px; height: 16px; color: var(--gold); flex-shrink: 0; }

/* HERO MOCKUP */
.cw-page .hero-mockup { position: relative; perspective: 1200px; }
.cw-page .mockup-claude-chat { background: var(--white); border-radius: 20px; box-shadow: 0 24px 80px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.04); overflow: hidden; transform: rotateY(-4deg) rotateX(2deg); transition: transform 0.6s ease; }
.cw-page .mockup-claude-chat:hover { transform: rotateY(0deg) rotateX(0deg); }
.cw-page .mockup-topbar { background: var(--surface-warm); padding: 14px 20px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--border); }
.cw-page .mockup-dots { display: flex; gap: 6px; }
.cw-page .mockup-dot { width: 10px; height: 10px; border-radius: 50%; }
.cw-page .mockup-dot:nth-child(1) { background: #ff5f57; }
.cw-page .mockup-dot:nth-child(2) { background: #febc2e; }
.cw-page .mockup-dot:nth-child(3) { background: #28c840; }
.cw-page .mockup-title { font-family: var(--font-heading); font-size: 13px; font-weight: 500; color: var(--mid-gray); margin-left: 8px; }
.cw-page .mockup-body { padding: 20px; min-height: 280px; background: linear-gradient(180deg, #faf7f2 0%, #ffffff 100%); }
.cw-page .chat-msg { display: flex; gap: 10px; margin-bottom: 14px; }
.cw-page .chat-avatar { width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; }
.cw-page .chat-avatar.user { background: var(--gold-light); color: var(--gold); }
.cw-page .chat-avatar.claude { background: linear-gradient(135deg, var(--gold) 0%, var(--gold-bright) 100%); color: var(--white); font-size: 11px; }
.cw-page .chat-bubble { background: var(--white); border: 1px solid var(--border); border-radius: 12px; padding: 10px 14px; font-size: 12px; line-height: 1.5; color: var(--fg); max-width: 85%; }
.cw-page .chat-bubble.claude-bubble { background: transparent; border: none; padding: 14px 0; }
.cw-page .chat-bubble code { font-family: var(--font-mono); font-size: 12px; background: var(--gold-soft); color: var(--gold); padding: 2px 6px; border-radius: 4px; }
.cw-page .floating-design { position: absolute; bottom: -10px; right: -20px; width: 200px; background: var(--white); border-radius: 16px; box-shadow: 0 16px 48px rgba(0,0,0,0.15); overflow: hidden; border: 1px solid rgba(0,0,0,0.06); transform: rotate(3deg); z-index: 2; }
.cw-page .floating-design-header { background: linear-gradient(135deg, var(--gold), var(--gold-bright)); padding: 12px 16px; display: flex; align-items: center; gap: 8px; }
.cw-page .floating-design-header span { font-family: var(--font-heading); font-size: 11px; font-weight: 600; color: var(--white); letter-spacing: 0.5px; text-transform: uppercase; }
.cw-page .floating-design-body { padding: 14px 16px; }
.cw-page .fd-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; font-size: 12px; color: var(--mid-gray); }
.cw-page .fd-row + .fd-row { border-top: 1px solid var(--border); }
.cw-page .fd-swatch { width: 18px; height: 18px; border-radius: 4px; border: 1px solid var(--border); }

/* HERO ANIMATIONS */
.cw-page .hero-mockup .chat-msg { opacity: 0; transform: translateX(60px); transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.4,0,0.2,1); }
.cw-page .hero-mockup .chat-msg:nth-child(2) { transition-delay: 0.25s; }
.cw-page .hero-mockup .chat-msg:nth-child(3) { transition-delay: 0.5s; }
.cw-page .hero-mockup.assembled .chat-msg { opacity: 1; transform: translateX(0); }
.cw-page .hero-mockup .floating-design { opacity: 0; transform: translate(30px,20px) scale(0.8); transition: all 0.7s cubic-bezier(0.34,1.56,0.64,1) 0.7s; }
.cw-page .hero-mockup.assembled .floating-design { opacity: 1; transform: translate(0,0) scale(1); }

/* COUNTDOWN */
.cw-page .countdown-section { padding: 100px 0 80px; text-align: center; background: linear-gradient(180deg, var(--surface) 0%, var(--white) 100%); }
.cw-page .countdown-header { max-width: 600px; margin: 0 auto 48px; text-align: center; }
.cw-page .countdown-header h2 { margin-top: 12px; }
.cw-page .countdown { display: flex; align-items: center; justify-content: center; gap: 12px; }
.cw-page .countdown-block { display: flex; flex-direction: column; align-items: center; }
.cw-page .countdown-num, .cw-page .countdown-sep { font-family: var(--font-heading); font-weight: 700; line-height: 1; background: linear-gradient(90deg, #e84855 0%, #f47a2e 15%, #f9c846 30%, #2eb872 50%, #2e8bd8 70%, #7b4fd4 85%, #c74bbe 100%); background-size: 700px 100%; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.cw-page .countdown-num { font-size: clamp(3rem,2rem + 5vw,5.5rem); padding: 20px 12px; min-width: 80px; text-align: center; }
.cw-page .countdown-block:nth-child(1) .countdown-num { background-position: 0px center; }
.cw-page .countdown-block:nth-child(2) .countdown-num { background-position: -170px center; }
.cw-page .countdown-block:nth-child(3) .countdown-num { background-position: -340px center; }
.cw-page .countdown-block:nth-child(4) .countdown-num { background-position: -510px center; }
.cw-page .countdown-sep { font-size: clamp(2rem,1.5rem + 3vw,3.5rem); margin-bottom: 28px; animation: cw-pulse-sep 2s ease-in-out infinite; }
@keyframes cw-pulse-sep { 0%,100% { opacity:1; } 50% { opacity:0.3; } }
.cw-page .countdown-num.flip { animation: cw-flipDown 0.6s ease-in-out; }
@keyframes cw-flipDown { 0% { transform: perspective(400px) rotateX(0deg); opacity:1; } 30% { transform: perspective(400px) rotateX(-90deg); opacity:0.5; } 60% { transform: perspective(400px) rotateX(-90deg); opacity:0.5; } 100% { transform: perspective(400px) rotateX(0deg); opacity:1; } }
.cw-page .countdown-unit { font-family: var(--font-mono); font-size: 12px; text-transform: uppercase; letter-spacing: 1.5px; color: var(--light-gray); -webkit-text-fill-color: var(--light-gray); margin-top: 10px; background: none !important; }
.cw-page .countdown-date { font-family: var(--font-mono); font-size: 0.9rem; color: var(--light-gray); margin-top: 28px; letter-spacing: 0.5px; }
.cw-page .countdown-done { font-family: var(--font-heading); font-size: 1.3rem; font-weight: 600; color: var(--gold); text-align: center; padding: 24px 40px; background: var(--gold-soft); border: 1px solid var(--gold-glow); border-radius: 16px; }

/* TRUST BAR */
.cw-page .trust-bar { padding: 40px 0; border-bottom: 1px solid var(--border); background: var(--white); }
.cw-page .trust-items { display: flex; justify-content: center; flex-wrap: wrap; gap: 20px 48px; }
.cw-page .trust-chip { display: flex; align-items: center; gap: 10px; font-family: var(--font-heading); font-size: 0.95rem; color: var(--mid-gray); }
.cw-page .trust-chip strong { font-size: 1.4rem; color: var(--fg); font-weight: 700; }

/* KINEK */
.cw-page .kinek-section { background: var(--surface); }
.cw-page .kinek-header { text-align: center; max-width: 720px; margin: 0 auto 64px; }
.cw-page .kinek-header p { color: var(--mid-gray); margin-top: 20px; font-size: 1.1rem; line-height: 1.7; }
.cw-page .kinek-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.cw-page .kinek-card { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); padding: 40px 32px; transition: all 0.3s ease; position: relative; overflow: hidden; text-align: center; }
.cw-page .kinek-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--gold), var(--gold-bright)); opacity: 0; transition: opacity 0.3s; }
.cw-page .kinek-card:hover { border-color: var(--gold-glow); box-shadow: 0 12px 40px rgba(0,0,0,0.06); transform: translateY(-4px); }
.cw-page .kinek-card:hover::before { opacity: 1; }
.cw-page .kinek-icon { width: 100px; height: 100px; border-radius: 24px; background: transparent; display: flex; align-items: center; justify-content: center; margin: 0 auto 24px; }
.cw-page .kinek-icon svg { width: 80px; height: 80px; stroke: url(#cw-rainbow-grad); }
.cw-page .kinek-card h3 { margin-bottom: 10px; font-size: 1.25rem; }
.cw-page .kinek-card p { color: var(--mid-gray); font-size: 0.95rem; line-height: 1.65; }

/* VIDEO */
.cw-page .video-section { background: var(--white); position: relative; overflow: hidden; }
.cw-page .video-spark { position: absolute; pointer-events: none; z-index: 0; }
.cw-page .video-spark svg { width: 100%; height: 100%; }
.cw-page .video-spark--1 { width:180px;height:180px;top:-5%;left:2%;opacity:0.15;filter:blur(1px); }
.cw-page .video-spark--2 { width:90px;height:90px;top:12%;right:4%;opacity:0.22;filter:blur(0px); }
.cw-page .video-spark--3 { width:260px;height:260px;bottom:-6%;right:-2%;opacity:0.06;filter:blur(5px); }
.cw-page .video-spark--4 { width:55px;height:55px;top:38%;left:5%;opacity:0.24;filter:blur(0px); }
.cw-page .video-spark--5 { width:140px;height:140px;bottom:8%;left:-1%;opacity:0.1;filter:blur(3px); }
.cw-page .video-spark--6 { width:70px;height:70px;top:6%;left:38%;opacity:0.18;filter:blur(0px); }
.cw-page .video-spark--7 { width:200px;height:200px;bottom:3%;right:18%;opacity:0.06;filter:blur(4px); }
.cw-page .video-spark--8 { width:50px;height:50px;top:55%;right:7%;opacity:0.2;filter:blur(0px); }
.cw-page .video-header { text-align: center; max-width: 700px; margin: 0 auto 48px; position: relative; z-index: 1; }
.cw-page .video-header p { color: var(--mid-gray); margin-top: 20px; font-size: 1.05rem; line-height: 1.7; }
.cw-page .video-wrapper { max-width: 800px; margin: 0 auto 56px; aspect-ratio: 16/9; border-radius: var(--radius); overflow: hidden; box-shadow: 0 16px 64px rgba(0,0,0,0.1); border: 1px solid var(--border); position: relative; z-index: 1; }
.cw-page .video-placeholder { width: 100%; height: 100%; background: linear-gradient(135deg, #faf7f2 0%, #f0ebe0 100%); display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; transition: all 0.3s; }
.cw-page .video-placeholder:hover .play-btn { transform: scale(1.1); }
.cw-page .play-btn { width: 80px; height: 80px; border-radius: 50%; background: linear-gradient(135deg, var(--gold), var(--gold-bright)); display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 32px rgba(150,121,28,0.35); transition: transform 0.3s; margin-bottom: 16px; }
.cw-page .play-btn svg { width: 32px; height: 32px; color: var(--white); margin-left: 4px; }
.cw-page .video-stats { display: flex; justify-content: center; gap: 64px; position: relative; z-index: 1; }
.cw-page .video-stat { text-align: center; }
.cw-page .video-stat-num { font-family: var(--font-heading); font-size: 2.5rem; font-weight: 700; background: linear-gradient(135deg, var(--gold), var(--gold-bright)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; display: block; line-height: 1.1; }
.cw-page .video-stat-label { font-size: 0.88rem; color: var(--light-gray); margin-top: 6px; }

/* WORKSHOPS */
.cw-page .workshops-section { background: var(--surface); overflow: hidden; }
.cw-page .ws-header { text-align: center; max-width: 700px; margin: 0 auto 80px; }
.cw-page .ws-header p { color: var(--mid-gray); margin-top: 20px; font-size: 1.05rem; line-height: 1.7; }
.cw-page .ws-card { display: grid; grid-template-columns: 1fr 1fr; gap: 0; background: var(--white); border-radius: 24px; overflow: hidden; border: 1px solid var(--border); box-shadow: 0 4px 24px rgba(0,0,0,0.04); margin-bottom: 40px; transition: all 0.4s ease; }
.cw-page .ws-card:hover { box-shadow: 0 16px 48px rgba(0,0,0,0.08); transform: translateY(-4px); }
.cw-page .ws-2, .cw-page .ws-4 { direction: rtl; }
.cw-page .ws-2 > *, .cw-page .ws-4 > * { direction: ltr; }
.cw-page .ws-mockup { padding: 48px; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; min-height: 420px; }
.cw-page .ws-1 .ws-mockup { background: linear-gradient(135deg,#f9f6f0 0%,#f0ebe0 100%); background-image: radial-gradient(circle,#d4c9b0 1px,transparent 1px),linear-gradient(135deg,#f9f6f0 0%,#f0ebe0 100%); background-size: 20px 20px,100% 100%; }
.cw-page .ws-2 .ws-mockup { background: linear-gradient(135deg,#111 0%,#1a1a2e 100%); background-image: radial-gradient(circle,#333 1px,transparent 1px),linear-gradient(135deg,#111 0%,#1a1a2e 100%); background-size: 20px 20px,100% 100%; }
.cw-page .ws-3 .ws-mockup { background: linear-gradient(135deg,#f0f4ff 0%,#e8ecf4 100%); background-image: radial-gradient(circle,#c5cde0 1px,transparent 1px),linear-gradient(135deg,#f0f4ff 0%,#e8ecf4 100%); background-size: 20px 20px,100% 100%; }
.cw-page .ws-4 .ws-mockup { background: linear-gradient(135deg,#faf7f2 0%,#f5edda 100%); background-image: radial-gradient(circle,#d4c9b0 1px,transparent 1px),linear-gradient(135deg,#faf7f2 0%,#f5edda 100%); background-size: 20px 20px,100% 100%; }
.cw-page .ws-content { padding: 56px 48px; display: flex; flex-direction: column; justify-content: center; }
.cw-page .ws-num { font-family: var(--font-accent); font-size: 5rem; line-height: 1; background: linear-gradient(135deg, var(--gold), var(--gold-bright)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin-bottom: 8px; }
.cw-page .ws-label { font-family: var(--font-mono); font-size: 11px; color: var(--gold); text-transform: uppercase; letter-spacing: 2px; margin-bottom: 16px; }
.cw-page .ws-content h3 { font-size: 1.6rem; margin-bottom: 6px; }
.cw-page .ws-subtitle { font-family: var(--font-accent); font-style: italic; color: var(--gold); font-size: 1.1rem; margin-bottom: 20px; }
.cw-page .ws-desc { color: var(--mid-gray); font-size: 0.95rem; line-height: 1.7; margin-bottom: 24px; }
.cw-page .ws-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.cw-page .ws-tag { font-family: var(--font-mono); font-size: 12px; padding: 6px 14px; border-radius: 8px; background: var(--gold-soft); color: var(--gold); border: 1px solid var(--gold-glow); }
.cw-page .ws-footer { display: flex; align-items: center; justify-content: space-between; padding-top: 20px; border-top: 1px solid var(--border); font-size: 0.88rem; color: var(--mid-gray); }
.cw-page .ws-footer strong { color: var(--fg); }
.cw-page .ws-deliverable-pill { display: inline-flex; align-items: center; gap: 8px; background: var(--dark); color: var(--white); font-family: var(--font-heading); font-size: 0.82rem; font-weight: 500; padding: 10px 20px; border-radius: 100px; margin-bottom: 24px; }
.cw-page .ws-deliverable-pill svg { width: 16px; height: 16px; }

/* WS MOCKUP COMPONENTS */
.cw-page .ui-claude-design { width: 100%; max-width: 380px; background: var(--white); border-radius: 16px; box-shadow: 0 12px 40px rgba(0,0,0,0.1); overflow: hidden; }
.cw-page .ui-topbar { display: flex; align-items: center; gap: 8px; padding: 10px 16px; background: #faf8f4; border-bottom: 1px solid var(--border); }
.cw-page .ui-topbar .dots { display: flex; gap: 5px; }
.cw-page .ui-topbar .dot { width: 8px; height: 8px; border-radius: 50%; }
.cw-page .ui-topbar .dot:nth-child(1) { background: #ff5f57; }
.cw-page .ui-topbar .dot:nth-child(2) { background: #febc2e; }
.cw-page .ui-topbar .dot:nth-child(3) { background: #28c840; }
.cw-page .ui-topbar .tab { font-size: 11px; font-family: var(--font-mono); color: var(--mid-gray); margin-left: auto; }
.cw-page .ui-design-body { display: grid; grid-template-columns: 1fr 140px; min-height: 240px; }
.cw-page .ui-canvas { padding: 20px; display: flex; align-items: center; justify-content: center; }
.cw-page .ui-canvas-card { width: 100%; height: 160px; background: linear-gradient(135deg, var(--gold-light), #e8d9b8); border-radius: 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; }
.cw-page .ui-canvas-card .title-bar { width: 60%; height: 8px; background: var(--gold); border-radius: 4px; opacity: 0.6; }
.cw-page .ui-canvas-card .text-lines { display: flex; flex-direction: column; gap: 4px; align-items: center; }
.cw-page .ui-canvas-card .text-line { height: 4px; background: rgba(150,121,28,0.3); border-radius: 2px; }
.cw-page .ui-canvas-card .mock-btn { width: 50px; height: 16px; background: var(--gold); border-radius: 4px; margin-top: 4px; }
.cw-page .ui-tweaks { background: #f8f6f2; border-left: 1px solid var(--border); padding: 14px 12px; }
.cw-page .ui-tweaks-title { font-family: var(--font-heading); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--mid-gray); margin-bottom: 12px; }
.cw-page .ui-tweak-row { display: flex; align-items: center; justify-content: space-between; padding: 6px 0; font-size: 10px; color: var(--mid-gray); }
.cw-page .ui-tweak-toggle { width: 28px; height: 14px; background: var(--gold); border-radius: 7px; position: relative; }
.cw-page .ui-tweak-toggle::after { content: ''; position: absolute; top: 2px; right: 2px; width: 10px; height: 10px; background: var(--white); border-radius: 50%; }
.cw-page .ui-tweak-color { display: flex; gap: 4px; }
.cw-page .ui-tweak-swatch { width: 12px; height: 12px; border-radius: 3px; border: 1px solid var(--border); }
.cw-page .ui-export-btn { margin-top: 12px; width: 100%; padding: 6px; background: var(--gold); color: var(--white); border: none; border-radius: 6px; font-size: 10px; font-family: var(--font-heading); font-weight: 600; text-align: center; }
.cw-page .ui-artifacts { width: 100%; max-width: 380px; border-radius: 16px; overflow: hidden; box-shadow: 0 12px 40px rgba(0,0,0,0.3); }
.cw-page .ui-artifacts .ui-topbar { background: #1e1e2e; border-color: rgba(255,255,255,0.06); }
.cw-page .ui-artifacts .ui-topbar .tab { color: rgba(255,255,255,0.4); }
.cw-page .ui-art-split { display: grid; grid-template-columns: 1fr 1fr; min-height: 260px; }
.cw-page .ui-code-panel { background: #1e1e2e; padding: 16px; font-family: var(--font-mono); font-size: 11px; line-height: 1.8; color: rgba(255,255,255,0.7); }
.cw-page .ui-code-panel .kw { color: #c678dd; }
.cw-page .ui-code-panel .str { color: #98c379; }
.cw-page .ui-code-panel .tag { color: #e06c75; }
.cw-page .ui-code-panel .attr { color: #d19a66; }
.cw-page .ui-code-panel .cmt { color: rgba(255,255,255,0.25); font-style: italic; }
.cw-page .ui-preview-panel { background: var(--white); padding: 20px; display: flex; align-items: center; justify-content: center; }
.cw-page .ui-preview-site { width: 100%; height: 100%; background: linear-gradient(180deg, var(--gold-light) 0%, var(--white) 60%); border-radius: 8px; border: 1px solid var(--border); padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.cw-page .ui-preview-site .nav-bar { display: flex; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.cw-page .ui-preview-site .nav-item { width: 24px; height: 4px; background: rgba(0,0,0,0.1); border-radius: 2px; }
.cw-page .ui-preview-site .hero-block { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
.cw-page .ui-preview-site .hero-block .h { width: 70%; height: 8px; background: var(--dark); border-radius: 4px; }
.cw-page .ui-preview-site .hero-block .sub { width: 50%; height: 4px; background: rgba(0,0,0,0.15); border-radius: 2px; }
.cw-page .ui-preview-site .hero-block .btn-mock { width: 40px; height: 14px; background: var(--gold); border-radius: 4px; margin-top: 4px; }
.cw-page .ui-figma { width: 100%; max-width: 380px; background: var(--white); border-radius: 16px; box-shadow: 0 12px 40px rgba(0,0,0,0.1); overflow: hidden; }
.cw-page .ui-figma-topbar { background: #2c2c2c; padding: 8px 16px; display: flex; align-items: center; gap: 12px; }
.cw-page .ui-figma-logo { width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; }
.cw-page .ui-figma-logo svg { width: 14px; height: 14px; }
.cw-page .ui-figma-tabs { display: flex; gap: 12px; font-size: 11px; color: rgba(255,255,255,0.5); font-family: var(--font-body); }
.cw-page .ui-figma-tabs .active { color: var(--white); }
.cw-page .ui-figma-body { display: grid; grid-template-columns: 140px 1fr; min-height: 240px; }
.cw-page .ui-figma-layers { background: #f5f5f5; border-right: 1px solid var(--border); padding: 12px; }
.cw-page .ui-figma-layer { display: flex; align-items: center; gap: 6px; padding: 4px 6px; font-size: 10px; color: var(--mid-gray); border-radius: 4px; margin-bottom: 2px; }
.cw-page .ui-figma-layer.selected { background: rgba(150,121,28,0.1); color: var(--gold); }
.cw-page .ui-figma-canvas { background: #e8e8e8; padding: 20px; display: flex; align-items: center; justify-content: center; position: relative; }
.cw-page .ui-figma-frame { width: 90%; height: 80%; background: var(--white); border-radius: 4px; border: 2px solid #0d99ff; padding: 12px; position: relative; }
.cw-page .ui-figma-frame::before { content: 'Desktop – 1440'; position: absolute; top: -20px; left: 0; font-size: 9px; color: #0d99ff; font-family: var(--font-mono); }
.cw-page .claude-badge-float { position: absolute; top: 12px; right: 12px; background: linear-gradient(135deg, var(--gold), var(--gold-bright)); color: var(--white); font-size: 9px; font-family: var(--font-mono); font-weight: 600; padding: 4px 10px; border-radius: 6px; letter-spacing: 0.5px; box-shadow: 0 4px 12px rgba(150,121,28,0.3); }
.cw-page .ui-make { width: 100%; max-width: 380px; background: var(--white); border-radius: 16px; box-shadow: 0 12px 40px rgba(0,0,0,0.1); overflow: hidden; padding: 32px; }
.cw-page .ui-make-flow { display: flex; align-items: center; justify-content: center; gap: 0; padding: 10px 0; }
.cw-page .ui-make-node-wrap { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.cw-page .ui-make-node { width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; box-shadow: 0 4px 12px rgba(0,0,0,0.12); transition: transform 0.2s; }
.cw-page .ui-make-node:hover { transform: scale(1.12); }
.cw-page .ui-make-node.webhook { background: #7b4fd4; }
.cw-page .ui-make-node.claude { background: linear-gradient(135deg, #f47a2e, #f9c846); }
.cw-page .ui-make-node.wp { background: #2e8bd8; }
.cw-page .ui-make-node.mail { background: #e84855; }
.cw-page .ui-make-node svg { width: 24px; height: 24px; color: var(--white); }
.cw-page .ui-make-node-label { font-size: 10px; font-family: var(--font-mono); color: var(--light-gray); letter-spacing: 0.3px; white-space: nowrap; }
.cw-page .ui-make-connector { width: 32px; height: 2px; background: linear-gradient(90deg,rgba(0,0,0,0.08),rgba(0,0,0,0.15)); position: relative; flex-shrink: 0; margin: 0 2px; align-self: center; margin-bottom: 18px; transform-origin: left; }
.cw-page .ui-make-connector::after { content: ''; position: absolute; right: -2px; top: -3px; width: 7px; height: 7px; border-right: 2px solid var(--mid-gray); border-top: 2px solid var(--mid-gray); transform: rotate(45deg); }
.cw-page .ui-make-label { text-align: center; margin-top: 16px; font-size: 11px; color: var(--mid-gray); font-family: var(--font-mono); background: var(--surface); padding: 6px 14px; border-radius: 6px; border: 1px solid var(--border); }

/* WS ASSEMBLY ANIMATIONS */
.cw-page .ws-1 .ui-topbar { opacity: 0; transform: translateY(-20px); transition: all 0.5s ease 0.1s; }
.cw-page .ws-1.assembled .ui-topbar { opacity: 1; transform: translateY(0); }
.cw-page .ws-1 .ui-canvas-card { opacity: 0; transform: scale(0.6) rotate(-5deg); transition: all 0.7s cubic-bezier(0.34,1.56,0.64,1) 0.3s; }
.cw-page .ws-1.assembled .ui-canvas-card { opacity: 1; transform: scale(1) rotate(0deg); }
.cw-page .ws-1 .ui-tweaks { opacity: 0; transform: translateX(40px); transition: all 0.6s cubic-bezier(0.4,0,0.2,1) 0.5s; }
.cw-page .ws-1.assembled .ui-tweaks { opacity: 1; transform: translateX(0); }
.cw-page .ws-1 .ui-export-btn { opacity: 0; transform: translateY(10px) scale(0.8); transition: all 0.4s cubic-bezier(0.34,1.56,0.64,1) 0.8s; }
.cw-page .ws-1.assembled .ui-export-btn { opacity: 1; transform: translateY(0) scale(1); }
.cw-page .ws-2 .ui-artifacts { opacity: 0; transform: perspective(600px) rotateY(-8deg) scale(0.9); transition: all 0.8s cubic-bezier(0.4,0,0.2,1) 0.15s; }
.cw-page .ws-2.assembled .ui-artifacts { opacity: 1; transform: perspective(600px) rotateY(0) scale(1); }
.cw-page .ws-2 .ui-code-panel { clip-path: inset(0 0 100% 0); transition: clip-path 1.2s cubic-bezier(0.4,0,0.2,1) 0.4s; }
.cw-page .ws-2.assembled .ui-code-panel { clip-path: inset(0 0 0% 0); }
.cw-page .ws-3 .ui-figma-layer { opacity: 0; transform: translateX(-30px); transition: all 0.4s ease; }
.cw-page .ws-3 .ui-figma-layer:nth-child(1) { transition-delay: 0.2s; }
.cw-page .ws-3 .ui-figma-layer:nth-child(2) { transition-delay: 0.35s; }
.cw-page .ws-3 .ui-figma-layer:nth-child(3) { transition-delay: 0.5s; }
.cw-page .ws-3 .ui-figma-layer:nth-child(4) { transition-delay: 0.65s; }
.cw-page .ws-3 .ui-figma-layer:nth-child(5) { transition-delay: 0.8s; }
.cw-page .ws-3.assembled .ui-figma-layer { opacity: 1; transform: translateX(0); }
.cw-page .ws-3 .ui-figma-frame { opacity: 0; transform: scale(0.7); border-color: transparent; transition: all 0.6s cubic-bezier(0.34,1.56,0.64,1) 0.4s; }
.cw-page .ws-3.assembled .ui-figma-frame { opacity: 1; transform: scale(1); border-color: #0d99ff; }
.cw-page .ws-4 .ui-make-node-wrap { opacity: 0; transform: scale(0) rotate(180deg); transition: all 0.5s cubic-bezier(0.34,1.56,0.64,1); }
.cw-page .ws-4 .ui-make-node-wrap:nth-child(1) { transition-delay: 0.15s; }
.cw-page .ws-4 .ui-make-node-wrap:nth-child(3) { transition-delay: 0.4s; }
.cw-page .ws-4 .ui-make-node-wrap:nth-child(5) { transition-delay: 0.65s; }
.cw-page .ws-4 .ui-make-node-wrap:nth-child(7) { transition-delay: 0.9s; }
.cw-page .ws-4.assembled .ui-make-node-wrap { opacity: 1; transform: scale(1) rotate(0deg); }
.cw-page .ws-4 .ui-make-connector { transform: scaleX(0); transform-origin: left; transition: transform 0.4s cubic-bezier(0.4,0,0.2,1); }
.cw-page .ws-4 .ui-make-connector:nth-child(2) { transition-delay: 0.3s; }
.cw-page .ws-4 .ui-make-connector:nth-child(4) { transition-delay: 0.55s; }
.cw-page .ws-4 .ui-make-connector:nth-child(6) { transition-delay: 0.8s; }
.cw-page .ws-4.assembled .ui-make-connector { transform: scaleX(1); }
.cw-page .ws-4 .ui-make-label { opacity: 0; transform: translateY(15px); transition: all 0.5s ease 1.1s; }
.cw-page .ws-4.assembled .ui-make-label { opacity: 1; transform: translateY(0); }

/* PRICING */
.cw-page .pricing-section { background: linear-gradient(180deg, var(--white) 0%, var(--surface) 100%); }
.cw-page .pricing-header { text-align: center; max-width: 700px; margin: 0 auto 64px; }
.cw-page .pricing-header p { color: var(--mid-gray); margin-top: 20px; font-size: 1.05rem; line-height: 1.7; }
.cw-page .pricing-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 32px; max-width: 860px; margin: 0 auto; }
.cw-page .price-card { background: var(--white); border: 1px solid var(--border); border-radius: 24px; padding: 48px 40px; position: relative; transition: all 0.3s ease; }
.cw-page .price-card:hover { box-shadow: 0 16px 48px rgba(0,0,0,0.08); }
.cw-page .price-card.featured { border: 2px solid var(--gold); box-shadow: 0 8px 40px rgba(150,121,28,0.12); }
.cw-page .price-badge { position: absolute; top: -14px; left: 50%; transform: translateX(-50%); background: linear-gradient(135deg, var(--gold), var(--gold-bright)); color: var(--white); font-family: var(--font-heading); font-size: 0.8rem; font-weight: 600; padding: 6px 24px; border-radius: 100px; white-space: nowrap; box-shadow: 0 4px 16px rgba(150,121,28,0.3); }
.cw-page .price-card h3 { margin-bottom: 8px; font-size: 1.5rem; }
.cw-page .price-desc { color: var(--mid-gray); font-size: 0.95rem; margin-bottom: 28px; }
.cw-page .price-amount { font-family: var(--font-heading); font-size: 3.5rem; font-weight: 700; color: var(--fg); line-height: 1.1; margin-bottom: 4px; }
.cw-page .price-amount .currency { font-size: 1.5rem; vertical-align: super; }
.cw-page .price-sub { font-size: 0.9rem; color: var(--mid-gray); margin-bottom: 4px; }
.cw-page .price-huf { font-size: 0.82rem; color: var(--light-gray); margin-bottom: 32px; }
.cw-page .price-features { list-style: none; margin-bottom: 32px; }
.cw-page .price-features li { padding: 10px 0; font-size: 0.95rem; display: flex; align-items: flex-start; gap: 12px; color: var(--fg); }
.cw-page .price-features li + li { border-top: 1px solid var(--border); }
.cw-page .price-check { width: 20px; height: 20px; color: var(--gold); flex-shrink: 0; margin-top: 1px; }
.cw-page .price-card .btn { width: 100%; justify-content: center; font-size: 1.05rem; padding: 18px; }
.cw-page .pricing-note { text-align: center; color: var(--light-gray); font-size: 0.88rem; margin-top: 40px; max-width: 700px; margin-left: auto; margin-right: auto; line-height: 1.7; }
.cw-page .pricing-note a { color: var(--gold); text-decoration: none; }

/* INSTRUCTOR */
.cw-page .instructor-section { background: var(--white); }
.cw-page .instructor-grid { display: grid; grid-template-columns: 280px 1fr; gap: 64px; align-items: center; }
.cw-page .instructor-photo-wrap { position: relative; }
.cw-page .instructor-photo { width: 280px; height: 280px; border-radius: 24px; object-fit: cover; box-shadow: 0 16px 48px rgba(0,0,0,0.1); }
.cw-page .instructor-photo-badge { position: absolute; bottom: -12px; right: -12px; background: linear-gradient(135deg, var(--gold), var(--gold-bright)); color: var(--white); font-family: var(--font-heading); font-size: 0.8rem; font-weight: 600; padding: 10px 20px; border-radius: 12px; box-shadow: 0 8px 24px rgba(150,121,28,0.3); }
.cw-page .instructor-info h2 { margin-bottom: 20px; }
.cw-page .instructor-info p { color: var(--mid-gray); font-size: 1rem; line-height: 1.7; margin-bottom: 12px; }
.cw-page .instructor-stats { display: flex; gap: 32px; margin-top: 32px; padding-top: 32px; border-top: 1px solid var(--border); }
.cw-page .instructor-stat { text-align: center; }
.cw-page .instructor-stat .num { font-family: var(--font-heading); font-size: 1.8rem; font-weight: 700; color: var(--fg); display: block; line-height: 1.2; }
.cw-page .instructor-stat .label { font-size: 0.82rem; color: var(--light-gray); margin-top: 2px; }

/* FAQ */
.cw-page .faq-section { background-image: radial-gradient(circle,#d5d5d5 1px,transparent 1px),linear-gradient(135deg, var(--surface) 0%,#f0f0f0 100%); background-size: 20px 20px,100% 100%; }
.cw-page .faq-header { text-align: center; max-width: 600px; margin: 0 auto 56px; }
.cw-page .faq-list { max-width: 760px; margin: 0 auto; }
.cw-page .faq-item { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 12px; overflow: hidden; transition: all 0.3s ease; }
.cw-page .faq-item:hover { border-color: var(--gold-glow); }
.cw-page .faq-q { font-family: var(--font-heading); font-weight: 600; font-size: 1.05rem; cursor: pointer; padding: 24px 32px; display: flex; justify-content: space-between; align-items: center; user-select: none; }
.cw-page .faq-q::after { content: '+'; font-size: 1.3rem; color: var(--gold); font-weight: 300; transition: transform 0.3s; }
.cw-page .faq-item.open .faq-q::after { transform: rotate(45deg); }
.cw-page .faq-a { color: var(--mid-gray); font-size: 0.95rem; line-height: 1.7; padding: 0 32px 24px; display: none; }
.cw-page .faq-item.open .faq-a { display: block; }

/* FINAL CTA */
.cw-page .cta-final { background: var(--dark); color: var(--white); text-align: center; padding: 120px 32px; position: relative; overflow: hidden; }
.cw-page .cta-final::before { content: ''; position: absolute; top: -200px; right: -200px; width: 600px; height: 600px; background: radial-gradient(circle,rgba(200,164,94,0.15) 0%,transparent 60%); pointer-events: none; }
.cw-page .cta-final h2 { color: var(--white); margin-bottom: 24px; }
.cw-page .cta-final .cta-sub { color: rgba(255,255,255,0.5); max-width: 600px; margin: 0 auto 12px; font-size: 1.05rem; line-height: 1.7; }
.cw-page .cta-final .cta-bold { color: rgba(255,255,255,0.85); max-width: 600px; margin: 0 auto 16px; font-size: 1.05rem; line-height: 1.7; }
.cw-page .cta-final .cta-strong { color: var(--white); max-width: 600px; margin: 0 auto 36px; font-size: 1.05rem; font-weight: 600; }
.cw-page .cta-urgency { font-family: var(--font-mono); font-size: 0.85rem; color: var(--gold-bright); margin-top: 20px; letter-spacing: 0.5px; }

/* CW FOOTER */
.cw-footer { padding: 48px 0; text-align: center; font-size: 0.88rem; color: var(--light-gray); background: var(--dark); border-top: 1px solid rgba(255,255,255,0.06); }
.cw-footer a { color: var(--gold-bright); text-decoration: none; }

/* ANIMATIONS */
@keyframes cw-fadeInUp { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }

/* RESPONSIVE */
@media (max-width: 900px) {
  .cw-page section { padding: 80px 0; }
  .cw-page .hero-grid { grid-template-columns: 1fr; gap: 48px; }
  .cw-page .hero-mockup { display: none; }
  .cw-page .kinek-grid { grid-template-columns: 1fr; }
  .cw-page .ws-card { grid-template-columns: 1fr; }
  .cw-page .ws-2, .cw-page .ws-4 { direction: ltr; }
  .cw-page .ws-mockup { min-height: 280px; }
  .cw-page .pricing-grid { grid-template-columns: 1fr; max-width: 440px; }
  .cw-page .instructor-grid { grid-template-columns: 1fr; text-align: center; justify-items: center; }
  .cw-page .instructor-stats { justify-content: center; }
  .cw-page .video-stats { gap: 32px; }
  .cw-page h1 { font-size: clamp(2.2rem,1.5rem + 4vw,3.5rem); }
  .cw-page h2 { font-size: clamp(1.8rem,1.2rem + 3vw,2.8rem); }
}
@media (max-width: 600px) {
  .cw-page .container { padding: 0 20px; }
  .cw-page .hero-meta { gap: 10px; }
  .cw-page .hero-meta-tag { font-size: 0.8rem; padding: 8px 12px; }
  .cw-page .hero-cta { flex-direction: column; }
  .cw-page .btn-lg { padding: 18px 32px; font-size: 1rem; }
  .cw-page .video-stats { flex-direction: column; gap: 24px; }
  .cw-page .ws-content { padding: 32px 24px; }
  .cw-page .ws-mockup { padding: 24px; }
  .cw-page .price-card { padding: 32px 24px; }
}

/* Extra fonts for this page */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap');

/* CONSENT CHECKBOXES */
.cw-page .cw-consents { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.cw-page .cw-consent-check { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.cw-page .cw-consent-check input.cw-cb { position: absolute; opacity: 0; width: 0; height: 0; }
.cw-page .cw-consent-box { width: 18px; height: 18px; min-width: 18px; border: 1.5px solid var(--border); border-radius: 4px; display: flex; align-items: center; justify-content: center; margin-top: 2px; transition: all 0.2s; background: var(--white); }
.cw-page .cw-consent-box svg { width: 11px; height: 11px; stroke: var(--white); stroke-width: 2.5; fill: none; opacity: 0; transition: opacity 0.2s; }
.cw-page .cw-consent-check input.cw-cb:checked + .cw-consent-box { background: var(--gold); border-color: var(--gold); }
.cw-page .cw-consent-check input.cw-cb:checked + .cw-consent-box svg { opacity: 1; }
.cw-page .cw-consent-text { font-size: 0.85rem; color: var(--mid-gray); line-height: 1.5; }
.cw-page .cw-consent-text a { color: var(--gold); text-decoration: underline; text-underline-offset: 2px; }
.cw-page .cw-consent-text a:hover { color: var(--gold-bright); }

/* Price card left alignment */
.cw-page .price-card h3,
.cw-page .price-card .price-desc,
.cw-page .price-card .price-amount,
.cw-page .price-card .price-sub,
.cw-page .price-card .price-huf,
.cw-page .price-features,
.cw-page .price-features li,
.cw-page .cw-consents { text-align: left; }

/* Bonus mini countdown */
.cw-page .cw-bonus-cd {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-left: 8px;
  vertical-align: middle;
}
.cw-page .cw-bonus-cd-block {
  display: inline-flex;
  align-items: baseline;
  gap: 1px;
  background: linear-gradient(135deg, var(--gold), var(--gold-bright));
  border-radius: 5px;
  padding: 2px 6px;
}
.cw-page .cw-bonus-cd-num {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--white);
  line-height: 1;
  min-width: 14px;
  text-align: center;
}
.cw-page .cw-bonus-cd-unit {
  font-family: var(--font-mono);
  font-size: 0.6rem;
  color: rgba(255,255,255,0.75);
  line-height: 1;
}
.cw-page .cw-bonus-cd-sep {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--gold);
  font-weight: 700;
  line-height: 1;
}
.cw-page .cw-bonus-cd-expired {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: var(--light-gray);
  margin-left: 6px;
  text-decoration: line-through;
}

/* Bonus label + countdown block layout */
.cw-page .cw-bonus-label {
  display: block;
  font-weight: 700;
  color: var(--fg);
  margin-bottom: 6px;
}
.cw-page .cw-bonus-cd {
  display: flex !important;
  margin-left: 0 !important;
  margin-bottom: 6px;
}

/* Bonus wrap – column stack */
.cw-page .cw-bonus-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.cw-page .cw-bonus-desc {
  display: block;
}

/* ===== MOBILE RESPONSIVE FIXES ===== */

/* 900px – tablet/large mobile */
@media (max-width: 900px) {
  /* Hero title: stack instead of side-by-side */
  .cw-page .hero-title { flex-direction: column; gap: 0; margin-bottom: 24px; }
  .cw-page .hero-title-top,
  .cw-page .hero-title-bottom { font-size: clamp(2.8rem,1.5rem + 7vw,4.5rem); }

  /* Hero meta: wrap tighter */
  .cw-page .hero-meta { justify-content: flex-start; }

  /* Kinek grid already 1 col, reduce section padding */
  .cw-page .kinek-header { margin-bottom: 40px; }

  /* WS content */
  .cw-page .ws-content { padding: 40px 32px; }
  .cw-page .ws-num { font-size: 3.5rem; }

  /* Instructor */
  .cw-page .instructor-photo { width: 220px; height: 220px; }
  .cw-page .instructor-stats { flex-wrap: wrap; gap: 20px 32px; }

  /* Countdown */
  .cw-page .countdown-num { font-size: clamp(2.2rem,1.5rem + 4vw,4rem); padding: 12px 8px; min-width: 60px; }
  .cw-page .countdown-sep { font-size: clamp(1.5rem,1rem + 2vw,2.5rem); }

  /* Trust bar */
  .cw-page .trust-items { gap: 16px 32px; }

  /* FAQ */
  .cw-page .faq-q { padding: 20px 24px; }
  .cw-page .faq-a { padding: 0 24px 20px; }

  /* Pricing grid – center single column */
  .cw-page .pricing-grid { margin: 0 auto; }

  /* CTA final */
  .cw-page .cta-final { padding: 80px 24px; }

  /* Video stats */
  .cw-page .video-stats { flex-wrap: wrap; justify-content: center; gap: 32px 48px; }
}

/* 600px – mobile */
@media (max-width: 600px) {
  /* Section padding */
  .cw-page section { padding: 64px 0; }
  .cw-page .hero { padding: 80px 0 60px; }

  /* Hero title smaller */
  .cw-page .hero-title-top,
  .cw-page .hero-title-bottom { font-size: clamp(2.4rem,1.2rem + 8vw,3.5rem); }

  /* Hero meta: vertical stack */
  .cw-page .hero-meta { flex-direction: column; align-items: flex-start; gap: 8px; }
  .cw-page .hero-meta-tag { width: 100%; }

  /* Countdown: tighter */
  .cw-page .countdown-num { font-size: clamp(1.8rem,1rem + 6vw,3rem); padding: 10px 6px; min-width: 44px; }
  .cw-page .countdown-sep { font-size: 1.5rem; margin-bottom: 20px; }
  .cw-page .countdown { gap: 6px; }

  /* Workshop cards */
  .cw-page .ws-content { padding: 28px 20px; }
  .cw-page .ws-mockup { padding: 20px; min-height: 220px; }
  .cw-page .ws-tags { gap: 6px; }
  .cw-page .ws-tag { font-size: 11px; padding: 5px 10px; }
  .cw-page .ws-footer { flex-direction: column; gap: 4px; align-items: flex-start; }

  /* Pricing */
  .cw-page .price-card { padding: 32px 20px; }
  .cw-page .price-amount { font-size: 2.5rem; }
  .cw-page .price-badge { font-size: 0.72rem; padding: 5px 16px; white-space: normal; text-align: center; }
  .cw-page .pricing-grid { max-width: 100%; padding: 0 4px; }

  /* Instructor */
  .cw-page .instructor-photo { width: 180px; height: 180px; }
  .cw-page .instructor-photo-badge { font-size: 0.72rem; padding: 8px 14px; right: -6px; bottom: -8px; }
  .cw-page .instructor-stats { gap: 16px 24px; }
  .cw-page .instructor-stat .num { font-size: 1.4rem; }

  /* FAQ */
  .cw-page .faq-q { padding: 16px 20px; font-size: 0.95rem; }
  .cw-page .faq-a { padding: 0 20px 16px; font-size: 0.9rem; }

  /* Trust bar */
  .cw-page .trust-items { gap: 12px 24px; }
  .cw-page .trust-chip { font-size: 0.88rem; }

  /* CTA final */
  .cw-page .cta-final { padding: 64px 20px; }

  /* Video stats */
  .cw-page .video-stats { flex-direction: column; gap: 20px; }
  .cw-page .video-stat-num { font-size: 2rem; }

  /* Kinek cards */
  .cw-page .kinek-card { padding: 28px 20px; }
  .cw-page .kinek-icon { width: 72px; height: 72px; }
  .cw-page .kinek-icon svg { width: 56px; height: 56px; }

  /* Pill */
  .cw-page .pill { font-size: 11px; padding: 6px 14px; }

  /* Bonus countdown */
  .cw-page .cw-bonus-cd-num { font-size: 0.72rem; }
}

/* 380px – very small phones */
@media (max-width: 380px) {
  .cw-page .hero-title-top,
  .cw-page .hero-title-bottom { font-size: 2.2rem; }
  .cw-page .countdown { gap: 4px; }
  .cw-page .countdown-num { min-width: 36px; padding: 8px 4px; font-size: 1.6rem; }
  .cw-page .countdown-sep { font-size: 1.2rem; }
}

/* Expired price card */
.cw-page .price-card.cw-card-expired {
  opacity: 0.4;
  filter: grayscale(0.85);
  pointer-events: none;
}
.cw-page .price-card.cw-card-expired .btn {
  opacity: 0.5;
}

/* Late arrival notice */
.cw-page .pricing-late-notice {
  text-align: center;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--fg);
  margin: 32px auto 12px;
  max-width: 600px;
}
.cw-page .pricing-late-notice a {
  color: var(--gold);
  text-decoration: underline;
}