:root{
  --paper:#FFFFFF;
  --paper-deep:#F7F8FA;
  --ink:#13182A;
  --ink-soft:#5C6473;
  --blue:#4481C6;
  --blue-deep:#2F5F94;
  --blue-soft:#EAF1F9;
  --line:rgba(19,24,42,0.08);
  --shadow-xs: 0 1px 2px rgba(19,24,42,0.04);
  --shadow-sm: 0 4px 14px -6px rgba(19,24,42,0.10);
  --shadow-md: 0 16px 40px -18px rgba(19,24,42,0.18);
  --radius: 16px;
}

*{box-sizing:border-box; margin:0; padding:0;}

html{scroll-behavior:smooth;}

[id]{scroll-margin-top:100px;}

@media (max-width:759px){
  [id]{scroll-margin-top:150px;}
}

body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Noto Sans', sans-serif;
  line-height:1.55;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important;}
}

h1,h2,h3{
  font-family:'Noto Sans', sans-serif;
  font-weight:800;
  letter-spacing:-0.045em;
  line-height:1.04;
  color:var(--ink);
}

a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}

.wrap{
  max-width:1180px;
  margin:0 auto;
  padding:0 28px;
}

:focus-visible{
  outline:2.5px solid var(--blue);
  outline-offset:3px;
  border-radius:4px;
}

/* ───────────────────────── Header ───────────────────────── */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,0.86);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 0;
}
.brand{
  display:inline-flex; align-items:center;
}
.brand .mark-logo{
  width:200px;
  height:auto;
  display:block;
  background:none;
  transition:opacity 0.2s ease;
}
.brand:hover .mark-logo{opacity:0.85;}

nav ul{
  display:flex; gap:34px; list-style:none;
}
nav ul li a{
  position:relative;
  font-size:0.92rem; font-weight:500; color:var(--ink-soft);
  transition:color 0.2s ease;
  padding:4px 1px;
}
nav ul li a::after{
  content:'';
  position:absolute; left:0; bottom:-2px;
  width:0; height:1.5px;
  background:var(--blue);
  transition:width 0.25s ease;
}
nav ul li a:hover{color:var(--ink);}
nav ul li a:hover::after{width:100%;}

.nav-cta{display:none;}
@media (min-width:760px){
  .nav-cta{
    display:inline-flex; align-items:center; gap:8px;
    font-size:0.86rem; font-weight:600;
    background:var(--blue); color:#fff;
    padding:9px 20px; border-radius:999px;
    box-shadow:var(--shadow-xs);
    transition:transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
  }
  .nav-cta:hover{
    transform:translateY(-1px);
    background:var(--blue-deep);
    box-shadow:var(--shadow-sm);
  }
}
@media (max-width:759px){
  nav ul{display:none;}
}

/* ---- Mobile menu ---- */
.nav-toggle{
  display:none;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:5px;
  width:40px; height:40px;
  border:none;
  background:transparent;
  cursor:pointer;
  flex-shrink:0;
}
.nav-toggle span{
  display:block;
  width:21px; height:2px;
  border-radius:2px;
  background:var(--ink);
  transition:transform 0.3s ease, opacity 0.3s ease;
}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.mobile-nav{
  max-height:0;
  overflow:hidden;
  background:#fff;
  border-top:1px solid transparent;
  transition:max-height 0.35s ease, border-color 0.35s ease;
}
.mobile-nav.open{
  max-height:320px;
  border-top-color:var(--line);
}
.mobile-nav ul{
  list-style:none;
  display:flex; flex-direction:column;
  padding:8px 28px 20px;
}
.mobile-nav ul li a{
  display:block;
  padding:13px 0;
  font-size:1rem; font-weight:500;
  color:var(--ink);
  border-bottom:1px solid var(--line);
  transition:color 0.2s ease;
}
.mobile-nav ul li:last-child a{border-bottom:none;}
.mobile-nav ul li a:hover{color:var(--blue);}

@media (max-width:759px){
  .nav-toggle{display:flex;}
}
@media (min-width:760px){
  .mobile-nav{display:none;}
}

/* ───────────────────────── Hero ───────────────────────── */
.hero{
  position:relative;
  padding:88px 0 96px;
}
.hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:56px;
  align-items:center;
}
@media (min-width:880px){
  .hero-grid{grid-template-columns:1.1fr 0.9fr; gap:48px;}
}

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:0.78rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--ink-soft);
  margin-bottom:22px;
}
.eyebrow::before{
  content:''; width:16px; height:1.5px;
  background:var(--blue);
}

.hero h1{
  font-size:clamp(2.3rem, 5vw, 3.7rem);
  margin-bottom:24px;
}
.hero h1 em{
  font-style:italic; color:var(--blue);
}

.hero p.lede{
  font-size:1.1rem;
  color:var(--ink-soft);
  max-width:46ch;
  margin-bottom:34px;
}

.hero-actions{
  display:flex; flex-wrap:wrap; gap:14px;
  margin-bottom:48px;
}
.btn{
  display:inline-flex; align-items:center; gap:9px;
  padding:13px 26px;
  border-radius:999px;
  font-weight:600; font-size:0.95rem;
  transition:transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{
  background:var(--blue); color:#fff;
  box-shadow:var(--shadow-sm);
}
.btn-primary:hover{background:var(--blue-deep); box-shadow:var(--shadow-md);}
.btn-secondary{
  background:transparent; color:var(--ink);
  border:1.5px solid var(--line);
}
.btn-secondary:hover{border-color:var(--blue); color:var(--blue-deep);}

.hero-meta{
  display:flex; gap:36px; flex-wrap:wrap;
}
.hero-meta div{font-size:0.85rem; color:var(--ink-soft);}
.hero-meta strong{
  display:block; font-family:'Noto Sans', sans-serif; font-size:1.5rem; color:var(--ink); font-weight:600;
}

/* ---- Hero visual: sober line-art duo of app cards ---- */
.hero-visual{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:420px;
}
.hp-phone{
  position:absolute;
  width:200px;
  transition:transform 0.4s cubic-bezier(.2,.8,.2,1), filter 0.4s ease;
  cursor:pointer;
}
.hp-phone .phone-mock{
  width:100%;
  transition:box-shadow 0.4s ease;
}
.hp-back{
  top:30px; left:calc(50% - 170px);
  transform:rotate(-7deg);
  z-index:1;
  filter:brightness(0.94);
}
.hp-front{
  top:0; left:calc(50% - 30px);
  transform:rotate(6deg);
  z-index:2;
}
.hp-phone:hover{
  transform:rotate(0deg) translateY(-10px) scale(1.06);
  z-index:3;
  filter:brightness(1);
}
.hp-phone:hover .phone-mock{
  box-shadow:0 30px 60px -18px rgba(19,24,42,0.32);
}

/* ───────────────────────── Section shell ───────────────────────── */
section{padding:88px 0;}
.section-head{
  max-width:600px;
  margin-bottom:52px;
}
.section-head .eyebrow{margin-bottom:14px;}
.section-head h2{
  font-size:clamp(1.85rem, 3.2vw, 2.45rem);
  position:relative;
  display:inline-block;
}
.section-head p{
  color:var(--ink-soft);
  font-size:1.03rem;
  margin-top:16px;
}

/* Signature element: thin ink line that draws itself under section titles */
.ink-line{
  display:block;
  width:54px; height:2px;
  background:var(--blue);
  margin-top:14px;
  transform-origin:left center;
  transform:scaleX(0);
  transition:transform 0.7s cubic-bezier(.2,.8,.2,1);
}
.section-head.in .ink-line,
.reveal.in .ink-line{transform:scaleX(1);}

/* ───────────────────────── App showcase ───────────────────────── */
.apps{
  background:var(--paper-deep);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.app-block{
  display:grid;
  grid-template-columns:1fr;
  gap:40px;
  padding:44px;
  border-radius:24px;
  margin-bottom:24px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:var(--shadow-sm);
  transition:box-shadow 0.3s ease;
}
.app-block:hover{box-shadow:var(--shadow-md);}
.app-block:last-child{margin-bottom:0;}
@media (min-width:860px){
  .app-block{grid-template-columns:1fr 1fr; align-items:start; padding:52px;}
  .app-block.reverse .app-visual{order:2;}
  .app-visual{padding-top:8px;}
}

.app-tag{
  display:inline-flex; align-items:center; gap:7px;
  font-size:0.76rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase;
  padding:6px 13px; border-radius:999px;
  margin-bottom:18px;
  background:var(--blue-soft); color:var(--blue-deep);
}

.app-block h3{
  font-size:clamp(1.55rem, 2.5vw, 2rem);
  margin-bottom:16px;
}
.app-block p.desc{
  color:var(--ink-soft);
  font-size:1.01rem;
  margin-bottom:26px;
  max-width:42ch;
}
.feature-list{
  list-style:none;
  display:flex; flex-direction:column; gap:12px;
  margin-bottom:30px;
}
.feature-list li{
  display:flex; align-items:flex-start; gap:11px;
  font-size:0.95rem;
}
.feature-list li::before{
  content:'';
  flex-shrink:0;
  width:18px; height:18px;
  border-radius:50%;
  margin-top:2px;
  background-color:var(--blue);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3 8.5L6.2 11.5L13 4.5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:center;
}

.app-links{display:flex; gap:12px; flex-wrap:wrap;}
.store-btn{
  display:inline-flex; align-items:center; gap:9px;
  padding:11px 20px;
  border-radius:12px;
  font-size:0.87rem; font-weight:600;
  background:var(--ink); color:#fff;
  transition:transform 0.18s ease, box-shadow 0.18s ease;
  box-shadow:var(--shadow-xs);
}
.store-btn:hover{transform:translateY(-1px); box-shadow:var(--shadow-sm);}
.store-btn svg{width:18px; height:18px;}

.app-visual{
  display:flex; justify-content:center;
}
.phone-mock{
  position:relative;
  width:240px;
  border-radius:34px;
  padding:10px;
  background:#1B1F2B;
  box-shadow:var(--shadow-md);
  transition:transform 0.3s ease, box-shadow 0.3s ease;
}
.phone-mock:hover{
  transform:translateY(-4px);
  box-shadow:0 26px 54px -20px rgba(19,24,42,0.3);
}
.phone-notch{
  position:absolute;
  top:22px; left:50%;
  transform:translateX(-50%);
  width:10px; height:10px;
  border-radius:50%;
  background:#0E1018;
  z-index:2;
}
.phone-screenshot{
  width:100%;
  border-radius:26px;
  display:block;
  border:1px solid rgba(255,255,255,0.06);
}

/* ───────────────────────── Why one developer ───────────────────────── */
.ethos{
  text-align:center;
}
.ethos .wrap{max-width:760px;}
.ethos h2{
  font-size:clamp(1.85rem, 3.4vw, 2.5rem);
  margin-bottom:8px;
}
.ethos .ink-line{margin-left:auto; margin-right:auto;}
.ethos p.intro{
  color:var(--ink-soft);
  font-size:1.06rem;
  margin-top:22px;
  margin-bottom:14px;
}
.ethos-row{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
  gap:22px;
  margin-top:48px;
  text-align:left;
}
.ethos-item{
  display:block;
  padding:26px;
  border:1px solid rgba(68,129,198,0.16);
  border-radius:18px;
  background:var(--blue-soft);
  box-shadow:var(--shadow-xs);
  transition:box-shadow 0.3s ease, transform 0.3s ease, background 0.3s ease;
}
.ethos-item:hover{box-shadow:var(--shadow-sm); transform:translateY(-3px);}
.ethos-item-cta{
  cursor:pointer;
}
.ethos-item .num{
  font-family:'Noto Sans', sans-serif;
  font-size:1.5rem;
  color:var(--blue);
  margin-bottom:10px;
  display:block;
}
.ethos-item h4{
  font-family:'Noto Sans', sans-serif;
  font-weight:600;
  font-size:0.97rem;
  margin-bottom:6px;
  color:var(--ink);
}
.ethos-item p{font-size:0.88rem; color:var(--ink-soft); margin:0;}

/* ───────────────────────── Footer / contact ───────────────────────── */
footer{
  background:var(--ink);
  color:rgba(255,255,255,0.85);
  padding:64px 0 32px;
}
.footer-top{
  display:grid;
  grid-template-columns:1fr;
  gap:40px;
  padding-bottom:44px;
  border-bottom:1px solid rgba(255,255,255,0.12);
}
@media (min-width:760px){
  .footer-top{grid-template-columns:1.3fr 1fr 1fr;}
}

footer .foot-desc{
  font-size:0.92rem;
  color:rgba(255,255,255,0.55);
  max-width:34ch;
  margin-top:14px;
}
footer h5{
  font-family:'Noto Sans', sans-serif;
  font-size:0.78rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.45);
  margin-bottom:16px;
}
footer ul{list-style:none; display:flex; flex-direction:column; gap:11px;}
footer ul a{
  font-size:0.92rem;
  color:rgba(255,255,255,0.8);
  transition:color 0.2s ease;
}
footer ul a:hover{color:var(--blue);}
.foot-bottom{
  padding-top:28px;
  display:flex; flex-wrap:wrap; gap:14px;
  justify-content:space-between;
  font-size:0.82rem;
  color:rgba(255,255,255,0.4);
}

/* ───────────────────────── Reveal on scroll ───────────────────────── */
.reveal{
  opacity:0;
  transform:translateY(16px);
  transition:opacity 0.6s ease, transform 0.6s ease;
}
.reveal.in{opacity:1; transform:none;}

/* ───────────────────────── Legal pages ───────────────────────── */
.legal-hero{
  padding:64px 0 40px;
  border-bottom:1px solid var(--line);
}
.legal-hero h1{
  font-size:clamp(2rem, 4vw, 2.7rem);
  margin-bottom:12px;
}
.legal-hero .updated{
  font-size:0.87rem;
  color:var(--ink-soft);
}
.legal-body{
  padding:56px 0 100px;
  max-width:760px;
}
.legal-body h2{
  font-size:1.28rem;
  margin-top:40px;
  margin-bottom:14px;
}
.legal-body h2:first-child{margin-top:0;}
.legal-body p, .legal-body li{
  color:var(--ink-soft);
  font-size:0.98rem;
  margin-bottom:12px;
}
.legal-body ul{padding-left:22px; margin-bottom:16px;}
.legal-body a{color:var(--blue); text-decoration:underline; text-underline-offset:2px;}
.legal-toc{
  display:flex; flex-wrap:wrap; gap:8px 18px;
  padding:18px 22px;
  background:var(--paper-deep);
  border:1px solid var(--line);
  border-radius:14px;
  margin-bottom:8px;
  list-style:none;
}
.legal-toc a{
  font-size:0.86rem; font-weight:600; color:var(--ink);
  text-decoration:none;
}
.legal-toc a:hover{color:var(--blue);}

/* ───────────────────────── Contact form ───────────────────────── */
.contact-section{
  padding:88px 0;
  background:var(--paper-deep);
  border-top:1px solid var(--line);
}
.contact-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:48px;
}
@media (min-width:840px){
  .contact-grid{grid-template-columns:0.85fr 1.15fr;}
}
.contact-info h2{
  font-size:clamp(1.75rem, 3vw, 2.2rem);
  margin-bottom:8px;
}
.contact-info p{color:var(--ink-soft); font-size:1rem; margin-bottom:24px; max-width:38ch;}
.contact-detail{
  display:flex; align-items:center; gap:12px;
  font-size:0.95rem;
  margin-bottom:14px;
}
.contact-detail .ico{
  width:38px; height:38px; border-radius:10px;
  background:#fff; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
  color:var(--blue-deep);
}

form.contact-form{
  background:#fff;
  border:1px solid var(--line);
  border-radius:24px;
  padding:36px;
  box-shadow:var(--shadow-md);
}
.form-row{margin-bottom:20px;}
.form-row label{
  display:block;
  font-size:0.84rem; font-weight:600;
  margin-bottom:7px;
}
.form-row input, .form-row select, .form-row textarea{
  width:100%;
  padding:12px 14px;
  border-radius:11px;
  border:1.5px solid var(--line);
  background:var(--paper-deep);
  font-family:'Noto Sans', sans-serif;
  font-size:0.95rem;
  color:var(--ink);
  transition:border-color 0.2s ease, background 0.2s ease;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus{
  outline:none;
  border-color:var(--blue);
  background:#fff;
}
.form-row textarea{resize:vertical; min-height:130px;}
.form-row.two-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
@media (max-width:520px){
  .form-row.two-col{grid-template-columns:1fr;}
}
.form-hp{position:absolute; left:-9999px; opacity:0; pointer-events:none;}
.form-submit{
  width:100%;
  border:none; cursor:pointer;
  font-family:'Noto Sans', sans-serif;
  justify-content:center;
}
.form-status{
  margin-top:16px;
  font-size:0.9rem;
  padding:12px 14px;
  border-radius:10px;
  display:none;
}
.form-status.show{display:block;}
.form-status.ok{background:var(--blue-soft); color:var(--blue-deep);}
.form-status.err{background:#FBEAEA; color:#9B2C2C;}
.form-status.sending{background:var(--paper-deep); color:var(--ink-soft);}


/* ───────────────────────── Featured Blaze Player ───────────────────────── */
.featured-blaze{
  position:relative;
  padding:76px 0 88px;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 10%, rgba(34,224,162,0.16), transparent 32%),
    radial-gradient(circle at 20% 70%, rgba(68,129,198,0.12), transparent 30%),
    linear-gradient(180deg, #F7FBFF 0%, #FFFFFF 100%);
  border-bottom:1px solid var(--line);
}
.featured-blaze::before{
  content:'';
  position:absolute;
  inset:22px 28px auto;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(34,224,162,0.5), transparent);
  opacity:.7;
}
.featured-blaze-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:48px;
  align-items:center;
}
@media (min-width:920px){
  .featured-blaze-grid{grid-template-columns:1fr 0.98fr; gap:54px;}
}
.featured-blaze-copy h2{
  font-size:clamp(2rem, 4.4vw, 3.3rem);
  margin:12px 0 22px;
}
.featured-blaze-copy .lede{
  font-size:1.08rem;
  color:var(--ink-soft);
  max-width:52ch;
  margin-bottom:28px;
}
.blaze-tag{
  background:rgba(34,224,162,0.12);
  color:#087A5C;
  border:1px solid rgba(34,224,162,0.25);
}
.blaze-feature-list li::before{background-color:#22E0A2;}
.featured-blaze .btn-primary{background:#22E0A2; color:#06121C;}
.featured-blaze .btn-primary:hover{background:#18C991;}
.featured-blaze .btn-secondary:hover{border-color:#22E0A2; color:#087A5C;}
.featured-blaze-visual{
  position:relative;
  min-height:520px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.blaze-phone{
  position:absolute;
  width:min(45vw, 252px);
  min-width:190px;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), filter .35s ease;
}
.blaze-phone-front{right:48%; transform:translateX(52%) rotate(-4deg); z-index:2;}
.blaze-phone-back{left:47%; transform:translateX(-18%) rotate(5deg) scale(.95); z-index:1; filter:brightness(.88) saturate(.92);}
.blaze-phone:hover{z-index:3; filter:brightness(1); transform:translateY(-10px) rotate(0deg) scale(1.04);}
.phone-mock-dark{
  background:linear-gradient(180deg, #0B1018 0%, #121827 100%);
  box-shadow:0 30px 70px -24px rgba(6,18,28,.55), 0 0 0 1px rgba(34,224,162,.14) inset;
}
.phone-mock-dark .phone-screenshot{border-color:rgba(34,224,162,.18);}
@media (max-width:759px){
  .featured-blaze{padding:56px 0 72px;}
  .featured-blaze-visual{min-height:430px;}
  .blaze-phone{width:210px; min-width:0;}
  .blaze-phone-front{right:38%;}
  .blaze-phone-back{left:42%;}
}
@media (max-width:480px){
  .featured-blaze-visual{min-height:360px;}
  .blaze-phone{width:168px;}
}


/* ───────────────────────── Hero app trio update ───────────────────────── */
.hero-app-list{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  max-width:610px;
  margin:0 0 30px;
}
@media (min-width:640px){
  .hero-app-list{grid-template-columns:repeat(3, minmax(0, 1fr));}
}
.hero-app-card{
  display:block;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px;
  box-shadow:var(--shadow-xs);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.hero-app-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow-sm);
  border-color:rgba(68,129,198,.2);
}
.hero-app-card-featured{
  border-color:rgba(34,224,162,.32);
  background:linear-gradient(180deg, rgba(34,224,162,.08), #fff 72%);
}
.hero-app-card-featured:hover{border-color:rgba(34,224,162,.56);}
.hero-app-card .app-tag{
  margin-bottom:12px;
  font-size:.68rem;
  padding:5px 10px;
}
.hero-app-card strong{
  display:block;
  font-size:.98rem;
  line-height:1.25;
  color:var(--ink);
  margin-bottom:7px;
}
.hero-app-card p{
  color:var(--ink-soft);
  font-size:.86rem;
  line-height:1.45;
  margin:0;
}
.hero .hero-actions{margin-bottom:38px;}
.hero-visual-trio{min-height:520px;}
.hero-visual-trio .hp-phone{width:205px;}
.hero-visual-trio .hp-blaze{
  top:0;
  left:calc(50% - 108px);
  transform:rotate(-2deg);
  z-index:3;
  filter:brightness(1.02);
}
.hero-visual-trio .hp-cards{
  top:96px;
  left:calc(50% - 260px);
  transform:rotate(-8deg) scale(.9);
  z-index:2;
  filter:brightness(.94);
}
.hero-visual-trio .hp-costs{
  top:108px;
  left:calc(50% + 64px);
  transform:rotate(7deg) scale(.9);
  z-index:1;
  filter:brightness(.94);
}
.hero-visual-trio .hp-phone:hover{
  transform:rotate(0deg) translateY(-10px) scale(1.03);
  z-index:4;
  filter:brightness(1);
}
.blaze-feature-list li::before{background-color:#22E0A2;}
.blaze-tag{
  background:rgba(34,224,162,0.12);
  color:#087A5C;
  border:1px solid rgba(34,224,162,0.25);
}
@media (max-width:879px){
  .hero-visual-trio{min-height:470px;}
}
@media (max-width:600px){
  .hero-visual-trio{min-height:420px;}
  .hero-visual-trio .hp-phone{width:168px;}
  .hero-visual-trio .hp-blaze{left:calc(50% - 84px);}
  .hero-visual-trio .hp-cards{left:calc(50% - 182px); top:92px;}
  .hero-visual-trio .hp-costs{left:calc(50% + 26px); top:100px;}
}


/* ───────────────────────── Final hero typography polish ───────────────────────── */
.hero-copy{
  position:relative;
  max-width:690px;
}
.hero-copy::before{
  content:'';
  position:absolute;
  left:-28px;
  top:8px;
  width:3px;
  height:132px;
  border-radius:999px;
  background:linear-gradient(180deg, #22E0A2 0%, rgba(68,129,198,.88) 100%);
  opacity:.9;
}
.hero-copy .eyebrow{
  margin-bottom:18px;
}
.hero-copy h1{
  max-width:12.8ch;
  margin-bottom:22px;
}
.hero-copy h1 em{
  position:relative;
  display:inline-block;
  color:#087A5C;
  padding:0 .05em;
  white-space:nowrap;
}
.hero-copy h1 em::after{
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:.08em;
  height:.22em;
  border-radius:999px;
  background:rgba(34,224,162,.18);
  z-index:-1;
}
.hero-copy .lede{
  max-width:58ch;
  padding-left:18px;
  border-left:1px solid rgba(34,224,162,.28);
  margin-bottom:28px;
  font-size:1.08rem;
}
.hero-copy .hero-app-list{
  padding:14px;
  border:1px solid rgba(19,24,42,.06);
  border-radius:24px;
  background:linear-gradient(180deg, rgba(247,248,250,.92), rgba(255,255,255,.96));
  box-shadow:var(--shadow-xs);
}
.hero-app-card{
  min-height:100%;
}
.hero-app-card-featured{
  position:relative;
  overflow:hidden;
}
.hero-app-card-featured::after{
  content:'';
  position:absolute;
  right:-46px;
  top:-46px;
  width:130px;
  height:130px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(34,224,162,.18), rgba(34,224,162,0) 70%);
  pointer-events:none;
}
@media (min-width:640px){
  .hero-copy .hero-app-list{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
  }
  .hero-app-card-featured{
    grid-column:1 / -1;
    padding:20px 22px;
  }
  .hero-app-card-featured strong{
    font-size:1.08rem;
  }
  .hero-app-card-featured p{
    max-width:58ch;
  }
}
.hero-copy .hero-actions{
  margin-top:6px;
  margin-bottom:34px;
}
.hero-copy .hero-meta{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
  max-width:610px;
}
.hero-copy .hero-meta div{
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow-xs);
}
.hero-copy .hero-meta strong{
  display:inline-block;
  margin-right:6px;
  font-size:1.3rem;
  line-height:1;
  vertical-align:-.08em;
}
@media (max-width:879px){
  .hero-copy{
    max-width:none;
  }
  .hero-copy::before{
    display:none;
  }
  .hero-copy h1{
    max-width:15ch;
  }
}
@media (max-width:620px){
  .hero{
    padding-top:62px;
  }
  .hero-copy h1{
    max-width:100%;
    font-size:clamp(2.05rem, 12vw, 3rem);
  }
  .hero-copy .lede{
    padding-left:14px;
    font-size:1rem;
  }
  .hero-copy .hero-meta{
    grid-template-columns:1fr;
  }
  .hero-copy .hero-actions{
    gap:10px;
  }
  .hero-copy .hero-actions .btn{
    width:100%;
    justify-content:center;
  }
}