:root{
  --pink:#E5177B;
  --blue:#00A8E8;
  --orange:#FF6B00;
  --purple:#7B2FBE;
  --green:#00B86B;
  --ink:#111111;
  --dark:#0D0D12;
  --muted:#666666;
  --muted2:#9A9AAB;
  --border:#ECECF0;
  --bg-soft:#F7F7FA;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#fff;color:var(--ink);font-family:'Manrope',Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--ink);text-decoration:none}
h1,h2{font-family:'Unbounded',sans-serif;margin:0}
p{margin:0}
img{max-width:100%;display:block}
.page{min-height:100vh;display:flex;flex-direction:column}
.container{max-width:1200px;margin:0 auto;padding:0 20px}

@keyframes floatBlob{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(12px,-16px) scale(1.06)}}

/* ---- promo ---- */
.promo{background:linear-gradient(90deg,var(--blue),var(--purple),var(--pink),var(--orange));color:#fff;text-align:center;padding:9px 16px;font-size:14px;font-weight:700;letter-spacing:0.02em}
.promo a{color:#fff;text-decoration:underline}

/* ---- header ---- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,0.94);backdrop-filter:blur(10px);border-bottom:1px solid #eee}
.site-header .container{padding:10px 20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.logo img{height:52px}
.logo-mobile{display:none}
.footer-logo-img{height:36px;display:block;margin-bottom:12px}
.nav{display:flex;gap:2px;flex-wrap:wrap;margin-left:auto;align-items:center}
.nav-link{padding:8px 12px;border-radius:8px;font-size:14.5px;font-weight:600;color:#333;background:transparent;white-space:nowrap}
.nav-link:hover{color:var(--pink)}
.nav-link.active{font-weight:800;color:var(--pink);background:rgba(229,23,123,0.08)}
.nav-cta{margin-left:10px;padding:10px 20px;border-radius:99px;background:#111;color:#fff;font-weight:800;font-size:14px;white-space:nowrap;display:inline-block}
.nav-cta:hover{background:linear-gradient(90deg,var(--pink),var(--orange));transform:translateY(-1px);color:#fff}

.nav-toggle-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.nav-toggle-btn{display:none;width:36px;height:36px;flex:0 0 auto;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;border-radius:8px}
.nav-toggle-btn .bar{display:block;width:20px;height:2px;background:#111;border-radius:2px;transition:transform .2s ease,opacity .2s ease}
.nav-toggle-input:focus-visible ~ .nav-toggle-btn{outline:2px solid var(--pink);outline-offset:2px}

/* ---- buttons ---- */
.btn{display:inline-block;padding:16px 32px;border-radius:99px;font-weight:800;font-size:16px;cursor:pointer;border:none}
.btn-grad{background:linear-gradient(90deg,var(--pink),var(--orange));color:#fff}
.btn-grad:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(229,23,123,0.4);color:#fff}
.btn-outline{border:2px solid rgba(255,255,255,0.35);color:#fff}
.btn-outline:hover{border-color:#fff;background:rgba(255,255,255,0.08);color:#fff}
.btn-dark{padding:14px 28px;border-radius:99px;background:#111;color:#fff;font-weight:800;font-size:15px;display:inline-block}
.btn-dark:hover{background:linear-gradient(90deg,var(--pink),var(--orange));color:#fff}
.btn-small{padding:10px 20px;font-size:14px}

/* ---- hero ---- */
.hero{position:relative;overflow:hidden;background:var(--dark);color:#fff}
.hero-blob{position:absolute;border-radius:50%;pointer-events:none}
.hero-blob-1{width:560px;height:560px;background:radial-gradient(circle,var(--pink) 0%,transparent 65%);opacity:0.55;top:-180px;right:-120px;animation:floatBlob 9s ease-in-out infinite}
.hero-blob-2{width:480px;height:480px;background:radial-gradient(circle,var(--blue) 0%,transparent 65%);opacity:0.45;bottom:-200px;left:-140px;animation:floatBlob 11s ease-in-out infinite reverse}
.hero-inner{position:relative;padding:clamp(56px,9vw,120px) 20px clamp(48px,8vw,100px)}
.hero-eyebrow{font-size:13px;font-weight:800;letter-spacing:0.18em;text-transform:uppercase;color:#FF9A3D;margin-bottom:20px}
.hero h1{font-weight:900;font-size:clamp(30px,5.4vw,68px);line-height:1.06;margin:0 0 24px;max-width:15ch}
.hero h1 .hl{background:linear-gradient(90deg,var(--blue),var(--pink),var(--orange));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{font-size:clamp(16px,1.6vw,20px);line-height:1.55;color:#C9C9D4;max-width:52ch;margin:0 0 36px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero-stats{display:flex;gap:clamp(24px,4vw,56px);flex-wrap:wrap;margin-top:clamp(40px,6vw,72px)}
.hero-stats .num{font-family:'Unbounded',sans-serif;font-weight:700;font-size:clamp(24px,3vw,36px)}
.hero-stats .label{font-size:14px;color:var(--muted2);margin-top:4px}

/* ---- generic section ---- */
.section{padding:clamp(56px,8vw,96px) 20px}
.section.tight{padding:clamp(48px,7vw,88px) 20px}
.section-soft{background:var(--bg-soft)}
.section h2{font-weight:700;font-size:clamp(24px,3.4vw,40px);margin:0 0 12px}
.section .sub{color:var(--muted);font-size:17px;margin:0 0 40px;max-width:60ch}
.page-title{font-weight:900;font-size:clamp(28px,4.4vw,52px);margin:0 0 20px}
.page-lede{font-size:18px;line-height:1.6;color:#444;max-width:64ch;margin:0 0 44px}

.grid{display:grid;gap:18px}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}

/* ---- segment cards ---- */
.card{border:1px solid var(--border);border-radius:18px;padding:26px;background:#fff}
.card-link{display:block}
.card-link:hover{box-shadow:0 10px 30px rgba(17,17,17,0.07);transform:translateY(-3px)}
.card .dot{width:44px;height:6px;border-radius:99px;margin-bottom:18px}
.card .card-title{font-weight:800;font-size:19px;margin-bottom:8px}
.card .card-text{color:var(--muted);font-size:15px;line-height:1.5}

/* ---- steps ---- */
.step{background:#fff;border-radius:18px;padding:26px}
.step .n{font-family:'Unbounded',sans-serif;font-weight:900;font-size:32px;background:linear-gradient(120deg,var(--blue),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent}
.step .title{font-weight:800;font-size:17px;margin:12px 0 8px}
.step .text{color:var(--muted);font-size:14.5px;line-height:1.5}

/* ---- cta ---- */
.cta-box{border-radius:24px;background:var(--dark);color:#fff;padding:clamp(36px,6vw,72px);position:relative;overflow:hidden}
.cta-box .hero-blob{width:400px;height:400px;background:radial-gradient(circle,var(--orange) 0%,transparent 65%);opacity:0.5;top:-140px;right:-100px}
.cta-box h2{position:relative;font-weight:700;font-size:clamp(22px,3vw,36px);margin:0 0 16px;max-width:22ch}
.cta-box p{position:relative;color:#C9C9D4;font-size:17px;margin:0 0 28px;max-width:50ch}
.cta-box .btn{position:relative}

/* ---- image / photo slot ---- */
.photo{border-radius:18px;overflow:hidden;height:280px}
.photo img{width:100%;height:100%;object-fit:cover}
.photo-empty{width:100%;height:100%;border:2px dashed var(--border);border-radius:18px;display:flex;align-items:center;justify-content:center;color:#999;font-size:14px;text-align:center;padding:16px;background:#FAFAFA}

/* ---- facts ---- */
.fact{border:1px solid var(--border);border-radius:18px;padding:24px}
.fact .num{font-family:'Unbounded',sans-serif;font-weight:700;font-size:26px;color:var(--pink)}
.fact .title{font-weight:700;font-size:16px;margin-top:10px}
.fact .text{color:var(--muted);font-size:14.5px;line-height:1.5;margin-top:6px}

/* ---- services ---- */
.service{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;border:1px solid var(--border);border-radius:20px;padding:clamp(24px,3vw,36px);align-items:center}
.service:hover{box-shadow:0 10px 30px rgba(17,17,17,0.06)}
.service .tag{display:inline-block;padding:5px 12px;border-radius:99px;color:#fff;font-size:12.5px;font-weight:800;letter-spacing:0.04em;text-transform:uppercase;margin-bottom:14px}
.service .title{font-family:'Unbounded',sans-serif;font-weight:700;font-size:clamp(19px,2.2vw,24px);margin-bottom:10px}
.service .text{color:#555;font-size:15.5px;line-height:1.55}
.service .list{color:#333;font-size:15px;line-height:1.9;white-space:pre-line}

/* ---- portfolio ---- */
.work .photo{height:300px}
.work .title{font-weight:800;font-size:16px;margin:12px 0 2px}
.work .cat{color:#888;font-size:14px}

/* ---- prices ---- */
.price-card{border:2px solid var(--border);border-radius:20px;padding:30px}
.price-card .tier{font-weight:800;font-size:14px;letter-spacing:0.08em;text-transform:uppercase;opacity:0.75}
.price-card .price{font-family:'Unbounded',sans-serif;font-weight:900;font-size:34px;margin:14px 0 4px}
.price-card .unit{font-size:14px;opacity:0.75;margin-bottom:18px}
.price-card .feats{font-size:15px;line-height:1.9;white-space:pre-line}
.price-note{border-radius:18px;background:var(--bg-soft);padding:26px;display:flex;gap:20px;align-items:center;flex-wrap:wrap;justify-content:space-between}
.price-note .text{font-size:16.5px;font-weight:700;max-width:46ch}

/* ---- blog ---- */
.post{border:1px solid var(--border);border-radius:18px;overflow:hidden;display:flex;flex-direction:column}
.post:hover{box-shadow:0 10px 30px rgba(17,17,17,0.08);transform:translateY(-3px)}
.post .photo{height:180px;border-radius:0}
.post .body{padding:22px;display:flex;flex-direction:column;gap:8px;flex:1}
.post .date{font-size:13px;font-weight:700;color:var(--pink)}
.post .title{font-weight:800;font-size:17.5px;line-height:1.3}
.post .text{color:var(--muted);font-size:14.5px;line-height:1.5}

/* ---- faq ---- */
.faq-item{border:1px solid var(--border);border-radius:16px;overflow:hidden}
.faq-item + .faq-item{margin-top:12px}
.faq-item summary{padding:20px 24px;display:flex;justify-content:space-between;gap:16px;align-items:center;cursor:pointer;font-weight:800;font-size:16.5px;list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--pink)}
.faq-item summary::after{content:'+';font-size:22px;color:var(--pink);flex:0 0 auto}
.faq-item[open] summary::after{content:'−'}
.faq-item .answer{padding:0 24px 20px;color:#555;font-size:15.5px;line-height:1.6}
.faq-item[open]{border-color:var(--pink)}

/* ---- contacts ---- */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(28px,5vw,64px)}
.contact-list{display:flex;flex-direction:column;gap:18px;font-size:16.5px}
.contact-list .label{font-size:13px;font-weight:800;color:#888;text-transform:uppercase;letter-spacing:0.06em;margin-bottom:4px}
.contact-list .phone{font-weight:800;font-size:20px}
.contact-panel{background:var(--bg-soft);border-radius:22px;padding:clamp(24px,3vw,36px)}
.form-title{font-weight:800;font-size:19px;margin-bottom:4px}
.form-field{width:100%;padding:14px 16px;border-radius:12px;border:1px solid #DDD;font-size:15.5px;outline:none;background:#fff;font-family:inherit;margin-bottom:14px}
textarea.form-field{resize:vertical}
.form-submit{width:100%;padding:15px;border-radius:12px;background:linear-gradient(90deg,var(--pink),var(--orange));color:#fff;font-weight:800;font-size:16px;text-align:center;cursor:pointer;border:none}
.form-submit:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(229,23,123,0.35)}
.form-hint{font-size:12.5px;color:#999;text-align:center;margin-top:10px}
.form-success{text-align:center;padding:48px 12px}
.form-success .emoji{font-size:48px;margin-bottom:16px}
.form-success .title{font-family:'Unbounded',sans-serif;font-weight:700;font-size:22px;margin-bottom:10px}
.form-success .text{color:#666;font-size:15.5px}
.form-error{background:#FDECEC;color:#B00020;border-radius:10px;padding:12px 16px;font-size:14px;font-weight:600;margin-bottom:14px}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.consent-check{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:#666;line-height:1.5;margin:2px 0 16px;cursor:pointer}
.consent-check input{margin-top:3px;flex:0 0 auto}
.consent-check a{color:var(--pink);text-decoration:underline}
.form-block{background:var(--bg-soft);border-radius:22px;padding:clamp(24px,3vw,36px);max-width:560px}

/* ---- footer ---- */
.site-footer{background:var(--dark);color:#fff;margin-top:auto}
.footer-grid{padding:clamp(40px,6vw,64px) 20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:32px}
.footer-brand{font-family:'Unbounded',sans-serif;font-weight:900;font-size:22px;background:linear-gradient(90deg,var(--blue),var(--pink),var(--orange));-webkit-background-clip:text;background-clip:text;color:transparent}
.footer-desc{color:var(--muted2);font-size:14.5px;line-height:1.6;margin-top:12px;max-width:32ch}
.footer-heading{font-weight:800;font-size:14px;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted2);margin-bottom:14px}
.footer-links{display:flex;flex-direction:column;gap:9px}
.footer-links a{color:#D5D5E0;font-size:15px}
.footer-links a:hover{color:var(--orange)}
.footer-contacts{display:flex;flex-direction:column;gap:9px;color:#D5D5E0;font-size:15px}
.footer-contacts .phone{color:#fff;font-weight:800;font-size:17px}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.1);padding:18px 20px;text-align:center;color:#71717F;font-size:13.5px}

@media (max-width:640px){
  .hero-actions{flex-direction:column}
  .hero-actions .btn{text-align:center}
  .logo-desktop{display:none}
  .logo-mobile{display:block}

  .site-header .container{gap:10px}
  .nav-cta{margin-left:auto}
  .nav-toggle-btn{display:flex}
  .nav{
    display:none;
    order:10;
    width:100%;
    flex-direction:column;
    align-items:stretch;
    gap:2px;
    margin-left:0;
    padding-top:10px;
    border-top:1px solid #eee;
    margin-top:10px;
  }
  .nav-toggle-input:checked ~ .nav{display:flex}
  .nav-link{padding:12px 14px}
  .nav-toggle-input:checked ~ .nav-toggle-btn .bar:nth-child(1){transform:translateY(6px) rotate(45deg)}
  .nav-toggle-input:checked ~ .nav-toggle-btn .bar:nth-child(2){opacity:0}
  .nav-toggle-input:checked ~ .nav-toggle-btn .bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
}

/* ---- reusable site table ---- */
.table-wrap{margin:36px 0;overflow-x:auto}
.site-table{width:100%;border-collapse:collapse;font-size:15px;min-width:480px}
.site-table th,.site-table td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--border)}
.site-table thead th{background:var(--dark);color:#fff;font-weight:700;font-size:13.5px;letter-spacing:0.02em}
.site-table tbody tr:nth-child(even){background:var(--bg-soft)}
.table-caption{color:var(--muted);font-size:13.5px;margin-top:10px}

/* ---- blog post article body ---- */
.post-body{font-size:16.5px;line-height:1.75;color:#333}
.post-body p{margin:0 0 20px}
.post-body h2{font-size:24px;font-weight:700;margin:36px 0 14px}
.post-body h3{font-size:19px;font-weight:700;margin:28px 0 12px}
.post-body ul,.post-body ol{margin:0 0 20px;padding-left:22px}
.post-body li{margin-bottom:8px}
.post-body a{color:var(--pink);text-decoration:underline}
.post-body img{border-radius:14px;margin:24px 0}
.post-body blockquote{margin:24px 0;padding:16px 20px;border-left:3px solid var(--pink);background:var(--bg-soft);color:#444;font-style:italic}
.post-body strong{font-weight:800}
.post-body .table-wrap{margin:28px 0}
