:root{
  --bg:#0E1320; --bg2:#151C2C;
  --paper:#F4F0E6; --paper2:#ECE6D7;
  --tdark:#23282F; --tlight:#EDE9DD;
  --mut-d:#9FB0C8; --mut-l:#5A6271;
  --acc:#E4B04A; --acc2:#C8932F;
  --cta:#E4B04A; --cta-t:#1C1607; --cta-h:#EFBE5C;
  --hd:rgba(237,233,221,.14); --hl:rgba(35,40,47,.16);
  --live:#E0533D; --maxw:1120px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Albert Sans',system-ui,sans-serif;background:var(--bg);color:var(--tlight);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:'Spectral',Georgia,serif;font-weight:600;line-height:1.16}
a{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:3px}

.nav{position:sticky;top:0;z-index:50;background:rgba(14,19,32,.84);backdrop-filter:blur(12px);border-bottom:1px solid var(--hd)}
.nav-in{max-width:var(--maxw);margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:22px}
.brand{font-family:'Spectral',serif;font-weight:700;font-size:1.16rem;text-decoration:none}
.brand em,.brand-em{font-style:normal;color:var(--acc)}
.nav-links{display:flex;gap:22px;margin-left:auto;align-items:center}
.nav-links a{text-decoration:none;font-size:.92rem;color:var(--mut-d);font-weight:500;transition:color .15s}
.nav-links a:hover{color:var(--tlight)}
.btn{display:inline-block;text-decoration:none;font-weight:600;border-radius:10px;padding:12px 22px;font-size:.92rem;transition:all .2s;border:0;cursor:pointer;font-family:inherit;text-align:center}
.btn:active{transform:scale(.985)}
.btn-cta{background:var(--cta);color:var(--cta-t)}
.btn-cta:hover{background:var(--cta-h)}
.btn-hair{border:1px solid var(--hd);color:var(--tlight);background:transparent}
.btn-hair:hover{border-color:var(--acc)}
.btn-full{width:100%}
.nav .btn{padding:9px 16px;font-size:.84rem}

/* bannerul next-service (markup preluat din vechiul landing) */
.landing-next-service{display:flex;justify-content:center;gap:10px;align-items:center;padding:10px 16px;background:var(--bg2);border-bottom:1px solid var(--hd);color:var(--tlight);text-decoration:none;font-size:.9rem}
.landing-next-service:hover{background:#1A2234}
.landing-next-service[hidden]{display:none}

.eyebrow{font-family:'IBM Plex Mono',monospace;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--acc);margin-bottom:20px;display:flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--acc)}
.eyebrow-center{justify-content:center}
.smallcap{font-family:'IBM Plex Mono',monospace;font-size:.66rem;letter-spacing:.12em;text-transform:uppercase}

.hero{padding:96px 0 100px;position:relative;overflow:hidden;background:
  radial-gradient(1100px 520px at 78% -10%, rgba(228,176,74,.10), transparent 60%),
  radial-gradient(900px 600px at -10% 110%, rgba(159,176,200,.07), transparent 55%), var(--bg)}
.beam{position:absolute;top:-25%;height:150%;pointer-events:none;filter:blur(34px);
  background:linear-gradient(to bottom, rgba(228,176,74,.13), rgba(228,176,74,.03) 55%, transparent 75%)}
.beam-1{left:56%;width:200px;transform:rotate(17deg)}
.beam-2{left:74%;width:120px;transform:rotate(21deg);opacity:.7}
.beam-3{left:8%;width:90px;transform:rotate(14deg);opacity:.35}
#fx{position:absolute;inset:0;pointer-events:none}
.hero-in{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:0 24px;display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.hero h1{font-size:clamp(2.45rem,4.7vw,3.7rem);margin-bottom:21px}
.hero p.lead{font-size:1.11rem;color:var(--mut-d);max-width:31.5em;margin-bottom:34px}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap}
.hero-note{margin-top:22px;font-size:.86rem;color:var(--mut-d);opacity:.82}

.phone-stage{perspective:1300px;max-width:420px;margin-left:auto}
.phone{position:relative;background:#0A0E18;border:1px solid var(--hd);border-radius:26px;
  box-shadow:0 42px 90px rgba(0,0,0,.55), 0 8px 24px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;transform-style:preserve-3d;transition:transform .14s ease-out;will-change:transform}
.phone .glare{position:absolute;inset:0;border-radius:26px;pointer-events:none;z-index:3;
  background:linear-gradient(118deg, rgba(255,255,255,.09) 0%, rgba(255,255,255,.02) 28%, transparent 46%)}
.phone-bar{display:flex;align-items:center;gap:11px;padding:13px 18px;border-bottom:1px solid var(--hd);font-size:.76rem;color:var(--mut-d)}
.phone-langs{margin-left:auto}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--live);animation:pulse 1.6s infinite;box-shadow:0 0 11px rgba(224,83,61,.6)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.phone-body{padding:23px 20px 26px;min-height:286px;display:flex;flex-direction:column;gap:16px}
.src-line{font-size:1.02rem;color:var(--mut-d);font-style:italic;min-height:3.2em}
.src-line .caret{display:inline-block;width:2px;height:1.05em;background:var(--acc);vertical-align:-2px;margin-left:2px;animation:pulse 1s infinite}
.src-line.settled{color:var(--tlight);font-style:normal}
.tr-line{display:flex;gap:10px;align-items:baseline;opacity:0;transform:translateY(8px);transition:opacity .48s ease,transform .48s ease}
.tr-line.show{opacity:1;transform:none}
.tag{font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.14em;color:var(--acc);border:1px solid rgba(228,176,74,.45);border-radius:4px;padding:2px 7px;flex:none;text-transform:uppercase}
.tr-text{font-size:1.05rem;color:var(--tlight)}
.phone-foot{padding:10px 18px 16px;font-size:.73rem;color:var(--mut-d);border-top:1px solid var(--hd)}
@media (hover:none){
  .phone{animation:floaty 8s ease-in-out infinite}
  @keyframes floaty{0%,100%{transform:rotateY(-3.2deg) rotateX(1deg) translateY(0)}50%{transform:rotateY(3.2deg) rotateX(-1deg) translateY(-8px)}}
}

.facts{border-top:1px solid var(--hd);border-bottom:1px solid var(--hd);background:var(--bg2)}
.facts-in{max-width:var(--maxw);margin:0 auto;padding:23px 24px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fact{display:flex;gap:13px;align-items:baseline;font-size:.93rem;color:var(--mut-d)}
.fact b{color:var(--tlight);font-weight:600}
.idx{flex:none;font-family:'IBM Plex Mono',monospace;font-size:.74rem;letter-spacing:.12em;color:var(--acc)}

.light{background:var(--paper);color:var(--tdark)}
.section{padding:92px 0}
.sect-tight{padding-top:0}
.sec-head{max-width:650px;margin-bottom:54px}
.sec-head .eyebrow{color:var(--acc2)}
.sec-head .eyebrow::before{background:var(--acc2)}
.light h2{font-size:clamp(1.85rem,3.3vw,2.6rem);margin-bottom:14px;color:#1B2028}
.light p.sub{color:var(--mut-l);font-size:1.04rem}

.order{border-top:1px solid var(--hl)}
.order-row{display:grid;grid-template-columns:126px 280px 1fr;gap:28px;padding:31px 0;border-bottom:1px solid var(--hl);align-items:baseline}
.order-time{font-family:'IBM Plex Mono',monospace;font-size:.9rem;color:var(--acc2);letter-spacing:.05em}
.order-row h3{font-size:1.3rem}
.order-row p{color:var(--mut-l);font-size:.97rem}

.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;perspective:1000px}
.fcard{background:#FBF8F1;border:1px solid var(--hl);border-radius:14px;padding:27px 25px;position:relative;
  transform-style:preserve-3d;transition:transform .15s ease-out,box-shadow .28s;will-change:transform}
.fcard:hover{box-shadow:0 20px 42px rgba(35,40,47,.10)}
.fcard::before{content:"";position:absolute;top:0;left:25px;right:25px;height:2px;background:var(--acc);opacity:.85;border-radius:0 0 2px 2px}
.fcard h3{font-size:1.13rem;margin-bottom:8px}
.fcard p{font-size:.92rem;color:var(--mut-l)}

.modes{background:var(--bg)}
.modes h2{font-size:clamp(1.85rem,3.3vw,2.6rem);margin-bottom:14px}
.modes p.sub{color:var(--mut-d);font-size:1.04rem}
.mode-chips{display:flex;gap:10px;flex-wrap:wrap;margin:35px 0 22px}
.chip{border:1px solid var(--hd);background:var(--bg2);color:var(--mut-d);border-radius:999px;padding:9px 18px;font-size:.9rem;font-weight:500;cursor:pointer;font-family:inherit;transition:all .18s}
.chip:hover{color:var(--tlight)}
.chip.on{background:var(--cta);color:var(--cta-t);border-color:var(--cta);font-weight:600}
.mode-panel{background:var(--bg2);border:1px solid var(--hd);border-radius:16px;padding:31px;display:grid;grid-template-columns:1fr 1fr;gap:35px}
.mode-col .smallcap{display:block;margin-bottom:12px;color:var(--mut-d)}
.mode-src{color:var(--mut-d);font-style:italic;font-size:1rem}
.mode-out{font-size:1.05rem;min-height:4.6em}
.mode-desc{margin-top:18px;font-size:.88rem;color:var(--mut-d);grid-column:1/-1;border-top:1px solid var(--hd);padding-top:17px}

.song-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.song-sheet{background:#FBF8F1;border:1px solid var(--hl);border-radius:10px;padding:29px;font-size:.96rem;line-height:1.85;color:#3A4150;
  transform:rotate(-1.4deg);transition:transform .35s ease;
  box-shadow:0 22px 44px rgba(35,40,47,.11), 0 3px 8px rgba(35,40,47,.05), 0 1px 0 rgba(255,255,255,.8) inset}
.song-sheet:hover{transform:rotate(0deg) translateY(-3px)}
.label{font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:var(--acc2);letter-spacing:.1em;display:inline-block;background:rgba(228,176,74,.14);border-radius:5px;padding:1px 8px;margin:10px 0 2px}
.keys{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px}
.kbd{font-family:'IBM Plex Mono',monospace;font-size:.78rem;border-radius:7px;padding:6px 12px;color:#3A4150;cursor:default;user-select:none;
  background:linear-gradient(180deg,#FFFFFF,#F1ECDF);
  border:1px solid #D6CFBE;border-bottom:4px solid #C4BBA4;
  box-shadow:0 4px 8px rgba(35,40,47,.12), inset 0 1px 0 #fff;
  transition:transform .08s ease,border-bottom-width .08s ease,box-shadow .08s ease}
.kbd:hover{transform:translateY(3px);border-bottom-width:1px;box-shadow:0 1px 2px rgba(35,40,47,.12), inset 0 1px 0 #fff}
.song-copy h3{font-size:1.06rem;margin:23px 0 6px}
.song-copy p{color:var(--mut-l);font-size:.95rem}

.join{background:radial-gradient(800px 400px at 50% 0%, rgba(228,176,74,.08), transparent 60%), var(--bg2)}
.join-in{max-width:630px;margin:0 auto;text-align:center;padding:0 24px}
.join h2{font-size:clamp(1.95rem,3.5vw,2.7rem);margin-bottom:12px}
.join p{color:var(--mut-d);margin-bottom:31px}
.join-form{display:flex;gap:13px;justify-content:center}
.join-form[hidden]{display:none}
.join-input{font-family:'IBM Plex Mono',monospace;font-size:1.12rem;letter-spacing:.3em;text-transform:uppercase;text-align:center;background:var(--bg);border:1px solid var(--hd);color:var(--tlight);border-radius:10px;padding:13px 16px;width:244px}
.join-input::placeholder{letter-spacing:.15em;color:#5C6A80;font-size:.93rem}
.join-input:focus{border-color:var(--acc);outline:none}
.join-note{margin-top:19px;font-size:.86rem;color:var(--mut-d)}

.churches{background:var(--paper2);color:var(--tdark)}
.churches-in{display:grid;grid-template-columns:1.1fr .9fr;gap:58px;align-items:center}
.churches-h2{font-size:clamp(1.85rem,3.3vw,2.6rem);margin-bottom:10px}
.churches .sub{color:var(--mut-l)}
.checks{list-style:none;margin-top:23px;display:grid;gap:12px}
.checks li{display:flex;gap:12px;font-size:.97rem;color:#3A4150}
.checks li::before{content:"";flex:none;width:18px;height:18px;margin-top:3px;border-radius:50%;background:var(--acc);
  -webkit-mask:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="3.2" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>') center/100% no-repeat;
  mask:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="3.2" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>') center/100% no-repeat}
.churches .card{background:#fff;border:1px solid var(--hl);border-radius:14px;padding:35px;text-align:center;
  transform-style:preserve-3d;transition:transform .15s ease-out,box-shadow .28s;will-change:transform}
.churches .card:hover{box-shadow:0 24px 48px rgba(35,40,47,.12)}
.churches .card h3{font-size:1.32rem;margin-bottom:9px}
.churches .card p{color:var(--mut-l);font-size:.94rem;margin-bottom:23px}
.card-sub{margin-top:15px;font-size:.81rem;color:#8A92A0}
.card-link{color:var(--acc2)}

.footer{background:var(--bg);border-top:1px solid var(--hd);padding:35px 0;font-size:.84rem;color:var(--mut-d)}
.footer-in{max-width:var(--maxw);margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
.footer a{color:var(--mut-d);text-decoration:none}
.footer a:hover{color:var(--tlight)}

[data-reveal]{opacity:0;transform:translateY(19px);transition:opacity .65s ease,transform .65s ease}
[data-reveal].in{opacity:1;transform:none}

@media (prefers-reduced-motion: reduce){
  *{animation:none!important;transition:none!important}
  [data-reveal]{opacity:1;transform:none}
  .beam{display:none}
}
@media (max-width: 920px){
  .hero-in{grid-template-columns:1fr;gap:48px}
  .phone-stage{margin:0 auto}
  .facts-in{grid-template-columns:1fr;gap:10px}
  .features-grid{grid-template-columns:1fr 1fr}
  .order-row{grid-template-columns:1fr;gap:6px}
  .mode-panel{grid-template-columns:1fr}
  .song-grid,.churches-in{grid-template-columns:1fr;gap:36px}
  .nav-links{display:none}
}
@media (max-width: 560px){
  .features-grid{grid-template-columns:1fr}
  .join-form{flex-direction:column;align-items:center}
}