/* System fonts only - no external font loading */
:root{
  --background: 0 0% 100%;
  --foreground: 220 20% 10%;

  --card: 0 0% 100%;
  --card-foreground: 220 20% 10%;

  --secondary: 220 15% 96%;
  --secondary-foreground: 220 25% 15%;

  --muted: 220 15% 94%;
  --muted-foreground: 220 10% 45%;

  --accent: 16 100% 50%;
  --accent-foreground: 0 0% 100%;

  --border: 220 15% 90%;

  --cta: 45 100% 50%;
  --cta-hover: 45 100% 45%;
  --cta-foreground: 0 0% 0%;

  --navy: 220 30% 12%;
  --navy-light: 220 25% 20%;

  --trust: 142 70% 45%;
  --warning: 45 100% 50%;

  --radius: 12px;

  --shadow-lg: 0 10px 30px rgba(0,0,0,.18);
  --shadow-xl: 0 12px 40px rgba(0,0,0,.22);

  --container: 1280px;
  --sticky-space: 86px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: Arial, Helvetica, sans-serif;
  color:hsl(var(--foreground));
  background: hsl(var(--navy));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding-bottom: var(--sticky-space);
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
main{
  background: hsl(var(--background));
}
.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}
body{
  padding-bottom: calc(var(--sticky-space) + env(safe-area-inset-bottom, 0px));
}
.i{
  width:18px;height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  vertical-align:-0.2em;
}
.i-14{width:14px;height:14px}
.i-24{width:24px;height:24px}
.i-28{width:28px;height:28px}
.i-32{width:32px;height:32px}
.i-36{width:36px;height:36px}

.section-container{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 16px;
}
@media (min-width:640px){ .section-container{padding:0 24px} }
@media (min-width:1024px){ .section-container{padding:0 32px} }

.section{position:relative}
.pad-sm{padding:24px 0}
.pad-md{padding:44px 0}
.pad-lg{padding:64px 0}

@media (min-width:768px){
  .pad-sm{padding:32px 0}
  .pad-md{padding:56px 0}
  .pad-lg{padding:88px 0}
}


.bg-background{background:hsl(var(--background))}
.bg-secondary{background:#fff}
.navy-section{
  background:hsl(var(--navy));
  color:#fff;
}

.center{text-align:center}
.maxw-2{max-width: 720px; margin: 0 auto}
.maxw-3{max-width: 820px; margin: 0 auto}
.maxw-4{max-width: 980px; margin: 0 auto}
.mx-auto{margin-left:auto;margin-right:auto}

.h2{
  font-size: 28px;
  line-height: 1.15;
  margin: 0 0 14px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
@media (min-width:768px){
  .h2{font-size: 40px}
}
.on-navy{color:#fff}
.on-navy-muted{color: rgba(255,255,255,.7)}

.h1like{
  font-size: 34px;
  line-height: 1.1;
  margin: 8px 0 18px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
@media (min-width:768px){ .h1like{font-size: 46px} }
@media (min-width:1024px){ .h1like{font-size: 54px} }

.lead{
  color:hsl(var(--muted-foreground));
  font-size: 18px;
  line-height: 1.7;
  margin: 0 0 24px;
}
.text-strong{color:hsl(var(--foreground))}
.muted{color:hsl(var(--muted-foreground))}
.mt-sm{margin-top: 12px}
.mt-md{margin-top: 20px}
.mb-lg{margin-bottom: 40px}

.kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:hsl(var(--accent));
  font-weight:700;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom: 12px;
}
.kicker-text{
  display:inline-block;
  color:hsl(var(--accent));
  font-weight:700;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom: 10px;
}
.kicker-text.on-navy{color:hsl(var(--accent))}

.text-gradient{
  background: linear-gradient(90deg, hsl(var(--accent)), #fb923c);
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}

.trust-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 10px 16px;
  border-radius: 999px;
  background: hsla(142,70%,45%,0.15);
  color: hsl(var(--trust));
  font-weight:700;
  font-size:14px;
}
.trust-badge-sm{padding:6px 10px;font-size:12px}

/* CTA buttons */
.cta-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 16px 32px;
  border-radius: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
  background: hsl(var(--cta));
  color: hsl(var(--cta-foreground));
  box-shadow: var(--shadow-lg);
  min-height: 48px;
  min-width: 48px;
  transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
}
.cta-button:hover{background: hsl(var(--cta-hover)); transform: translateY(-1px)}
.cta-button:active{transform: translateY(0)}
.cta-sm{padding: 10px 18px; font-size: 14px; letter-spacing:.04em}
.cta-xl{padding: 15px 12px; font-size: 14px}
@media (min-width:768px){ .cta-xl{font-size:22px; padding: 20px 44px} }
.full{width:100%}

.pulse{
  animation: pulseCta 2s ease-in-out infinite;
  will-change: transform;
}
@keyframes pulseCta{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.02)}
}

/* Header */
.site-header{
  position: fixed;
  top:0; left:0; right:0;
  z-index: 50;
  background: rgba(15, 23, 42, .95); /* close to navy */
  backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  height: 64px;
}
@media (min-width:768px){
  .header-row{height: 80px}
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
}
.brand img{height:60px;width:auto}
@media (min-width:768px){ .brand img{height:60px} }
.brand-text{display:none}
@media (min-width:640px){ .brand-text{display:block} }
.brand-name{
  display:block;
  color:#fff;
  font-weight: 900;
  letter-spacing: .02em;
  font-size: 18px;
}
.brand-sub{
  display:block;
  color: rgba(255,255,255,.65);
  font-size: 12px;
}

.nav-desktop{display:none}
@media (min-width:1024px){
  .nav-desktop{
    display:flex;
    align-items:center;
    gap: 28px;
  }
  .nav-desktop a{
    color: rgba(255,255,255,.8);
    font-weight: 700;
    font-size: 14px;
    transition: color .15s ease;
  }
  .nav-desktop a:hover{color:#fff}
}
.header-actions{display:flex; align-items:center; gap: 10px}
.menu-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;height:44px;
  border:none;
  background: transparent;
  color:#fff;
  cursor:pointer;
}
@media (min-width:1024px){ .menu-btn{display:none} }

.nav-mobile{
  border-top: 1px solid rgba(255,255,255,.08);
  padding: 12px 0 16px;
  display:flex;
  flex-direction:column;
  gap: 12px;
}
.nav-mobile a{
  color: rgba(255,255,255,.85);
  font-weight: 700;
  padding: 10px 0;
}
.nav-mobile a:hover{color:#fff}
.nav-mobile.is-collapsed{display:none}

.is-hidden{display:none !important}

.hide-sm{display:none}
.show-sm{display:inline}
@media (min-width:640px){
  .hide-sm{display:inline}
  .show-sm{display:none}
}
.hide-md{display:none}
@media (min-width:768px){ .hide-md{display:inline} }

/* HERO */
.hero{
  position:relative;
  min-height: 100vh;
  display:flex;
  align-items:center;
  padding-top: 80px;
}
.hero-bg{
  position:absolute; inset:0;
  z-index:0;
}
.hero-bg img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.hero-overlay{
  position:absolute; inset:0;
  background: linear-gradient(90deg,
    rgba(15,23,42,.95) 0%,
    rgba(15,23,42,.85) 45%,
    rgba(15,23,42,.70) 100%);
}
.hero-inner{position:relative; z-index:1; padding: 64px 16px}
.hero-content{max-width: 860px}
.hero-badges{display:flex; flex-wrap:wrap; gap:8px; margin-bottom: 14px}
.hero-title{
  margin:0 0 18px;
  color:#fff;
  font-weight: 900;
  letter-spacing: -0.03em;
  line-height: 1.05;
  font-size: 44px;
}
@media (min-width:640px){ .hero-title{font-size: 56px} }
@media (min-width:768px){ .hero-title{font-size: 72px} }
@media (min-width:1024px){ .hero-title{font-size: 86px} }

.hero-eta{
  display:inline-flex;
  align-items:center;
  gap: 12px;
  padding: 14px 18px;
  border-radius: 14px;
  background: rgba(255, 200, 0, .18);
  border: 2px solid hsl(var(--cta));
  backdrop-filter: blur(6px);
  color: hsl(var(--cta));
  font-weight: 900;
  font-size: 16px;
  margin-bottom: 18px;
}
@media (min-width:768px){ .hero-eta{font-size: 28px; padding: 16px 22px} }

.hero-cta{margin: 8px 0 10px}
.hero-sub{
  margin: 10px 0 0;
  color: rgba(255,255,255,.65);
  font-size: 14px;
}

.sr-only{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* simple layout helpers */
.grid-2{display:grid; grid-template-columns: 1fr; gap: 28px}
@media (min-width:1024px){ .grid-2{grid-template-columns: 1fr 1.4fr} }
.gap-lg{gap: 48px}
.items-center{align-items:center}

.stack > * + *{margin-top: 12px}
.text-muted{color:hsl(var(--muted-foreground))}

/* ABOUT media */
.about-media{position:relative}
.media-card{
  position:relative;
  border-radius: 16px;
  overflow:hidden;
  box-shadow: var(--shadow-xl);
}
.media-gradient{
  position:absolute; left:0; right:0; bottom:0;
  padding: 18px;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(15,23,42,.90) 100%);
}
.media-gradient p{
  margin:0;
  color:#fff;
  font-weight: 900;
  font-size: 16px;
}
.float-badge{
  position:absolute;
  right:-12px;
  bottom:-18px;
  background: hsl(var(--accent));
  color: hsl(var(--accent-foreground));
  padding: 14px 16px;
  border-radius: 14px;
  box-shadow: var(--shadow-lg);
}
@media (min-width:768px){
  .float-badge{right:-18px; bottom: 26px; padding: 18px 22px}
}
.rating-pill {
  padding: 12px 10px;
}
.cta-button {
  font-size: 14px;
}
.media-gradient p{
  
  font-size: 11px;
}
.float-badge .big{margin:0;font-weight:900;font-size: 30px}
.float-badge .small{margin:0;opacity:.9;font-size: 12px}
.benefits{list-style:none; padding:0; margin: 0 0 20px}
.benefits li{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  padding: 6px 0;
  color:hsl(var(--foreground));
}
.i-trust{color: hsl(var(--trust)); margin-top: 2px}

/* SERVICES */
.services-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 24px 0 26px;
}
@media (min-width:768px){
  .services-grid{grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px}
}
.service-item{text-align:center}
.service-icon{
  width: 64px;height:64px;
  margin: 0 auto 10px;
  display:flex;align-items:center;justify-content:center;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: hsl(var(--accent));
  transition: background .15s ease, color .15s ease;
}
@media (min-width:768px){
  .service-icon{width:80px;height:80px}
}
.service-item h3{margin: 0 0 2px; font-size: 14px; font-weight: 900}
.service-item p{margin:0; font-size: 12px; color: rgba(255,255,255,.65)}
.service-item:hover .service-icon{
  background: hsl(var(--accent));
  color: hsl(var(--accent-foreground));
}
.seo-note{
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,.10);
}
.seo-note p{
  margin:0 auto;
  max-width: 920px;
  color: rgba(255,255,255,.40);
  font-size: 12px;
  line-height: 1.7;
  text-align:center;
}

/* WHY - top features */
.features-top{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  max-width: 820px;
  margin: 18px auto 26px;
}
@media (min-width:768px){ .features-top{gap: 22px} }
.feature{text-align:center}
.feature-icon{
  width: 56px;height:56px;
  margin: 0 auto 10px;
  background:#fff;
  border-radius: 14px;
  box-shadow: var(--shadow-lg);
  display:flex;align-items:center;justify-content:center;
  color:hsl(var(--accent));
}
@media (min-width:768px){ .feature-icon{width:64px;height:64px} }
.feature h3{margin:0 0 4px; font-weight: 900; font-size: 14px}
.feature p{margin:0; color:hsl(var(--muted-foreground)); font-size: 12px}

/* ACCORDION */
.accordion{margin: 0 auto}
.accordion-trigger{
  width:100%;
  border:none;
  background:#fff;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0,0,0,.08);
  padding: 14px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  cursor:pointer;
  font-weight: 900;
}
.accordion-trigger .acc-left{
  display:flex;
  align-items:center;
  gap: 10px;
  color:hsl(var(--foreground));
}
.accordion-trigger .acc-left svg{color:hsl(var(--accent))}
.accordion-trigger .chevron{transition: transform .2s ease}
.accordion.is-open .accordion-trigger .chevron{transform: rotate(180deg)}
.accordion-panel{display:none; padding-top: 14px}
.accordion.is-open .accordion-panel{display:block}
.acc-card{
  background:#fff;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0,0,0,.06);
  padding: 18px;
}
.acc-text{color:hsl(var(--muted-foreground)); font-size: 14px; line-height: 1.7}
.acc-text p{margin:0 0 10px}
.acc-list h4{margin:14px 0 10px; color:hsl(var(--foreground))}
.dot-grid{
  list-style:none;
  padding:0;margin:0;
  display:grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
@media (min-width:640px){ .dot-grid{grid-template-columns: 1fr 1fr} }
.dot-grid li{
  position:relative;
  padding-left: 14px;
  font-size: 12px;
  color:hsl(var(--muted-foreground));
}
.dot-grid li::before{
  content:"";
  position:absolute;
  left:0; top: 8px;
  width:6px;height:6px;
  border-radius: 999px;
  background:hsl(var(--accent));
}

/* CARDS */
.cards-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 18px;
  margin-top: 26px;
}
@media (min-width:768px){ .cards-grid{grid-template-columns: 1fr 1fr} }
@media (min-width:1024px){ .cards-grid{grid-template-columns: 1fr 1fr 1fr} }

.card{
  background:hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: 14px;
  padding: 18px;
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
  transition: box-shadow .15s ease, transform .15s ease;
}
.card:hover{box-shadow: 0 16px 40px rgba(0,0,0,.10); transform: translateY(-2px)}
.card-icon{
  width:48px;height:48px;
  border-radius: 12px;
  background: rgba(255, 79, 0, .10);
  display:flex;align-items:center;justify-content:center;
  color:hsl(var(--accent));
  margin-bottom: 12px;
}
.card h3{margin:0 0 10px; font-weight:900}
.card p{margin:0 0 12px; color:hsl(var(--muted-foreground)); font-size: 13px; line-height: 1.7}
.tags{list-style:none; padding:0;margin:0; display:flex; flex-wrap:wrap; gap:8px}
.tags li{
  font-size: 12px;
  background:hsl(var(--secondary));
  color:hsl(var(--secondary-foreground));
  padding: 6px 10px;
  border-radius: 999px;
}

/* PROCESS */
.process-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-top: 24px;
}
@media (min-width:768px){ .process-grid{grid-template-columns: 1fr 1fr; gap: 18px} }
@media (min-width:1024px){ .process-grid{grid-template-columns: 1fr 1fr 1fr; gap: 20px} }

.step{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  padding: 18px;
}
.step-top{display:flex; align-items:center; gap: 14px; margin-bottom: 10px}
.step-num{
  font-weight: 900;
  font-size: 34px;
  color: rgba(255, 79, 0, .30);
}
.step-ico{
  width:48px;height:48px;
  background: rgba(255,79,0,.20);
  border-radius: 12px;
  display:flex;align-items:center;justify-content:center;
  color:hsl(var(--accent));
}
.step h3{margin:0 0 8px; font-weight:900}
.step p{margin:0; color: rgba(255,255,255,.70); font-size: 13px; line-height: 1.7}

.process-cta{
  margin-top: 28px;
  background: rgba(255,79,0,.10);
  border-radius: 18px;
  padding: 22px;
  text-align:center;
}
@media (min-width:768px){ .process-cta{padding: 34px} }
.process-cta h3{margin:0 0 8px; font-size: 26px; font-weight:900}
.process-cta p{margin:0 auto 16px; max-width: 760px; color: rgba(255,255,255,.80); line-height: 1.7}

/* TESTIMONIALS */
.test-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-top: 26px;
}
@media (min-width:768px){ .test-grid{grid-template-columns: 1fr 1fr; gap: 18px} }
@media (min-width:1024px){ .test-grid{grid-template-columns: 1fr 1fr 1fr; gap: 20px} }

.t-card{
  position:relative;
  background:#fff;
  border-radius: 14px;
  padding: 18px;
  box-shadow: 0 12px 30px rgba(0,0,0,.08);
}
.t-quote{
  position:absolute;
  top: 12px;
  right: 12px;
  width: 32px;height:32px;
  color: rgba(255,79,0,.20);
}
.stars{display:flex; gap:4px; margin-bottom: 10px}
.star{
  color: hsl(var(--warning));
  fill: hsl(var(--warning));
  stroke: hsl(var(--warning));
  width: 18px;height:18px;
}
.t-text{margin:0 0 14px; color:hsl(var(--muted-foreground)); font-size: 13px; line-height: 1.8}
.t-person{display:flex; align-items:center; gap: 10px}
.avatar{
  width:44px;height:44px;
  border-radius: 999px;
  background: rgba(255,79,0,.18);
  color: hsl(var(--accent));
  display:flex;align-items:center;justify-content:center;
  font-weight:900;
}
.t-name{font-weight:900}
.t-sub{font-size: 12px; color:hsl(var(--muted-foreground))}

.rating-pill{
  margin: 28px auto 0;
  display:inline-flex;
  align-items:center;
  gap: 10px;
  background:#fff;
  border-radius: 999px;
  padding: 10px 14px;
  box-shadow: 0 12px 30px rgba(0,0,0,.08);
}
.rating-pill .muted{font-size: 13px}

/* FAQ */
.faq-left{position:relative}
@media (min-width:1024px){
  .faq-left{
    position: sticky;
    top: 120px;
    align-self: start;
  }
}
.faq-cta{
  background: hsl(var(--navy));
  color:#fff;
  border-radius: 14px;
  padding: 18px;
  margin-top: 18px;
}
.faq-cta h3{margin:0 0 8px; font-weight:900; font-size: 20px}
.faq-cta p{margin:0 0 14px; color: rgba(255,255,255,.70); line-height: 1.6}

.faq-right{display:flex; flex-direction:column; gap: 12px}
.faq-item{
  border: 1px solid hsl(var(--border));
  border-radius: 14px;
  overflow:hidden;
  background:#fff;
}
.faq-q{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  text-align:left;
  padding: 16px;
  border:none;
  background:#fff;
  cursor:pointer;
  font-weight: 900;
}
.faq-q:hover{background: rgba(0,0,0,.03)}
.faq-a{
  display:none;
  padding: 0 16px 16px;
  color:hsl(var(--muted-foreground));
  line-height: 1.7;
  font-size: 13px;
  animation: fadeIn .18s ease;
}
.faq-item.is-open .faq-a{display:block}
.faq-ico{color:hsl(var(--accent)); flex-shrink:0}
@keyframes fadeIn{from{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}

/* REGIONS */
.regions-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
@media (min-width:768px){ .regions-grid{grid-template-columns: repeat(5, minmax(0, 1fr))} }
.region{
  display:flex;
  align-items:center;
  gap: 8px;
  color:hsl(var(--muted-foreground));
  font-size: 12px;
}

/* FINAL CTA dotted background */
.final-cta{overflow:hidden}
.final-cta .dots{
  position:absolute; inset:0;
  opacity:.10;
  background-image: radial-gradient(circle at 2px 2px, currentColor 1px, transparent 0);
  background-size: 40px 40px;
  color:#fff;
}
.trust-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap: 16px 22px;
  margin: 18px 0 22px;
}
.trust-row-item{
  display:flex;align-items:center; gap: 8px;
  color: rgba(255,255,255,.80);
}
.trust-row-item svg{color:hsl(var(--accent))}

/* FOOTER */
.site-footer{
  background:hsl(var(--navy));
  color:#fff;
  padding: 64px 0 40px;
}
.footer-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 28px;
  margin-bottom: 32px;
}
@media (min-width:768px){ .footer-grid{grid-template-columns: 1fr 1fr; gap: 32px} }
@media (min-width:1024px){ .footer-grid{grid-template-columns: repeat(4, 1fr); gap: 36px} }

.footer-brand{display:flex; align-items:center; gap: 10px; margin-bottom: 10px}
.footer-brand-name{font-weight:900; font-size: 20px}
.footer-muted{margin:0 0 12px; color: rgba(255,255,255,.70); font-size: 13px; line-height: 1.7}
.footer-phone{display:inline-flex; align-items:center; gap: 8px; color:hsl(var(--accent)); font-weight:900}
.footer-phone:hover{opacity:.9}

.site-footer h3{margin:0 0 12px; font-weight:900; font-size: 18px}
.footer-list{list-style:none; padding:0;margin:0; display:flex; flex-direction:column; gap: 8px; color: rgba(255,255,255,.70); font-size: 13px}
.footer-links{list-style:none; padding:0;margin:0; display:flex; flex-direction:column; gap: 10px; font-size: 13px}
.footer-links a{color: rgba(255,255,255,.70)}
.footer-links a:hover{color:#fff}
.contact-list{list-style:none; padding:0;margin:0; display:flex; flex-direction:column; gap: 14px; font-size: 13px}
.contact-list li{display:flex; gap: 10px; align-items:flex-start}
.contact-list .accent{color:hsl(var(--accent))}
.contact-list strong{display:block}
.contact-list a{color: rgba(255,255,255,.75)}
.contact-list a:hover{color:hsl(var(--accent))}
.contact-list span{color: rgba(255,255,255,.70)}

.footer-bottom{
  border-top: 1px solid rgba(255,255,255,.10);
  padding-top: 18px;
  display:flex;
  flex-direction:column;
  gap: 10px;
  color: rgba(255,255,255,.60);
  font-size: 13px;
  text-align:center;
}
@media (min-width:768px){
  .footer-bottom{
    flex-direction:row;
    text-align: center;
    justify-content: center;
  }
}

/* STICKY FOOTER */
.sticky-footer{
  position: fixed;
  left:0; right:0; bottom:0;
  z-index: 60;
  background:hsl(var(--navy));
  border-top: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 -10px 30px rgba(0,0,0,.25);
}
.sticky-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  padding: 10px 0;
}
.sticky-left{display:none}
.mobile-only{display:block}
@media (min-width:640px){
  .sticky-left{display:block}
  .mobile-only{display:none}
}
.sticky-title{margin:0; font-weight:900; font-size: 14px; color: white;}
.sticky-sub{margin:0; color: rgba(255,255,255,.60); font-size: 12px}

/* content pages (privacy/terms/404) */
.page-wrap{
  min-height: 100vh;
  padding-top: 96px;
}
@media (min-width:768px){ .page-wrap{padding-top: 120px} }
.prose{
  max-width: 900px;
  margin: 0 auto;
  color:hsl(var(--muted-foreground));
  font-size: 18px;
  line-height: 1.8;
}
.prose h1{
  color:hsl(var(--foreground));
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 18px;
  font-weight: 900;
}
@media (min-width:768px){ .prose h1{font-size: 44px} }
.prose h2{
  color:hsl(var(--foreground));
  font-size: 20px;
  margin: 26px 0 10px;
  font-weight: 900;
}
.prose p{margin: 0 0 16px}
.small-note{font-size: 12px; opacity:.75}

.back-link{
  display:inline-flex;
  margin-top: 18px;
  font-weight: 900;
  color: hsl(var(--accent));
}
.back-link:hover{text-decoration:underline}

.notfound{
  min-height: 100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 90px 16px 110px;
  background:hsl(var(--muted));
}
.notfound-card{text-align:center}
.notfound-card h1{margin:0 0 10px; font-size: 44px; font-weight: 900}
.notfound-card p{margin:0 0 14px; font-size: 18px; color:hsl(var(--muted-foreground))}
.notfound-card a{color:hsl(var(--accent)); font-weight:900}
.notfound-card a:hover{text-decoration:underline}

/* avoid anchor hidden under fixed header */
:target { scroll-margin-top: 100px; }


/* ABOUT: стабилизируем картинку, чтобы не ломалась верстка */
.media-card{
  position:relative;
  border-radius: 16px;
  overflow:hidden;
  box-shadow: var(--shadow-xl);
  aspect-ratio: 3 / 2;          /* ✅ фикс пропорций */
}

.media-card img{
  width:100%;
  height:100%;                  /* ✅ заполняем карточку */
  object-fit:cover;             /* ✅ без растяжки */
}

/* бейдж по умолчанию норм для десктопа/табл */
.float-badge{
  position:absolute;
  right:-12px;
  bottom:-18px;
  background: hsl(var(--accent));
  color: hsl(var(--accent-foreground));
  padding: 14px 16px;
  border-radius: 14px;
  box-shadow: var(--shadow-lg);
  z-index: 2;
}

/* ✅ МОБИЛКА: бейдж внутрь карточки, чтобы не перекрывал about-content */
@media (max-width:767px){
  .float-badge{
    right: 12px;
    bottom: 12px;
    padding: 12px 14px;
    border-radius: 12px;
  }
  .float-badge .big{font-size: 26px;}
  .float-badge .small{font-size: 11px;}
}

/* ✅ ПЛАНШЕТ: чуть аккуратнее, без вылета за край */
@media (min-width:768px) and (max-width:1023px){
  .float-badge{
    right: 10px;
    bottom: 14px;
  }
}


@media (max-width:767px){
  .about-media{ margin-bottom: 6px; } /* лёгкий воздух между картинкой и текстом */
}


/* LOCAL TRUST: красивый ряд преимуществ */
.icon-row{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 18px;
}

@media (min-width:768px){
  .icon-row{
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
  }
}

.icon-row-item{
  display:flex;
  align-items:flex-start;
  gap: 12px;
  padding: 14px 14px;
  border-radius: 14px;
  background: hsl(var(--secondary));
  border: 1px solid hsl(var(--border));
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
  text-align:left;
}

.icon-row-ico{
  flex:0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(255, 79, 0, .10);
  color: hsl(var(--accent));
  display:flex;
  align-items:center;
  justify-content:center;
}

.icon-row-text strong{
  display:block;
  font-weight: 900;
  font-size: 15px;
  line-height: 1.2;
  color: hsl(var(--foreground));
  margin-bottom: 4px;
}

.icon-row-text span{
  display:block;
  font-size: 13px;
  line-height: 1.5;
  color: hsl(var(--muted-foreground));
}

/* чуть крупнее на планшете/десктопе */
@media (min-width:768px){
  .icon-row-ico{ width: 52px; height: 52px; }
  .icon-row-text strong{ font-size: 16px; }
  .icon-row-text span{ font-size: 13px; }
}


.hero{ min-height: 100svh; } /* более корректная высота на мобилках */
@supports not (height: 100svh){
  .hero{ min-height: 100vh; }
}
:root{ --sticky-space: 92px; }
@media (min-width:768px){ :root{ --sticky-space: 86px; } }

.site-footer{ position: relative; z-index: 1; }
.sticky-footer{ z-index: 60; }