:root{
    --bg: #14121c;
    --bg-panel: #1e1b2a;
    --bg-panel-2: #241f33;
    --gold: #d9a441;
    --rust: #b8543a;
    --ink: #f3efe6;
    --muted: #9c97ac;
    --line: rgba(243,239,230,0.10);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:'Manrope', sans-serif;
    line-height:1.5;
    overflow-x:hidden;
  }
  h1,h2,h3{font-family:'Fraunces', serif; font-weight:600; letter-spacing:-0.01em;}
  body.lang-ka{font-family:'Noto Sans Georgian', sans-serif;}
  body.lang-ka h1, body.lang-ka h2, body.lang-ka h3, body.lang-ka .logo, body.lang-ka .step-num, body.lang-ka .amount{font-family:'Noto Serif Georgian', serif;}
  a{color:inherit;}
  .wrap{max-width:1080px; margin:0 auto; padding:0 24px;}
  .eyebrow{
    font-size:12px; letter-spacing:0.22em; text-transform:uppercase;
    color:var(--gold); font-weight:700; display:flex; align-items:center; gap:10px;
  }
  .eyebrow::before{content:""; width:22px; height:1px; background:var(--gold); display:inline-block;}

  /* ---------- NAV ---------- */
  nav{
    position:sticky; top:0; z-index:50;
    background:rgba(20,18,28,0.82); backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  nav .wrap{display:flex; align-items:center; justify-content:space-between; height:68px;}
  .logo{font-family:'Fraunces', serif; font-weight:600; font-size:27px; letter-spacing:0.01em;}
  .logo span{color:var(--gold);}
  .logo-block{display:flex; flex-direction:column; gap:3px;}
  .tagline{font-size:12px; color:var(--muted); letter-spacing:0.01em; font-family:'Manrope',sans-serif;}
  body.lang-ka .tagline{font-family:'Noto Sans Georgian', sans-serif;}
  .nav-cta{
    font-size:14px; font-weight:700; padding:10px 20px; border-radius:100px;
    background:var(--gold); color:#1a1508; text-decoration:none;
    transition:transform .15s ease, box-shadow .15s ease;
  }
  .nav-cta:hover{transform:translateY(-1px); box-shadow:0 6px 20px rgba(217,164,65,0.25);}
  .nav-right{display:flex; align-items:center; gap:18px;}
  .lang-switch{display:flex; gap:2px; background:var(--bg-panel); border:1px solid var(--line); border-radius:100px; padding:3px;}
  .lang-btn{
    border:none; background:transparent; color:var(--muted); font-size:12px; font-weight:700;
    letter-spacing:0.03em; padding:7px 11px; border-radius:100px; cursor:pointer; text-transform:uppercase;
    transition:background .15s ease, color .15s ease;
  }
  .lang-btn.active{background:var(--gold); color:#1a1508;}
  .lang-btn:not(.active):hover{color:var(--ink);}
  @media (max-width:560px){
    .nav-cta{display:none;}
    .lang-btn{padding:6px 8px; font-size:11px;}
  }


  /* ---------- STORY COVER RIBBON ---------- */
  .story-ribbon{padding:20px 0 10px;overflow:hidden;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.015),transparent)}
  .story-ribbon-track{display:flex;gap:16px;width:max-content;animation:storyRibbon 28s linear infinite;padding-left:16px}
  .story-ribbon:hover .story-ribbon-track{animation-play-state:paused}
  .story-ribbon-card{width:180px;flex:0 0 180px;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:0 14px 34px rgba(0,0,0,.28);cursor:pointer;position:relative;background:var(--bg-panel);transition:transform .2s ease,border-color .2s ease}
  .story-ribbon-card:hover{transform:translateY(-4px) scale(1.02);border-color:var(--gold)}
  .story-ribbon-card img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
  .story-ribbon-label{position:absolute;left:10px;right:10px;bottom:10px;padding:8px 10px;border-radius:10px;background:rgba(10,11,20,.76);backdrop-filter:blur(8px);color:#fff;font:700 13px 'Manrope',sans-serif;text-align:center}
  @keyframes storyRibbon{from{transform:translateX(0)}to{transform:translateX(-588px)}}
  @media(max-width:640px){.story-ribbon-card{width:140px;flex-basis:140px}.story-ribbon-track{gap:12px}@keyframes storyRibbon{from{transform:translateX(0)}to{transform:translateX(-456px)}}}

  /* ---------- HERO ---------- */
  .hero{padding:88px 0 64px; position:relative;}
  .hero-grid{display:grid; gap:28px;}
  .hero h1{
    font-size:clamp(34px, 6vw, 60px); line-height:1.06; margin:18px 0 20px;
    max-width:16ch;
  }
  .hero h1 em{font-style:italic; color:var(--gold);}
  .brand-manifesto{font-family:'Fraunces',serif;font-size:clamp(18px,2.4vw,27px);line-height:1.35;color:var(--ink);max-width:38ch;margin:18px 0 8px;}
  .hero p.lead{font-size:18px; color:var(--muted); max-width:46ch; margin-bottom:32px;}
  .hero-actions{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:56px;}
  .btn-primary{
    background:var(--gold); color:#1a1508; font-weight:700; font-size:15px;
    padding:15px 28px; border-radius:100px; text-decoration:none; border:none; cursor:pointer;
    transition:transform .15s ease, box-shadow .15s ease;
  }
  .btn-primary:hover{transform:translateY(-1px); box-shadow:0 8px 24px rgba(217,164,65,0.28);}
  .btn-ghost{
    border:1px solid var(--line); color:var(--ink); font-weight:600; font-size:15px;
    padding:15px 26px; border-radius:100px; text-decoration:none; background:transparent;
  }
  .btn-ghost:hover{border-color:rgba(243,239,230,0.3);}

  /* ambient waveform */
  #ambientWave{width:100%; height:120px; display:block; opacity:0.55;}

  /* ---------- SECTION LABELS ---------- */
  section{padding:76px 0;}
  .sec-head{margin-bottom:44px; max-width:60ch;}
  .sec-head h2{font-size:clamp(26px, 4vw, 38px); margin-top:14px;}
  .sec-head p{color:var(--muted); margin-top:12px; font-size:16px;}

  /* ---------- PORTFOLIO / PLAYER ---------- */
  .tracks{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
  }
  .track{
    background:var(--bg-panel);
    border:1px solid var(--line);
    border-radius:20px;
    padding:24px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    min-height:330px;
  }
  .play-btn{
    width:56px; height:56px; border-radius:50%; border:none; cursor:pointer;
    background:var(--gold); color:#1a1508; font-size:0; position:relative; flex-shrink:0;
    transition:transform .15s ease;
    margin-bottom:18px;
  }
  .play-btn:hover{transform:scale(1.06);}
  .play-btn::before{
    content:""; position:absolute; top:50%; left:50%; transform:translate(-42%,-50%);
    width:0; height:0; border-style:solid; border-width:9px 0 9px 15px;
    border-color:transparent transparent transparent #1a1508;
  }
  .play-btn.playing::before{
    width:14px; height:16px; border-style:solid; border-width:0;
    background:
      linear-gradient(#1a1508,#1a1508) 0 0/4px 16px no-repeat,
      linear-gradient(#1a1508,#1a1508) 10px 0/4px 16px no-repeat;
    border:none; transform:translate(-50%,-50%);
  }
  .track-body{min-width:0; width:100%; display:flex; flex-direction:column; flex:1;}
  .track-title{font-family:'Fraunces', serif; font-weight:600; font-size:19px; margin-bottom:8px;}
  .track-desc{color:var(--muted); font-size:14px; margin-bottom:16px; line-height:1.6;}
  .track canvas{width:100%; height:54px; display:block; margin-top:auto;}
  .track-time{font-size:12px; color:var(--muted); margin-top:8px; font-variant-numeric:tabular-nums;}
  .story-cover{width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px; margin-bottom:16px; display:block; border:1px solid var(--line);}
  .story-meta{display:flex; flex-wrap:wrap; gap:7px; margin:0 0 14px;}
  .story-meta span{font-size:11px; font-weight:700; letter-spacing:.02em; padding:6px 9px; border-radius:100px; background:var(--bg-panel-2); color:var(--muted); border:1px solid var(--line);}
  .listen-label{font-size:12px; color:var(--gold); font-weight:700; margin-top:9px;}
  @media (max-width:900px){.tracks{grid-template-columns:repeat(2,minmax(0,1fr));}}
  @media (max-width:640px){.tracks{grid-template-columns:1fr;}.track{min-height:0;}}

  /* ---------- STEPS ---------- */
  .steps{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:18px; overflow:hidden;}
  .step{background:var(--bg-panel); padding:24px 22px; display:block; min-height:170px;}
  .step-num{font-family:'Fraunces', serif; font-size:20px; color:var(--gold); font-weight:600; margin-bottom:12px;}
  .step h3{font-size:17px; margin-bottom:7px;}
  .step p{color:var(--muted); font-size:14px;}

  /* ---------- REVIEWS ---------- */
  .reviews-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
  .review-card{
    background:var(--bg-panel); border:1px solid var(--line); border-radius:18px; padding:26px;
  }
  .review-quote{font-family:'Fraunces', serif; font-size:16px; line-height:1.5; margin-bottom:16px; font-style:italic;}
  .review-author{font-size:13px; color:var(--gold); font-weight:700;}
  @media (max-width:780px){ .reviews-grid{grid-template-columns:1fr;} .steps{grid-template-columns:1fr;} .step{min-height:0;} }


  /* ---------- AUTHOR STORIES ---------- */
  .author-intro{max-width:72ch;}
  .author-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
  }
  .author-card{
    background:var(--bg-panel);
    border:1px solid var(--line);
    border-radius:20px;
    padding:24px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    min-height:360px;
  }
  .author-card .play-btn{margin-bottom:18px;}
  .author-card .track-body{width:100%; display:flex; flex-direction:column; flex:1;}
  .author-card .track-title{margin-top:0;}
  .author-card .track-desc{line-height:1.6; margin-bottom:16px;}
  .author-card canvas{margin-top:auto;}
  .author-signature{margin-top:30px; padding-top:24px; border-top:1px solid var(--line);}
  .author-signature strong{font-family:'Fraunces',serif; font-size:20px; color:var(--gold);}
  .author-signature p{color:var(--muted); margin-top:6px;}
  @media (max-width:980px){.author-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
  @media (max-width:640px){.author-grid{grid-template-columns:1fr;}.author-card{min-height:0;}}

  /* ---------- PRICING TIERS ---------- */
  .tiers-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
  .tier-card{
    background:var(--bg-panel); border:1px solid var(--line); border-radius:20px;
    padding:30px 26px; display:flex; flex-direction:column; position:relative;
    transition:border-color .15s ease, transform .15s ease;
  }
  .tier-card.featured{
    background:linear-gradient(165deg, var(--bg-panel-2), var(--bg-panel));
    border-color:rgba(217,164,65,0.4);
  }
  .tier-badge{
    position:absolute; top:-12px; left:26px; background:var(--gold); color:#1a1508;
    font-size:11px; font-weight:800; letter-spacing:0.05em; text-transform:uppercase;
    padding:5px 12px; border-radius:100px;
  }
  .tier-name{font-family:'Fraunces', serif; font-size:20px; font-weight:600; margin-bottom:6px;}
  .tier-price{font-family:'Fraunces', serif; font-size:34px; color:var(--gold); margin-bottom:2px;}
  .tier-price small{font-size:13px; color:var(--muted); font-family:'Manrope',sans-serif; font-weight:600;}
  .tier-features{list-style:none; color:var(--muted); font-size:14px; margin:20px 0 26px; display:grid; gap:10px; flex-grow:1;}
  .tier-features li{padding-left:20px; position:relative; line-height:1.4;}
  .tier-features li::before{content:"—"; position:absolute; left:0; color:var(--gold);}
  .tier-select{
    border:1px solid var(--line); background:transparent; color:var(--ink); font-weight:700; font-size:14px;
    padding:13px 20px; border-radius:100px; cursor:pointer; transition:all .15s ease;
  }
  .tier-select:hover{border-color:var(--gold);}
  .tier-card.selected{border-color:var(--gold); box-shadow:0 0 0 1px var(--gold);}
  .tier-card.selected .tier-select{background:var(--gold); color:#1a1508; border-color:var(--gold);}
  body.lang-ka .tier-name, body.lang-ka .tier-price{font-family:'Noto Serif Georgian', serif;}

  /* ---------- ORDER FORM ---------- */
  .order-box{background:var(--bg-panel); border:1px solid var(--line); border-radius:22px; padding:40px;}
  .order-summary{
    display:flex; gap:10px; flex-wrap:wrap; margin-bottom:28px; font-size:13px;
  }
  .order-pill{
    background:var(--bg-panel-2); border:1px solid var(--line); border-radius:100px;
    padding:8px 16px; color:var(--muted);
  }
  .order-pill strong{color:var(--gold); font-weight:700;}
  .field-label{font-size:13px; font-weight:700; color:var(--ink); margin-bottom:8px; display:block;}
  .field-group{margin-bottom:22px;}
  .style-chips{display:flex; flex-wrap:wrap; gap:9px;}
  .chip{
    border:1px solid var(--line); background:var(--bg-panel-2); color:var(--muted);
    font-size:13px; font-weight:600; padding:9px 16px; border-radius:100px; cursor:pointer;
    transition:all .15s ease;
  }
  .chip:hover{border-color:rgba(217,164,65,0.5); color:var(--ink);}
  .chip.selected{background:var(--gold); color:#1a1508; border-color:var(--gold);}
  input[type="text"], select, textarea{
    width:100%; background:var(--bg-panel-2); border:1px solid var(--line); color:var(--ink);
    font-family:'Manrope',sans-serif; font-size:15px; padding:14px 16px; border-radius:12px;
    outline:none; transition:border-color .15s ease;
  }
  body.lang-ka input[type="text"], body.lang-ka select, body.lang-ka textarea{font-family:'Noto Sans Georgian', sans-serif;}
  input[type="text"]:focus, select:focus, textarea:focus{border-color:var(--gold);}
  textarea{min-height:110px; resize:vertical;}
  select{appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%239c97ac'%3E%3Cpath d='M5.5 7.5l4.5 4.5 4.5-4.5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:40px;}
  .form-row{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
  .btn-generate{
    width:100%; background:var(--gold); color:#1a1508; font-weight:700; font-size:15px;
    padding:16px; border-radius:100px; border:none; cursor:pointer; margin-top:6px;
    transition:transform .15s ease;
  }
  .btn-generate:hover{transform:translateY(-1px);}
  .order-preview{
    display:none; margin-top:28px; padding-top:28px; border-top:1px solid var(--line);
  }
  .order-preview.visible{display:block;}
  .preview-text{
    background:var(--bg-panel-2); border:1px solid var(--line); border-radius:14px; padding:18px;
    font-size:14px; color:var(--ink); white-space:pre-wrap; line-height:1.6; margin-bottom:18px;
  }
  .send-actions{display:flex; gap:12px; flex-wrap:wrap;}
  .btn-wa{background:#25D366; color:#0a1a10;}
  .btn-copy{border:1px solid var(--line); background:transparent; color:var(--ink); font-weight:700; font-size:14px; padding:14px 22px; border-radius:100px; cursor:pointer;}
  .copied-note{font-size:12px; color:var(--gold); margin-top:10px; opacity:0; transition:opacity .2s ease;}
  .copied-note.show{opacity:1;}
  .golden-toggle{
    width:100%; text-align:left; background:transparent; border:1px dashed rgba(217,164,65,0.5);
    color:var(--gold); font-family:'Manrope',sans-serif; font-size:13px; font-weight:700;
    padding:14px 16px; border-radius:12px; cursor:pointer; transition:background .15s ease;
  }
  .golden-toggle:hover{background:rgba(217,164,65,0.08);}
  .golden-box{display:none; margin-top:16px; gap:14px;}
  .golden-box.open{display:grid;}
  .golden-q-label{font-size:13px; color:var(--muted); margin-bottom:6px; display:block; line-height:1.4;}
  .golden-box textarea{min-height:60px;}

  .mode-switch{display:flex; gap:8px; margin-bottom:14px; flex-wrap:wrap;}
  .mode-btn{
    border:1px solid var(--line); background:var(--bg-panel-2); color:var(--muted);
    font-family:'Manrope',sans-serif; font-size:13px; font-weight:700; padding:10px 18px;
    border-radius:100px; cursor:pointer; transition:all .15s ease;
  }
  .mode-btn.active{background:var(--gold); color:#1a1508; border-color:var(--gold);}
  .mode-hint{color:var(--muted); font-size:13px; margin-bottom:24px;}
  .field-hint{display:block; margin-top:8px; font-size:12px; color:var(--muted);}
  .checkbox-row{display:flex; align-items:center; gap:10px; font-size:14px; color:var(--ink); cursor:pointer;}
  .checkbox-row input{width:18px; height:18px; accent-color:var(--gold); cursor:pointer;}
  #orderOnlyFields.hidden{display:none;}

  #occasionGroup.hidden{display:none;}
  .conditional-field{display:none;}
  .conditional-field.visible{display:block;}
  .story-core{
    margin-top:26px;
    padding:24px;
    border:1px solid rgba(217,164,65,0.28);
    border-radius:18px;
    background:linear-gradient(160deg, rgba(217,164,65,0.08), rgba(255,255,255,0.015));
  }
  .story-core h3{font-size:22px; margin-bottom:8px;}
  .story-core p{color:var(--muted); font-size:14px; margin-bottom:16px;}
  .story-examples{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px;}
  .story-example{
    border:1px solid var(--line);
    background:var(--bg-panel-2);
    color:var(--muted);
    padding:9px 13px;
    border-radius:14px;
    cursor:pointer;
    font:600 12px 'Manrope',sans-serif;
    text-align:left;
  }
  .story-example:hover{border-color:var(--gold); color:var(--ink);}
  .story-example.custom{border-color:rgba(217,164,65,0.45); color:var(--gold);}


  /* ---------- CORPORATE ---------- */
  .corporate-box{
    background:linear-gradient(155deg, var(--bg-panel-2), var(--bg-panel));
    border:1px solid var(--line); border-radius:22px; padding:40px;
    display:grid; grid-template-columns:1fr auto; gap:30px; align-items:center;
  }
  .corp-text{color:var(--muted); margin:12px 0 22px; max-width:52ch;}
  .corp-controls{display:grid; grid-template-columns:1fr 1fr; gap:16px; max-width:420px; margin-bottom:18px;}
  .corp-total{font-family:'Fraunces', serif; font-size:24px; color:var(--gold);}
  body.lang-ka .corp-total{font-family:'Noto Serif Georgian', serif;}
  @media (max-width:780px){
    .corporate-box{grid-template-columns:1fr;}
    .corp-controls{grid-template-columns:1fr 1fr;}
  }

  @media (max-width:780px){
    .tiers-grid{grid-template-columns:1fr;}
    .form-row{grid-template-columns:1fr;}
    .order-box{padding:26px;}
  }

  /* ---------- CONTACT ---------- */
  .contact-box{
    background:var(--bg-panel); border:1px solid var(--line); border-radius:22px;
    padding:48px; text-align:center;
  }
  .contact-box h2{font-size:clamp(24px,4vw,34px); margin-bottom:14px;}
  .contact-box p{color:var(--muted); max-width:46ch; margin:0 auto 28px;}
  .contact-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}

  footer{border-top:1px solid var(--line); padding:32px 0; color:var(--muted); font-size:13px;}
  footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}

  @media (max-width:640px){
    .track{grid-template-columns:auto 1fr; padding:18px;}
    .author-card{grid-template-columns:1fr; padding:22px;}
    .author-card .play-btn{width:50px;height:50px;}
    .hero{padding-top:64px;}
  }

  #tracks .tracks{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
    align-items:stretch;
  }
  #tracks .track{
    display:flex;
    flex-direction:column;
    min-width:0;
    height:100%;
    overflow:hidden;
  }
  #tracks .story-cover{
    width:100%;
    aspect-ratio:1/1;
    height:auto;
    object-fit:cover;
    display:block;
    margin:0;
    border-radius:14px 14px 0 0;
  }
  #tracks .track-body{
    display:flex;
    flex-direction:column;
    flex:1;
    padding:18px;
  }
  #tracks .track-desc{
    min-height:96px;
  }
  #tracks .story-meta{
    margin-top:auto;
  }
  @media(max-width:900px){
    #tracks .tracks{grid-template-columns:repeat(2,minmax(0,1fr));}
  }
  @media(max-width:620px){
    #tracks .tracks{grid-template-columns:1fr;}
    #tracks .track-desc{min-height:0;}
  }



/* TuneWrap philosophy */
.philosophy-section{position:relative;padding:92px 0;background:linear-gradient(180deg,rgba(217,164,65,.045),rgba(184,84,58,.025));border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}
.philosophy-section:before{content:"“";position:absolute;left:50%;top:-78px;transform:translateX(-50%);font-family:'Fraunces',serif;font-size:260px;color:rgba(217,164,65,.055);line-height:1}
.philosophy-inner{position:relative;max-width:940px;margin:0 auto;text-align:center}
.philosophy-kicker{color:var(--gold);font-size:12px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;margin-bottom:24px}
.philosophy-quote{font-family:'Fraunces',serif;font-size:clamp(34px,5vw,62px);line-height:1.13;letter-spacing:-.025em;margin:0 auto 18px;max-width:900px}
.philosophy-credit{color:var(--gold);font-weight:700;margin-bottom:28px}
.philosophy-text{max-width:820px;margin:0 auto;color:var(--muted);font-size:clamp(16px,2vw,19px);line-height:1.8}
@media(max-width:620px){.philosophy-section{padding:68px 0}.philosophy-quote{font-size:34px}.philosophy-text{font-size:16px;line-height:1.7}}