
:root{
  --ink:#0f2138; --ink2:#0a1728; --paper:#ffffff; --paper2:#eef1f4;
  --accent:#3e6a94; --brass:#5b6b7c; --line-dark:#24384c; --line-light:#dce1e6;
  --text-dark:#e7ecf1; --text-muted-dark:#93a3b3; --text-light:#14202e; --text-muted-light:#566575;
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:calc(72px + env(safe-area-inset-top,0px)); height:100%;}
body{margin:0; font-family:"Inter",system-ui,-apple-system,Segoe UI,sans-serif; background:var(--paper); color:var(--text-light); height:100%;}
h1,h2,h3,.brand{font-family:"Oswald",Impact,"Arial Narrow",sans-serif; font-weight:600; letter-spacing:.01em; margin:0;}
p{line-height:1.6; margin:0 0 1em;}
img{max-width:100%;}
a{color:inherit;}
.wrap{max-width:1080px; margin:0 auto; padding:0 24px;}
.overflow-x{overflow-x:auto;}

/* header */
header{position:sticky; top:0; z-index:40; background:rgba(21,25,29,.94); backdrop-filter:blur(6px); border-bottom:1px solid var(--line-dark);}
header .wrap{display:flex; align-items:center; justify-content:space-between; padding-top:calc(14px + env(safe-area-inset-top,0px)); padding-bottom:14px;}
.brand{color:var(--text-dark); font-size:1.15rem;}
.brand span{color:var(--accent);}
.brand-logo{line-height:0; display:inline-flex; overflow:hidden;}
.brand-logo-img{height:30px; width:auto; display:block;}
.footer-logo{display:inline-block; margin-bottom:.6em; overflow:hidden;}
.footer-logo .brand-logo-img{height:32px;}
@media (prefers-reduced-motion:no-preference){
  .brand-logo-img{animation:logoSlideIn .9s cubic-bezier(.16,.8,.3,1) both;}
  @keyframes logoSlideIn{
    from{transform:translateX(140px); opacity:0;}
    to{transform:translateX(0); opacity:1;}
  }
}
.nav-cta{background:var(--accent); color:#fff; padding:.55em 1.1em; border-radius:3px; font-size:.85rem; font-weight:600; text-decoration:none; white-space:nowrap;}

/* hero */
.hero{background:var(--ink); color:var(--text-dark); padding:64px 0 56px; position:relative; overflow:hidden;}
.hero .wrap{display:grid; grid-template-columns:1.2fr 1fr; gap:40px; align-items:center;}
.hero h1{font-size:clamp(2.1rem,5vw,3.4rem); line-height:1.05; color:#fff;}
.hero h1 em{font-style:normal; color:var(--accent);}
.hero p.lead{color:var(--text-muted-dark); font-size:1.05rem; max-width:46ch; margin-top:16px;}
.cta-row{display:flex; gap:14px; flex-wrap:wrap; margin-top:26px;}
.btn-primary{background:var(--accent); color:#fff; padding:.9em 1.5em; border-radius:3px; text-decoration:none; font-weight:600; display:inline-block;}
.btn-ghost{border:1px solid var(--line-dark); color:var(--text-dark); padding:.9em 1.5em; border-radius:3px; text-decoration:none; font-weight:500; display:inline-block;}
.trust-strip{margin-top:30px; display:flex; gap:22px; flex-wrap:wrap; font-size:.82rem; color:var(--text-muted-dark); border-top:1px solid var(--line-dark); padding-top:16px;}
.laser-vis{aspect-ratio:1/1; position:relative;}
.laser-vis svg{width:100%; height:100%;}
.beam{stroke:var(--accent); stroke-width:2; filter:drop-shadow(0 0 6px var(--accent));}
@media (prefers-reduced-motion:no-preference){
  .beam-anim{stroke-dasharray:6 10; animation:dash 3.2s linear infinite;}
  @keyframes dash{to{stroke-dashoffset:-160;}}
}

section{padding:56px 0;}
.section-light{background:var(--paper);}
.section-alt{background:var(--paper2);}
h2{font-size:clamp(1.5rem,3vw,2.1rem); margin-bottom:.3em;}
.eyebrow-none{color:var(--text-muted-light); max-width:60ch; margin-bottom:32px;}

/* services */
.svc{border-top:1px solid var(--line-light);}
.svc-row{display:grid; grid-template-columns:1fr 1.6fr auto; gap:20px; align-items:center; padding:24px 0; border-bottom:1px solid var(--line-light);}
.svc-row h3{font-size:1.2rem;}
.tags{display:flex; flex-wrap:wrap; gap:8px; margin-top:8px;}
.tag{font-size:.75rem; border:1px solid var(--line-light); color:var(--text-muted-light); padding:.25em .7em; border-radius:20px;}
.svc-row .link{color:var(--accent); text-decoration:none; font-weight:600; font-size:.9rem; white-space:nowrap;}

/* logo strip */
.logo-strip{background:var(--paper2); padding:26px 0;}
.logo-strip-label{text-align:center; font-size:.76rem; color:var(--text-muted-light); letter-spacing:.04em; margin-bottom:16px;}
.logo-strip-row{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:28px 40px;}
.logo-item{font-family:"Oswald",sans-serif; font-weight:500; font-size:.92rem; color:var(--text-muted-light); letter-spacing:.01em; opacity:.8; white-space:nowrap;}
@media (max-width:820px){
  .logo-strip-row{gap:16px 26px;}
  .logo-item{font-size:.8rem;}
}

/* poster */
.poster-section{background:var(--ink); overflow:hidden;}
.poster-inner{max-width:1080px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; align-items:center;}
.poster-art{width:100%; height:auto; display:block;}
.poster-copy{padding:40px 32px 40px 8px;}
.poster-badge{display:inline-block; border:1px solid var(--line-dark); color:var(--text-muted-dark); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; padding:.4em 1em; border-radius:20px; margin-bottom:20px;}
.poster-title{font-size:clamp(2rem,4.5vw,3rem); line-height:1.05; color:#fff;}
.poster-sub{color:var(--text-muted-dark); font-size:1rem; max-width:38ch; margin:18px 0 26px;}
.poster-cta{display:inline-block;}
@media (max-width:820px){
  .poster-inner{grid-template-columns:1fr;}
  .poster-art{max-width:340px; margin:0 auto;}
  .poster-copy{padding:8px 24px 40px; text-align:center;}
  .poster-sub{margin-left:auto; margin-right:auto;}
}

/* chat proof */
.chat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.chat-item{border-radius:10px; overflow:hidden; border:1px solid var(--line-light); box-shadow:0 6px 18px rgba(15,33,56,.10); background:var(--ink);}
.chat-item img{width:100%; display:block;}
@media (max-width:820px){ .chat-grid{grid-template-columns:repeat(2,1fr);} }

/* gallery */
.gallery-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.g-item{margin:0; border-radius:4px; overflow:hidden; background:var(--paper2); position:relative;}
.g-item img{width:100%; height:100%; aspect-ratio:1/1; object-fit:cover; display:block;}
.g-item figcaption{position:absolute; left:0; right:0; bottom:0; padding:8px 10px; font-size:.72rem; color:#fff; background:linear-gradient(transparent, rgba(15,20,45,.82)); line-height:1.2;}
@media (max-width:820px){ .gallery-grid{grid-template-columns:repeat(2,1fr);} }

/* pricing */
.price-block{background:var(--ink); color:var(--text-dark); border-radius:6px; padding:36px; display:flex; flex-wrap:wrap; gap:24px; align-items:center; justify-content:space-between;}
.price-block .num{font-family:"Oswald",sans-serif; font-size:2.4rem; color:var(--accent);}
.price-block .num small{font-size:1rem; color:var(--text-muted-dark); font-family:"Inter",sans-serif;}

/* why grid */
.why-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:28px 32px;}
.why-item{display:flex; gap:14px;}
.why-item svg{flex:none; width:28px; height:28px; stroke:var(--accent); fill:none; stroke-width:1.6;}
.why-item h3{font-size:1.02rem; margin-bottom:.3em;}
.why-item p{color:var(--text-muted-light); font-size:.92rem; margin:0;}

/* process */
.steps{counter-reset:step; display:grid; gap:0;}
.step{display:grid; grid-template-columns:56px 1fr; gap:18px; padding:20px 0; border-bottom:1px solid var(--line-light);}
.step:first-child{border-top:1px solid var(--line-light);}
.step .n{counter-increment:step; font-family:"Oswald",sans-serif; font-size:1.6rem; color:var(--brass);}
.step .n::before{content: counter(step, decimal-leading-zero);}
.step h3{font-size:1.02rem; margin-bottom:.25em;}
.step p{color:var(--text-muted-light); font-size:.92rem; margin:0;}

/* testimonials */
.quote-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.quote{background:var(--paper); border:1px solid var(--line-light); border-radius:4px; padding:22px;}
.quote .stars{color:var(--brass); letter-spacing:2px; font-size:.85rem; margin-bottom:8px;}
.quote .source{font-size:.72rem; color:var(--text-muted-light); margin-top:6px; text-transform:uppercase; letter-spacing:.04em;}
.quote p{font-size:.94rem; color:var(--text-light);}
.quote .who{font-size:.82rem; color:var(--text-muted-light); font-weight:600;}
.quote-note{font-size:.78rem; color:var(--text-muted-light); margin-top:10px;}

/* faq */
details{border-bottom:1px solid var(--line-light); padding:16px 0;}
summary{cursor:pointer; font-weight:600; list-style:none; display:flex; justify-content:space-between; gap:16px;}
summary::-webkit-details-marker{display:none;}
summary::after{content:"+"; color:var(--accent); font-size:1.3rem; line-height:1;}
details[open] summary::after{content:"−";}
details p{margin-top:12px; color:var(--text-muted-light); font-size:.94rem;}

/* final cta */
.final-cta{background:var(--ink); color:var(--text-dark); text-align:center; padding:64px 0;}
.final-cta h2{color:#fff;}
.final-cta p{color:var(--text-muted-dark); max-width:50ch; margin:0 auto 24px;}

footer{background:var(--ink2); color:var(--text-muted-dark); padding:36px 0 calc(36px + env(safe-area-inset-bottom,0px)); font-size:.86rem;}
footer .wrap{display:grid; grid-template-columns:2fr 1fr 1fr; gap:24px;}
footer h4{color:var(--text-dark); font-size:.85rem; margin-bottom:.6em; font-family:"Inter",sans-serif; font-weight:600;}
footer ul{list-style:none; padding:0; margin:0; display:grid; gap:6px;}
.copyline{border-top:1px solid var(--line-dark); margin-top:28px; padding-top:16px; font-size:.78rem;}

.wa-float{position:fixed; right:18px; bottom:calc(18px + env(safe-area-inset-bottom,0px)); background:#25D366; color:#fff; width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 14px rgba(0,0,0,.3); z-index:50; text-decoration:none;}
.wa-float svg{width:28px; height:28px; fill:#fff;}

@media (max-width:820px){
  .hero .wrap{grid-template-columns:1fr;}
  .laser-vis{max-width:220px; margin:0 auto;}
  .svc-row{grid-template-columns:1fr; text-align:left;}
  .why-grid{grid-template-columns:1fr;}
  .quote-grid{grid-template-columns:1fr;}
  footer .wrap{grid-template-columns:1fr; gap:20px;}
  .price-block{flex-direction:column; align-items:flex-start;}
}

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){ }
}


img{height:auto;}
body.admin-bar header{top:32px;}
@media(max-width:782px){body.admin-bar header{top:46px;}}
@media(max-width:600px){body.admin-bar header{top:0;}}
