/* Landing page styles (only loaded by layouts/landing.php). Uses the tokens from app.css. */
/* ---------- landing page ---------- */
.lp{background:var(--bg)}
.lp-nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 1.1rem;background:linear-gradient(180deg,rgba(10,8,6,.9),rgba(10,8,6,0))}
.lp-nav .links{display:none;gap:1.4rem;align-items:center}
.lp-nav .links a{color:#e8dcc7;text-decoration:none;font-weight:600;font-size:.95rem}
.lp-nav .links a:hover{color:var(--gold)}
.lp-nav .cta{display:flex;gap:.5rem;align-items:center}
.lp-nav .button{min-height:2.4rem;padding:.3rem 1rem;font-size:.92rem}
@media (min-width:860px){.lp-nav .links{display:flex}}
.lp-hero{position:relative;min-height:min(92vh,56rem);display:flex;align-items:center;overflow:hidden;background:#120d0a}
.lp-hero .art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 40%}
.lp-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(9,7,5,.94) 0%,rgba(9,7,5,.7) 40%,rgba(9,7,5,.15) 100%),linear-gradient(0deg,var(--bg) 0%,transparent 28%)}
.lp-hero .embers{position:absolute;inset:0;z-index:1;pointer-events:none;background-image:radial-gradient(2px 2px at 12% 80%,#f8a14d,transparent),radial-gradient(2px 2px at 28% 60%,#f8a14d,transparent),radial-gradient(1.5px 1.5px at 44% 85%,#ffc66d,transparent),radial-gradient(2px 2px at 63% 70%,#f8a14d,transparent),radial-gradient(1.5px 1.5px at 78% 55%,#ffc66d,transparent),radial-gradient(2px 2px at 90% 82%,#f8a14d,transparent),radial-gradient(1.5px 1.5px at 6% 40%,#ffc66d,transparent),radial-gradient(2px 2px at 55% 35%,#f8a14d,transparent);animation:drift 14s linear infinite}
@keyframes drift{from{transform:translateY(0)}to{transform:translateY(-40px)}}
.lp-hero-inner{position:relative;z-index:2;width:100%;max-width:72rem;margin:0 auto;padding:6.5rem 1.2rem 4rem}
.lp-eyebrow{display:inline-flex;gap:.4rem;align-items:center;color:var(--gold);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.78rem}
.lp h1.lp-title{font-size:clamp(2.1rem,6.4vw,3.9rem);line-height:1.08;margin:.5rem 0 1rem;max-width:50rem;text-wrap:balance;text-shadow:0 4px 30px rgba(0,0,0,.7)}
.lp-title em{font-style:normal;color:var(--accent)}
.lp-sub{font-size:clamp(1.05rem,2.4vw,1.3rem);color:#e0d3bd;max-width:34rem}
.lp-cta{display:flex;gap:.8rem;flex-wrap:wrap;margin:1.6rem 0 1.2rem}
.lp-trust{display:flex;gap:1.4rem;flex-wrap:wrap;color:#cbbda6;font-size:.9rem}
.lp-trust span{display:inline-flex;gap:.4rem;align-items:center}
.lp-trust .i{color:var(--ok)}
.lp-sec{padding:4rem 1.2rem;position:relative}
.lp-inner{max-width:72rem;margin:0 auto}
.lp-sec h2{display:block;font-size:clamp(1.7rem,4.5vw,2.6rem);text-align:center;margin:.3rem 0 .6rem}
.lp-sec .kicker{text-align:center;display:block;color:var(--gold);letter-spacing:.14em;text-transform:uppercase;font-weight:700;font-size:.78rem}
.lp-sec .sub{text-align:center;color:var(--muted);max-width:40rem;margin:0 auto 2.2rem;font-size:1.05rem}
.lp-features{display:grid;gap:1.2rem}
@media (min-width:860px){.lp-features{grid-template-columns:repeat(2,1fr)}}
.lp-feature{display:flex;flex-direction:column;background:linear-gradient(180deg,var(--panel),#130f0c);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.lp-feature .art{aspect-ratio:10/7;object-fit:cover}
.lp-feature div{padding:1.1rem 1.2rem 1.3rem}
.lp-feature h3{font-size:1.35rem;display:flex;gap:.5rem;align-items:center}
.lp-feature h3 .i{color:var(--accent)}
.lp-feature p{color:#cfc1ab;margin:.3rem 0 0}
.lp-steps{display:grid;gap:1rem;counter-reset:s}
@media (min-width:760px){.lp-steps{grid-template-columns:repeat(4,1fr)}}
.lp-step{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:1.2rem;position:relative}
.lp-step::before{counter-increment:s;content:counter(s);position:absolute;top:-.9rem;left:1rem;width:2rem;height:2rem;border-radius:50%;background:linear-gradient(180deg,#f58b3b,#d6601a);color:#1b0d03;font-weight:900;display:flex;align-items:center;justify-content:center;font-family:var(--serif)}
.lp-step .i{width:2rem;height:2rem;color:var(--gold);margin-top:.4rem}
.lp-step h3{margin-top:.5rem}
.lp-step p{color:var(--muted);margin:.2rem 0 0;font-size:.95rem}
.lp-shots{background:linear-gradient(180deg,var(--bg),#130e0b 40%,var(--bg))}
.shot-tabs{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;margin:0 0 1.4rem}
.shot-tabs a{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem 1rem;border-radius:99px;border:1px solid var(--line2);color:var(--fg);text-decoration:none;font-weight:600;font-size:.92rem;background:var(--panel)}
.shot-tabs a:hover{border-color:var(--gold)}
.shots-row{display:flex;gap:1.1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.4rem .2rem 1.4rem;-webkit-overflow-scrolling:touch}
.shot{flex:0 0 min(86%,44rem);scroll-snap-align:center;background:var(--panel);border:1px solid var(--line2);border-radius:16px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.55)}
.shot.phone{flex:0 0 min(62%,15rem)}
.shot img{display:block;width:100%;height:auto;background:var(--panel2)}
.shot figcaption{padding:.7rem .9rem;color:#d3c5ae;font-size:.92rem;display:flex;gap:.45rem;align-items:center}
.shot figcaption .i{color:var(--accent)}
.shot-browser{height:1.6rem;background:#0c0a08;border-bottom:1px solid var(--line);display:flex;gap:.35rem;align-items:center;padding:0 .7rem}
.shot-browser i{width:.55rem;height:.55rem;border-radius:50%;background:#3a2f26;display:block}
.lp-dyn{display:grid;gap:1rem}
@media (min-width:700px){.lp-dyn{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.lp-dyn{grid-template-columns:repeat(5,1fr)}}
.lp-dyn article{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.lp-dyn .art{aspect-ratio:3/2;object-fit:cover}
.lp-dyn div{padding:.8rem .9rem 1rem}
.lp-dyn h3{font-size:1.02rem}
.lp-dyn ul{margin:.4rem 0 0;padding-left:1.1rem;color:#cfc1ab;font-size:.9rem}
.lp-era{position:relative;overflow:hidden;padding:5rem 1.2rem;text-align:center;border-block:1px solid var(--line)}
.lp-era .art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lp-era::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse at center,rgba(10,8,6,.55),rgba(10,8,6,.9))}
.lp-era .lp-inner{position:relative;z-index:2}
.lp-era h2{margin-bottom:.8rem}
.lp-era p{max-width:40rem;margin:.4rem auto;color:#e4d7c1;font-size:1.08rem}
.lp-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem;margin:2rem auto 0;max-width:46rem}
@media (min-width:700px){.lp-stats{grid-template-columns:repeat(4,1fr)}}
.lp-stats div{background:rgba(20,15,11,.75);border:1px solid var(--line2);border-radius:14px;padding:.9rem .5rem}
.lp-stats b{display:block;font-family:var(--serif);font-size:1.8rem;color:var(--gold)}
.lp-stats span{color:var(--muted);font-size:.85rem}
.lp-mobile{display:grid;gap:2rem;align-items:center}
@media (min-width:860px){.lp-mobile{grid-template-columns:1fr 1fr}}
.lp-mobile ul{list-style:none;padding:0;margin:1rem 0}
.lp-mobile li{display:flex;gap:.7rem;margin:.7rem 0;align-items:flex-start}
.lp-mobile li .i{color:var(--accent);margin-top:.15rem;width:1.4em;height:1.4em}
.lp-mobile h2{text-align:left}
.lp-phones{display:flex;gap:1rem;justify-content:center;align-items:flex-start}
.lp-phones .phone{width:min(44%,13rem);border-radius:26px;border:6px solid #2a231d;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.6);background:#000}
.lp-phones .phone:nth-child(2){margin-top:2rem}
.lp-phones img{display:block;width:100%;height:auto}
.lp-faq details{background:var(--panel);border:1px solid var(--line);border-radius:14px;margin:.6rem 0;padding:0 1rem}
.lp-faq summary{cursor:pointer;font-weight:700;padding:.95rem 0;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary::after{content:"+";color:var(--gold);font-size:1.4rem;line-height:1}
.lp-faq details[open] summary::after{content:"\2212"}
.lp-faq p{color:#cfc1ab;margin:0 0 1rem}
.lp-final{position:relative;overflow:hidden;text-align:center;padding:5.5rem 1.2rem}
.lp-final .art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lp-final::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(10,8,6,.6),rgba(10,8,6,.88))}
.lp-final .lp-inner{position:relative;z-index:2}
.lp-final h2{font-size:clamp(1.9rem,5vw,3rem)}
.lp-foot{padding:2rem 1.2rem 6rem;border-top:1px solid var(--line);color:var(--muted);font-size:.9rem;text-align:center}
.lp-foot a{color:var(--muted)}
.lp-sticky{position:fixed;left:0;right:0;bottom:0;z-index:70;display:flex;justify-content:center;padding:.7rem 1rem calc(.7rem + env(safe-area-inset-bottom));background:linear-gradient(0deg,rgba(10,8,6,.96),rgba(10,8,6,.0))}
.lp-sticky .button{width:100%;max-width:26rem}
@media (min-width:860px){.lp-sticky{display:none}.lp-foot{padding-bottom:2rem}}

.lp-sec .kicker.left{text-align:left}
.lp-faq .lp-inner{max-width:46rem}
.m-only{display:none}
@media (max-width:700px){
  .d-only{display:none}.m-only{display:block}
  .lp-dyn{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:.9rem;padding-bottom:.8rem;-webkit-overflow-scrolling:touch}
  .lp-dyn article{flex:0 0 72%;scroll-snap-align:center}
  .lp-features .lp-feature .art{aspect-ratio:16/9}
  .lp-sec{padding:3rem 1rem}
  .shot.phone{flex:0 0 68%}
}
.shot{flex:0 0 min(86%,40rem)}
@media (max-width:640px){.alert{flex-wrap:wrap}}

.lp .button:not(.secondary){--b1:#ffe27a;--b2:#f0b93e;--b3:#c28617;--edge:#6e4a0c;color:#3a2205;text-shadow:0 1px 0 rgba(255,255,255,.55);border-color:#4a2f06}
.lp .button.secondary{--b1:#4a3a2a;--b2:#33261a;--b3:#241a11;color:var(--gold-hi)}
.lp-nav .cta a.muted{color:#e8dcc7}