@font-face{font-family:"Barlow";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/barlow-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:500;font-style:normal;font-display:swap;src:url(../fonts/barlow-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/barlow-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:800;font-style:normal;font-display:swap;src:url(../fonts/barlow-condensed-latin-800-normal.woff2) format("woff2")}

:root{
  --navy:#0B1B3A;--navy-2:#13264D;--navy-3:#050D1F;--line-dark:#2A4475;
  --blue:#1E6BFF;--blue-light:#4D8DFF;--blue-pale:#7FB2FF;
  --text:#1F2937;--muted:#4B5563;--muted-dark:#C9D6EA;
  --bg-soft:#F4F7FC;--border:#DCE4F0;--gold:#E2B93B;--silver:#C7CDD6;--reflex:#F5C400;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Barlow",Arial,sans-serif;color:var(--text);background:#fff;font-size:18px;line-height:1.6}
img{max-width:100%;display:block}
a{color:var(--blue)}a:hover{color:var(--navy)}
.container{max-width:1200px;margin:0 auto;padding:0 24px}
.narrow{max-width:860px}
h1,h2{font-family:"Barlow Condensed",Arial Narrow,sans-serif;font-weight:800;text-transform:uppercase;line-height:1;margin:0}
h2{font-size:clamp(36px,5vw,56px);color:var(--navy)}
h3{margin:0;font-size:22px;color:var(--navy)}
p{margin:0}
.eyebrow{color:var(--blue);font-weight:600;letter-spacing:3px;text-transform:uppercase;font-size:15px}
.dark .eyebrow{color:var(--blue-pale)}
.dark{background:var(--navy);color:#fff}
.dark h2{color:#fff}
.soft{background:var(--bg-soft)}
.section{padding:100px 0}
.stack{display:flex;flex-direction:column;gap:20px}
.center{text-align:center;align-items:center}
.btn{display:inline-block;text-decoration:none;padding:16px 28px;border-radius:8px;font-weight:600;font-family:inherit;font-size:17px;border:0;cursor:pointer}
.btn-primary{background:var(--blue);color:#fff}.btn-primary:hover{background:#1558d6;color:#fff}
.btn-ghost{color:#fff;border:1px solid #4A5F87;padding:15px 27px}.btn-ghost:hover{color:#fff;border-color:#fff}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;background:#fff;padding:8px 12px;z-index:10}

/* Header */
.site-header{background:var(--navy);border-bottom:1px solid #1A2D55}
.site-header .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}
.site-header img{height:52px;width:auto}
.nav{display:flex;flex-wrap:wrap;align-items:center;gap:26px;font-weight:500;font-size:16px}
.nav a{color:#E5ECF8;text-decoration:none}.nav a:hover{color:#fff}
.nav .btn{padding:12px 20px;font-size:16px}
@media (max-width:860px){.nav a:not(.btn){display:none}}

/* Hero */
.hero{padding:96px 0 112px}
.hero-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:64px;align-items:center}
.hero h1{font-size:clamp(56px,8vw,80px);line-height:.95}
.hero h1 span{color:var(--blue-light)}
.hero .lead{font-size:20px;color:var(--muted-dark);max-width:540px}
.hero .actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:8px}
.fan{position:relative;height:460px;min-width:280px}
.fan > *{position:absolute;left:50%;border-radius:14px;box-shadow:0 20px 40px rgba(0,0,0,.35)}
.fan .back{top:40px;width:230px;height:322px;margin-left:-250px;transform:rotate(-10deg);background:var(--navy-2);border:2px solid var(--line-dark);display:flex;align-items:center;justify-content:center}
.fan .back img{width:96px;height:96px;border-radius:20px;box-shadow:none}
.fan .mid{top:10px;width:250px;height:352px;margin-left:-125px;object-fit:cover;z-index:1}
.fan .front{top:70px;width:230px;height:322px;margin-left:40px;transform:rotate(10deg);object-fit:cover;z-index:2}
@media (max-width:560px){.fan{transform:scale(.72);transform-origin:top center;height:340px}}

.reflex{height:18px;background:repeating-linear-gradient(-45deg,var(--reflex) 0 40px,#C7CDD6 40px 52px,var(--reflex) 52px 92px,var(--navy) 92px 104px)}

/* Story */
.two-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:64px;align-items:start}
.quote{margin:0;background:var(--bg-soft);border-radius:16px;padding:40px;display:flex;flex-direction:column;gap:24px}
.quote blockquote{margin:0;font-size:24px;line-height:1.4;color:var(--navy);font-weight:500}
.quote figcaption{display:flex;align-items:center;gap:16px}
.quote figcaption img{width:52px;height:52px;border-radius:12px}
.quote .name{font-weight:600;color:var(--navy)}
.quote .role{font-size:15px;color:var(--muted)}

/* Steps / cards */
.grid{display:grid;gap:24px}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.grid-5{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}
.step{background:#fff;border:1px solid var(--border);border-radius:16px;padding:32px;display:flex;flex-direction:column;gap:12px}
.step .num{width:52px;height:52px;border-radius:12px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-family:"Barlow Condensed",sans-serif;font-weight:800;font-size:28px}
.step .num.blue{background:var(--blue)}
.step p,.type p,.trust p{color:var(--muted);font-size:16px}
.type{border:1px solid var(--border);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.type .visual{height:180px;display:flex;align-items:center;justify-content:center;gap:12px}
.type .mini{width:92px;height:128px;background:#fff;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.type .body{padding:24px;display:flex;flex-direction:column;gap:8px}

/* Album */
.features{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.features li{display:flex;gap:16px;color:var(--muted-dark)}
.features li svg{flex:none}
.features strong{color:#fff}
.phone{width:300px;height:600px;margin:0 auto;border-radius:44px;background:var(--navy-3);border:2px solid var(--line-dark);padding:14px}
.phone .screen{height:100%;border-radius:32px;background:var(--bg-soft);padding:24px 18px;display:flex;flex-direction:column;gap:16px;color:var(--text)}
.phone .title{display:flex;align-items:center;justify-content:space-between}
.phone .title span{font-family:"Barlow Condensed",sans-serif;font-weight:800;font-size:26px;color:var(--navy)}
.phone .title img{width:32px;height:32px;border-radius:8px}
.phone .meta{font-size:14px;color:var(--muted)}
.phone .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.phone .cards div{aspect-ratio:5/7;border-radius:6px}
.phone .scan{margin-top:auto;background:var(--blue);color:#fff;border-radius:12px;padding:14px;text-align:center;font-weight:600}

.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:16px}
.chips span{padding:14px 28px;border-radius:999px;background:var(--bg-soft);border:1px solid var(--border);font-weight:600;color:var(--navy)}

.trust{display:flex;flex-direction:column;gap:10px}

.price{border:1px solid var(--border);border-radius:16px;padding:32px;display:flex;flex-direction:column;gap:6px}
.price .qty{font-family:"Barlow Condensed",sans-serif;font-weight:800;font-size:44px;color:var(--navy);line-height:1}
.price .unit{color:var(--muted)}
.price .amount{margin-top:12px;font-size:20px;font-weight:600;color:var(--navy)}

.faq{display:flex;flex-direction:column;gap:12px}
.faq details{background:#fff;border-radius:12px;padding:20px 24px;border:1px solid var(--border)}
.faq summary{font-weight:600;color:var(--navy);cursor:pointer}
.faq details p{margin-top:12px;color:var(--muted)}

/* Form */
.cta{max-width:720px;margin:0 auto;text-align:center;display:flex;flex-direction:column;gap:24px}
.cta .lead{color:var(--muted-dark)}
.raffle{margin:0 auto;max-width:560px;background:var(--navy-2);border:1px solid var(--line-dark);border-radius:12px;padding:16px 20px;font-weight:500}
.raffle strong{color:var(--blue-pale)}
.raffle a{color:var(--blue-pale)}
form.interest{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;text-align:left;margin-top:8px}
form.interest label{display:flex;flex-direction:column;gap:6px;font-size:15px;color:var(--muted-dark)}
form.interest input[type=text],form.interest input[type=email]{padding:14px;border-radius:8px;border:1px solid #4A5F87;background:var(--navy-2);color:#fff;font-size:16px;font-family:inherit}
form.interest input:focus{outline:2px solid var(--blue-light);outline-offset:1px}
form.interest .consent{grid-column:1/-1;flex-direction:row;align-items:flex-start;gap:10px;line-height:1.5}
form.interest .consent input{margin-top:4px;width:18px;height:18px;flex:none}
form.interest .consent a{color:var(--blue-pale)}
form.interest .hp{position:absolute;left:-9999px}
form.interest button{grid-column:1/-1}
.form-msg{grid-column:1/-1;text-align:center;font-weight:600;min-height:1.6em}
.form-msg.ok{color:#7EE2A8}.form-msg.err{color:#FF9B9B}

/* Footer */
.site-footer{background:var(--navy-3);color:#9AAAC4;padding:48px 0;font-size:15px}
.site-footer .container{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px}
.site-footer img{height:44px;width:auto}
.site-footer a{color:var(--muted-dark)}
.site-footer nav{display:flex;flex-wrap:wrap;gap:24px}

/* Legal pages */
.legal{padding:64px 0 96px}
.legal h1{font-size:clamp(40px,6vw,56px);color:var(--navy);margin-bottom:24px}
.legal h2{font-size:28px;margin:36px 0 12px}
.legal p,.legal li{margin:0 0 12px}
.legal ul{padding-left:22px}
.draft{background:#FFF7D6;border:1px solid #E8C84A;border-radius:10px;padding:14px 18px;margin-bottom:32px;font-size:16px}