@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500&display=swap');

    @font-face {
      font-family: 'Perfect Lemonade';
      src: url('../fonts/PerfectLemonade.otf') format('opentype');
      font-weight: 400 700;
      font-style: normal;
      font-display: swap;
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --ink: #181221;
      --cream: #ECE8F1;
      --peach: #C7BDD5;
      --pink: #897B9E;
      --orange: #F86B3C;
      --lime: #897B9E;
      --yellow: #C7BDD5;
      --purple: #4E4060;
      --teal: #4E4060;
      --cherry: #F86B3C;
    }
    html { scroll-behavior: smooth; }
    body {
      background: var(--ink);
      color: var(--cream);
      font-family: "Inter", -apple-system, sans-serif;
      min-height: 100vh;
      overflow-x: hidden;
      -webkit-font-smoothing: antialiased;
    }
    ::selection { background: var(--pink); color: var(--cream); }

    /* Noise overlay */
    body::before {
      content: '';
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 9999;
      opacity: 0.04;
      mix-blend-mode: multiply;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    }

    @keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
    @keyframes spin { from { transform: rotate(0); } to { transform: rotate(360deg); } }
    @keyframes bob { 0%, 100% { transform: translateY(0) rotate(var(--r, 0deg)); } 50% { transform: translateY(-10px) rotate(var(--r, 0deg)); } }
    @keyframes bob2 { 0%, 100% { transform: translateY(0) rotate(var(--r, 0deg)); } 50% { transform: translateY(-8px) rotate(var(--r, 0deg)); } }

    /* NAV */
    header {
      position: sticky;
      top: 0;
      z-index: 200;
      background: rgba(43, 34, 54, 0.88);
      backdrop-filter: saturate(140%) blur(8px);
      -webkit-backdrop-filter: saturate(140%) blur(8px);
      border-bottom: 1px solid rgba(236, 232, 241, 0.14);
    }
    .nav-inner {
      max-width: 1320px;
      margin: 0 auto;
      padding: 14px clamp(18px, 4vw, 56px);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
    }
    .logo {
      text-decoration: none;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      font-family: "Inter", sans-serif;
      line-height: 1;
      white-space: nowrap;
    }
    .logo-word {
      display: flex;
      align-items: flex-end;
      font-weight: 700;
      font-size: 26px;
      letter-spacing: -0.04em;
      line-height: 1;
    }
    .logo-word .pink { color: #FF8FA3; }
    .logo-dot {
      position: relative;
      display: inline-block;
      width: 0.84em;
      height: 0.84em;
    }
    .logo-dot .ring {
      position: absolute;
      inset: 0;
      border-radius: 50%;
      border: 0.07em solid #7ECBA1;
    }
    .logo-dot .center {
      position: absolute;
      top: 50%; left: 50%;
      width: 0.24em; height: 0.24em;
      background: #FFD66B;
      border-radius: 50%;
      transform: translate(-50%, -50%);
    }
    .logo-sub {
      font-size: 9px;
      font-weight: 500;
      letter-spacing: 0.5em;
      text-transform: uppercase;
      color: #bdb6ab;
      margin-top: 3px;
    }
    nav {
      display: flex;
      align-items: center;
      gap: clamp(12px, 2.2vw, 30px);
    }
    nav a {
      text-decoration: none;
      color: var(--cream);
      font-size: 14.5px;
      font-weight: 600;
      white-space: nowrap;
      transition: color .15s;
    }
    nav a:hover { color: var(--pink); }
    .nav-cta {
      background: var(--pink) !important;
      color: #fff !important;
      font-size: 14.5px !important;
      font-weight: 700 !important;
      padding: 9px 20px !important;
      border-radius: 999px !important;
      border: 1px solid rgba(43,34,54,0.12) !important;
      box-shadow: 0 10px 22px -14px rgba(43,34,54,0.28) !important;
      transition: transform .15s, box-shadow .15s !important;
    }
    .nav-cta:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -16px rgba(43,34,54,0.42) !important; }
    .nav-mobile-toggle { display: none; background: none; border: none; cursor: pointer; padding: 4px; }
    .nav-mobile-toggle span { display: block; width: 22px; height: 2px; background: var(--cream); margin: 4px 0; border-radius: 2px; transition: .2s; }

    /* HERO */
    #top {
      position: relative;
      max-width: 1320px;
      margin: 0 auto;
      padding: clamp(40px,6vw,80px) clamp(18px,4vw,56px) clamp(48px,6vw,88px);
    }
    .hero-deco {
      position: absolute;
      top: 96px;
      left: clamp(6px, 3vw, 40px);
      animation: bob 6s ease-in-out infinite;
      --r: -12deg;
    }
    .hero-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
      gap: clamp(32px, 5vw, 64px);
      align-items: center;
    }
    .hero-eyebrow {
      font-weight: 700;
      font-size: 13px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--pink);
      margin: 0 0 18px;
    }
    h1 {
      font-family: "Inter", system-ui, sans-serif;
      font-weight: 400;
      font-size: clamp(46px, 6.2vw, 90px);
      line-height: 1.0;
      letter-spacing: -0.01em;
      margin: 0;
      max-width: 12ch;
    }
    h1 em { font-style: italic; color: var(--pink); }
    .hero-sub {
      font-size: clamp(17px, 1.5vw, 20px);
      line-height: 1.55;
      color: rgba(236,232,241,0.78);
      max-width: 46ch;
      margin: 24px 0 0;
      font-weight: 500;
    }
    .hero-btns {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 16px;
      margin-top: 32px;
    }
    .btn-primary {
      text-decoration: none;
      background: var(--pink);
      color: #fff;
      font-size: 15px;
      font-weight: 700;
      padding: 14px 30px;
      border-radius: 999px;
      border: 1px solid rgba(43,34,54,0.14);
      box-shadow: 0 14px 30px -18px rgba(43,34,54,0.32);
      transition: transform .15s, box-shadow .15s;
      display: inline-block;
    }
    .btn-primary:hover { transform: translateY(-3px); box-shadow: 0 22px 42px -20px rgba(43,34,54,0.45); }
    .btn-secondary {
      text-decoration: none;
      background: #fff;
      color: var(--ink);
      font-size: 15px;
      font-weight: 700;
      padding: 14px 26px;
      border-radius: 999px;
      border: 1px solid rgba(43,34,54,0.14);
      box-shadow: 0 14px 30px -18px rgba(43,34,54,0.32);
      transition: transform .15s, box-shadow .15s;
      display: inline-block;
    }
    .btn-secondary:hover { transform: translateY(-3px); }

    /* Hero logo visual */
    .hero-visual {
      position: relative;
      display: flex;
      justify-content: center;
    }
    .hero-circle-wrap {
      position: relative;
      width: min(100%, 480px);
      aspect-ratio: 1 / 1;
    }
    .hero-circle {
      position: absolute;
      inset: 0;
      background: var(--pink);
      border-radius: 50%;
      border: 1px solid rgba(43,34,54,0.14);
      box-shadow: 0 26px 52px -26px rgba(43,34,54,0.45);
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .hero-logo-big {
      display: flex;
      flex-direction: column;
      align-items: center;
      font-family: "Inter", sans-serif;
    }
    .hero-logo-text {
      display: flex;
      align-items: flex-end;
      font-weight: 700;
      font-size: clamp(56px, 9vw, 104px);
      letter-spacing: -0.04em;
      line-height: 1;
      color: #fff;
    }
    .hero-logo-studio {
      font-size: clamp(13px, 1.5vw, 18px);
      font-weight: 500;
      letter-spacing: 0.5em;
      text-transform: uppercase;
      color: rgba(255,255,255,0.85);
      margin-top: 14px;
      padding-left: 0.5em;
    }
    .spinning-badge {
      position: absolute;
      z-index: 2;
      top: 30px;
      right: 2px;
      width: 118px;
      height: 118px;
      background: var(--yellow);
      border-radius: 50%;
      border: 1px solid rgba(43,34,54,0.14);
      box-shadow: 0 14px 30px -18px rgba(43,34,54,0.32);
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .spinning-badge svg.spin-ring { animation: spin 20s linear infinite; position: absolute; inset: 0; }

    /* Stats bar */
    .stats-bar {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
      margin-top: clamp(40px, 5vw, 60px);
    }
    .stat-chip {
      display: flex;
      align-items: baseline;
      gap: 8px;
      border: 1px solid rgba(43,34,54,0.14);
      box-shadow: 0 10px 22px -14px rgba(43,34,54,0.28);
      border-radius: 13px;
      padding: 14px 20px;
    }
    .stat-chip .num {
      font-family: "Inter", system-ui, sans-serif;
      font-weight: 400;
      font-size: 30px;
      line-height: 1;
    }
    .stat-chip .label { font-size: 13px; font-weight: 600; }
    .stat-pink { background: var(--pink); color: #fff; }
    .stat-orange { background: var(--orange); color: #fff; }
    .stat-lime { background: var(--lime); color: var(--ink); }
    .stat-purple { background: var(--purple); color: #fff; }

    /* MARQUEE */
    .marquee-band {
      background: var(--pink);
      border-top: 1px solid rgba(43,34,54,0.14);
      border-bottom: 1px solid rgba(43,34,54,0.14);
      overflow: hidden;
      padding: 14px 0;
    }
    .marquee-track {
      display: flex;
      gap: 0;
      width: max-content;
      animation: marquee 26s linear infinite;
      font-family: "Inter", system-ui, sans-serif;
      font-style: italic;
      font-size: clamp(20px, 2.4vw, 30px);
      color: #fff;
      white-space: nowrap;
    }
    .marquee-track span { padding: 0 22px; }
    .marquee-track .star { color: var(--yellow); padding: 0; }

    /* SECTIONS common */
    section { position: relative; }
    .section-inner {
      max-width: 1320px;
      margin: 0 auto;
      padding: clamp(52px,7vw,104px) clamp(18px,4vw,56px) clamp(40px,5vw,72px);
    }
    .eyebrow {
      font-weight: 700;
      font-size: 13px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--pink);
      margin: 0 0 16px;
    }
    h2 {
      font-family: "Inter", system-ui, sans-serif;
      font-weight: 400;
      font-size: clamp(34px, 4.6vw, 62px);
      line-height: 1.02;
      margin: 0;
    }
    h2 em { font-style: italic; }
    h2 .orange { color: var(--orange); }
    h2 .pink-em { color: var(--pink); }
    h2 .lime { color: var(--lime); }

    /* SERVICES */
    #services .section-inner { padding-bottom: clamp(40px,5vw,72px); }
    .services-header {
      display: flex;
      flex-wrap: wrap;
      align-items: flex-end;
      justify-content: space-between;
      gap: 24px;
      margin-bottom: clamp(32px, 4vw, 52px);
    }
    .services-sub {
      font-size: 16.5px;
      line-height: 1.55;
      color: rgba(236,232,241,0.78);
      max-width: 38ch;
      font-weight: 500;
    }
    .slider-hint {
      font-size: 14px;
      color: rgba(236,232,241,0.6);
      margin: 0 0 14px;
      font-weight: 600;
    }

    /* Before/After slider */
    .ba-slider {
      position: relative;
      width: 100%;
      height: clamp(500px, 60vw, 660px);
      border-radius: 24px;
      overflow: hidden;
      cursor: ew-resize;
      user-select: none;
      border: 1px solid rgba(43,34,54,0.14);
      box-shadow: 0 28px 56px -30px rgba(43,34,54,0.45);
    }
    .ba-after {
      position: absolute;
      inset: 0;
      background: var(--cream);
      color: var(--ink);
    }
    .ba-browser-bar {
      height: 40px;
      background: var(--peach);
      display: flex;
      align-items: center;
      gap: 7px;
      padding: 0 14px;
      border-bottom: 1px solid rgba(43,34,54,0.12);
    }
    .dot-red { width:11px;height:11px;border-radius:50%;background:var(--pink);border:1.5px solid var(--ink); }
    .dot-yellow { width:11px;height:11px;border-radius:50%;background:var(--yellow);border:1.5px solid var(--ink); }
    .dot-green { width:11px;height:11px;border-radius:50%;background:var(--lime);border:1.5px solid var(--ink); }
    .ba-url { margin-left:12px;font-size:12px;color:var(--ink);font-weight:600; }
    .ba-content { padding: clamp(16px,2.8vw,34px); }
    .ba-nav-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: clamp(16px,2.6vw,32px);
    }
    .ba-nav-row .brand { font-family:"Inter", system-ui, sans-serif;font-size:clamp(17px,2vw,22px); }
    .ba-nav-links { display:flex;align-items:center;gap:clamp(12px,2vw,26px); }
    .ba-nav-links span { font-size:12px;color:rgba(43,34,54,0.7);font-weight:600; }
    .ba-nav-cta { font-size:12px;color:#fff;font-weight:700;background:var(--ink);padding:8px 16px;border-radius:999px; }
    .ba-hero-grid { display:grid;grid-template-columns:1.18fr 0.82fr;gap:clamp(18px,3vw,40px);align-items:center; }
    .ba-tag {
      display:inline-block;font-size:11px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;
      color:var(--pink);background:rgba(237,63,140,0.1);padding:5px 12px;border-radius:999px;margin-bottom:16px;
    }
    .ba-h4 { font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:clamp(24px,4.2vw,48px);line-height:1.02;margin:0 0 14px;max-width:13ch; }
    .ba-p { font-size:clamp(12px,1.5vw,15px);line-height:1.55;color:rgba(43,34,54,0.65);margin:0 0 16px;max-width:34ch; }
    .ba-btns { display:flex;align-items:center;gap:12px;flex-wrap:wrap; }
    .ba-btn-primary { display:inline-block;background:var(--pink);color:#fff;font-size:12px;font-weight:700;padding:11px 22px;border-radius:999px;box-shadow:0 12px 24px -14px rgba(237,63,140,0.7); }
    .ba-btn-text { display:inline-block;color:var(--ink);font-size:12px;font-weight:700;padding:11px 6px;border-bottom:1.5px solid rgba(43,34,54,0.25); }
    .ba-stats { display:flex;gap:clamp(16px,3vw,34px);margin-top:clamp(16px,2.4vw,28px); }
    .ba-stat-num { font-family:"Inter", system-ui, sans-serif;font-size:clamp(18px,2.6vw,28px);line-height:1; }
    .ba-stat-label { font-size:10.5px;color:rgba(43,34,54,0.55);font-weight:600;margin-top:2px; }
    .ba-chart-box {
      position:relative;align-self:stretch;min-height:clamp(176px,21vw,246px);border-radius:18px;
      background:linear-gradient(150deg,#2B2236 0%,#4A3F63 100%);overflow:hidden;box-shadow:0 24px 44px -24px rgba(43,34,54,0.5);
    }
    .ba-chart-inner { position:absolute;inset:0;display:flex;flex-direction:column;padding:clamp(13px,1.5vw,17px) clamp(14px,1.6vw,18px); }
    .ba-chart-label { font-size:9.5px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:rgba(236,232,241,0.55); }
    .ba-chart-val { display:flex;align-items:baseline;gap:7px;margin-top:4px; }
    .ba-chart-val .big { font-family:"Inter", system-ui, sans-serif;font-size:clamp(19px,2.3vw,28px);line-height:1;color:var(--cream); }
    .ba-chart-badge { font-size:9.5px;font-weight:700;color:var(--ink);background:var(--lime);padding:2px 7px;border-radius:999px; }
    .ba-chart-legend { display:flex;align-items:center;gap:5px;font-size:8px;color:rgba(236,232,241,0.5); }
    .ba-chart-legend-dot { width:7px;height:7px;border-radius:2px;background:var(--pink); }
    .ba-chart-area { flex:1;min-height:0;display:flex;gap:7px;margin-top:11px; }
    .ba-chart-y { display:flex;flex-direction:column;justify-content:space-between;padding-bottom:15px;font-size:7.5px;color:rgba(236,232,241,0.42);text-align:right; }
    .ba-chart-graph { position:relative;flex:1; }
    .ba-chart-grid-top { position:absolute;left:0;right:0;top:0;bottom:15px; }
    .ba-chart-grid-top div { position:absolute;left:0;right:0;border-top:1px dashed rgba(236,232,241,0.12); }
    .ba-chart-grid-top div:nth-child(2) { top:50%; }
    .ba-chart-grid-top div:nth-child(3) { bottom:0;border-top:1px solid rgba(236,232,241,0.2); }
    .ba-bars { position:absolute;left:0;right:0;top:0;bottom:15px;display:flex;align-items:flex-end;gap:8px; }
    .ba-bar { flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%; }
    .ba-bar span { font-size:7px;font-weight:700;color:rgba(236,232,241,0.6);margin-bottom:2px; }
    .ba-bar-rect { width:100%;max-width:17px;border-radius:4px 4px 0 0; }
    .ba-x-labels { position:absolute;left:0;right:0;bottom:0;height:13px;display:flex;gap:8px;font-size:7.5px;color:rgba(236,232,241,0.45);text-align:center; }
    .ba-x-labels span { flex:1; }
    .after-badge {
      position:absolute;top:52px;right:24px;background:var(--lime);color:var(--ink);
      font-size:11px;font-weight:700;padding:6px 13px;border-radius:999px;letter-spacing:0.04em;border:1px solid rgba(43,34,54,0.12);
    }
    .ba-before {
      position:absolute;inset:0;
      background:#0a0a2a;
      background-image:linear-gradient(135deg,#1d1d6b,#06b6a0 60%,#7CFC00);
    }
    .ba-before-bar { height:38px;background:#000080;display:flex;align-items:center;gap:7px;padding:0 14px; }
    .ba-before-url { font-size:12px;color:#C0C0C0;font-family:Tahoma,Geneva,sans-serif; }
    .ba-before-content { padding:18px;text-align:center;font-family:'Comic Sans MS','Times New Roman',cursive;position:relative;height:calc(100% - 38px); }
    .ba-before-title { display:flex;justify-content:center;align-items:center;gap:8px; }
    .ba-before-h { font-family:'Comic Sans MS',cursive;font-weight:bold;font-size:clamp(20px,4.5vw,40px);color:#FFFF00;text-shadow:2px 2px 0 #FF00FF; }
    .ba-before-nav { margin:10px auto;display:inline-block;background:linear-gradient(#fff,#c0c0c0);border:2px outset #fff;padding:5px 14px;font-family:'Times New Roman',serif;font-size:13px;color:#000080;font-weight:bold; }
    .ba-before-p { font-family:'Times New Roman',serif;color:#fff;font-size:clamp(12px,1.8vw,15px);max-width:30ch;margin:14px auto;line-height:1.3; }
    .ba-before-counter { font-family:'Courier New',monospace;color:#00FF00;font-size:12px;background:#000;display:inline-block;padding:3px 8px;border:1px solid #0f0; }
    .ba-before-footer { position:absolute;bottom:14px;left:0;right:0;font-family:'Comic Sans MS',cursive;color:#fff;font-size:11px; }
    .ba-before-badge { position:absolute;top:8px;left:14px;background:#fff;color:#c00;font-size:11px;font-weight:700;padding:6px 12px;letter-spacing:0.04em;border:1px solid #c00; }
    .ba-handle {
      position:absolute;top:0;bottom:0;left:50%;width:3px;background:var(--ink);transform:translateX(-1.5px);pointer-events:none;
    }
    .ba-handle-btn {
      position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;
      background:var(--yellow);border:1px solid rgba(43,34,54,0.14);box-shadow:0 10px 22px -14px rgba(43,34,54,0.28);
      display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--ink);font-weight:700;
    }

    /* PRICING */
    #pricing .section-inner { padding: clamp(40px,5vw,72px) clamp(18px,4vw,56px); }
    .pricing-header { text-align:center;margin-bottom:clamp(32px,4vw,52px); }
    .pricing-eyebrow { font-weight:800;font-size:clamp(15px,1.8vw,20px);letter-spacing:0.2em;text-transform:uppercase;color:var(--pink);margin:0 0 16px; }
    .pricing-cards {
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));
      gap:clamp(18px,2.4vw,28px);
    }
    .price-card {
      position:relative;background:#fff;border:1px solid rgba(43,34,54,0.14);
      box-shadow:0 18px 38px -22px rgba(43,34,54,0.38);border-radius:20px;
      padding:clamp(28px,3vw,40px);overflow:hidden;color:var(--ink);
    }
    .price-card-top { position:absolute;top:0;left:0;right:0;height:6px; }
    .price-card-type {
      font-weight:700;font-size:12px;letter-spacing:0.16em;text-transform:uppercase;margin:6px 0 14px;
    }
    .price-amount { display:flex;align-items:baseline;gap:8px; }
    .price-amount .big { font-family:"Inter", system-ui, sans-serif;font-size:clamp(48px,6vw,72px);line-height:0.9;color:var(--ink); }
    .price-amount .per { font-size:16px;font-weight:600;color:rgba(43,34,54,0.55); }
    .price-desc { font-size:15.5px;line-height:1.55;color:rgba(43,34,54,0.78);margin:16px 0 0; }
    .pricing-extras {
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));
      gap:clamp(18px,2.4vw,28px);
      margin-top:clamp(18px,2.4vw,28px);
    }
    .extra-card {
      background:var(--cream);color:var(--ink);border:1px solid rgba(43,34,54,0.14);
      box-shadow:0 14px 30px -18px rgba(43,34,54,0.32);border-radius:16px;
      padding:clamp(24px,2.6vw,32px);
    }
    .extra-card h3 { font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:24px;margin:0 0 8px; }
    .extra-card p { font-size:13.5px;color:rgba(43,34,54,0.6);margin:0 0 16px;font-weight:500; }
    .extra-row {
      display:flex;align-items:center;justify-content:space-between;gap:12px;
      padding:12px 0;border-top:1px solid rgba(43,34,54,0.12);
    }
    .extra-row .name { font-size:15.5px;font-weight:600; }
    .badge-included { font-size:13px;font-weight:700;color:var(--teal);background:rgba(31,169,140,0.12);padding:5px 12px;border-radius:999px; }
    .extra-row .price-inline { font-family:"Inter", system-ui, sans-serif;font-size:22px;color:var(--ink); }
    .extra-row .price-rate { font-size:14px;font-weight:600;color:rgba(43,34,54,0.55); }
    .extra-note { font-size:13px;line-height:1.5;color:rgba(43,34,54,0.6);margin:8px 0 0; }

    /* SEO SECTION */
    #seo .section-inner { padding:clamp(40px,5vw,72px) clamp(14px,3vw,40px); }
    .seo-box {
      max-width:1320px;margin:0 auto;
      background:radial-gradient(120% 140% at 0% 0%, #7D5EC6 0%, #6B4FB0 48%, #5C42A0 100%);
      border:1px solid rgba(43,34,54,0.14);box-shadow:0 28px 56px -30px rgba(43,34,54,0.45);
      border-radius:28px;padding:clamp(34px,5vw,72px) clamp(24px,4vw,64px);color:var(--cream);
    }
    .seo-header { display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:22px;margin-bottom:clamp(28px,3.5vw,44px); }
    .seo-eyebrow { font-weight:700;font-size:13px;letter-spacing:0.22em;text-transform:uppercase;color:var(--yellow);margin:0 0 16px; }
    .seo-sub { font-size:16px;line-height:1.55;color:rgba(236,232,241,0.8);max-width:34ch;font-weight:500; }
    .seo-cols { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:clamp(30px,4vw,64px); }
    .seo-col { display:flex;gap:18px;align-items:flex-start; }
    .seo-col + .seo-col { border-left:1px solid rgba(236,232,241,0.2);padding-left:clamp(30px,4vw,56px); }
    .seo-icon { flex:none;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 24px -14px rgba(0,0,0,0.5); }
    .seo-col h3 { font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:25px;margin:6px 0 12px;color:var(--cream); }
    .seo-col p { font-size:15.5px;line-height:1.6;color:rgba(236,232,241,0.8);margin:0; }
    .seo-note {
      display:inline-flex;align-items:center;gap:11px;margin-top:clamp(30px,3.5vw,44px);
      background:rgba(236,232,241,0.1);border:1px solid rgba(236,232,241,0.2);border-radius:999px;
      padding:11px 20px 11px 16px;
    }
    .seo-note-dot { flex:none;width:8px;height:8px;border-radius:50%;background:var(--yellow); }
    .seo-note span { font-size:14px;line-height:1.45;color:rgba(236,232,241,0.78);font-style:italic;font-family:"Inter", system-ui, sans-serif; }

    /* PROCESS */
    #process .section-inner { padding:clamp(40px,5vw,72px) clamp(18px,4vw,56px); }
    .process-header { margin-bottom:clamp(36px,5vw,56px); }
    .process-steps { display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:clamp(22px,2.6vw,32px); }
    .step-num {
      width:62px;height:62px;border-radius:50%;
      border:1px solid rgba(43,34,54,0.14);box-shadow:0 10px 22px -14px rgba(43,34,54,0.28);
      display:flex;align-items:center;justify-content:center;
      font-family:"Inter", system-ui, sans-serif;font-size:28px;margin-bottom:18px;
    }
    .step h3 { font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:22px;margin:0 0 8px; }
    .step p { font-size:15px;line-height:1.55;color:rgba(236,232,241,0.72);margin:0; }

    /* FAQ */
    #faq { padding:clamp(40px,5vw,72px) clamp(14px,3vw,40px); }
    .faq-box {
      max-width:1040px;margin:0 auto;background:var(--pink);
      border:1px solid rgba(43,34,54,0.14);box-shadow:0 28px 56px -30px rgba(43,34,54,0.45);
      border-radius:28px;padding:clamp(34px,5vw,68px) clamp(24px,4vw,56px);color:#fff;
    }
    .faq-eyebrow { font-weight:700;font-size:13px;letter-spacing:0.22em;text-transform:uppercase;color:var(--yellow);margin:0 0 16px;text-align:center; }
    .faq-box h2 { text-align:center;margin-bottom:clamp(32px,4vw,48px); }
    .faq-list { display:flex;flex-direction:column;gap:14px; }
    .faq-item {
      background:#fff;color:var(--ink);border:1px solid rgba(43,34,54,0.14);
      box-shadow:0 14px 30px -18px rgba(43,34,54,0.32);border-radius:13px;overflow:hidden;
    }
    .faq-btn {
      width:100%;background:none;border:none;cursor:pointer;
      display:flex;justify-content:space-between;align-items:center;gap:16px;
      padding:20px 22px;text-align:left;
    }
    .faq-btn span:first-child { font-size:clamp(16px,1.7vw,18px);font-weight:600;color:var(--ink); }
    .faq-toggle {
      flex-shrink:0;width:30px;height:30px;border-radius:50%;background:var(--pink);
      border:1px solid rgba(43,34,54,0.12);color:#fff;font-size:22px;line-height:1;
      display:flex;align-items:center;justify-content:center;
    }
    .faq-answer { display:none;padding:0 22px 22px; }
    .faq-answer p { font-size:15.5px;line-height:1.6;color:rgba(43,34,54,0.82);margin:0;max-width:64ch; }
    .faq-item.open .faq-answer { display:block; }
    .faq-item.open .faq-toggle { background:var(--ink); }

    /* CTA */
    #quote { padding:clamp(40px,5vw,72px) clamp(14px,3vw,40px) clamp(52px,7vw,104px); }
    .cta-box {
      max-width:1320px;margin:0 auto;background:var(--orange);
      border:1px solid rgba(43,34,54,0.14);box-shadow:0 28px 56px -30px rgba(43,34,54,0.45);
      border-radius:28px;padding:clamp(56px,8vw,120px) clamp(24px,4vw,64px);
      text-align:center;position:relative;overflow:hidden;
    }
    .cta-eyebrow { font-weight:700;font-size:13px;letter-spacing:0.22em;text-transform:uppercase;color:#fff;margin:0 0 18px; }
    .cta-box h2 { color:var(--ink);margin:0 auto;max-width:18ch; }
    .cta-box h2 em { color:#fff; }
    .cta-sub { font-size:clamp(16px,1.6vw,19px);line-height:1.55;color:rgba(43,34,54,0.85);max-width:48ch;margin:22px auto 0;font-weight:500; }
    .cta-btns { display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:34px; }
    .btn-dark { text-decoration:none;background:var(--ink);color:#fff;font-size:15px;font-weight:700;padding:15px 34px;border-radius:999px;border:1px solid rgba(43,34,54,0.14);box-shadow:0 16px 34px -18px rgba(43,34,54,0.55);transition:transform .15s;display:inline-block; }
    .btn-dark:hover { transform:translateY(-3px); }
    .btn-white { text-decoration:none;background:#fff;color:var(--ink);font-size:15px;font-weight:700;padding:15px 30px;border-radius:999px;border:1px solid rgba(43,34,54,0.14);box-shadow:0 14px 30px -18px rgba(43,34,54,0.32);transition:transform .15s;display:inline-block;cursor:pointer; }
    .btn-white:hover { transform:translateY(-3px); }

    /* CONTACT FORM */
    .contact-form { max-width:560px;margin:34px auto 0;text-align:left; }
    .form-row { display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px; }
    .form-field { display:flex;flex-direction:column;gap:6px;margin-bottom:14px; }
    .form-field label { font-size:12px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--ink); }
    .form-field input, .form-field textarea {
      width:100%;font-family:"Inter",sans-serif;font-size:15px;color:var(--ink);
      background:rgba(255,255,255,0.92);border:1.5px solid rgba(43,34,54,0.2);border-radius:12px;
      padding:13px 16px;outline:none;transition:border-color .15s,box-shadow .15s;
    }
    .form-field input::placeholder, .form-field textarea::placeholder { color:rgba(43,34,54,0.4); }
    .form-field input:focus, .form-field textarea:focus { border-color:var(--ink);box-shadow:0 0 0 3px rgba(43,34,54,0.12); }
    .form-field textarea { resize:vertical;min-height:110px; }
    .form-submit {
      width:100%;background:var(--ink);color:#fff;font-family:"Inter",sans-serif;font-size:15px;font-weight:700;
      padding:16px 30px;border:1px solid rgba(43,34,54,0.14);border-radius:999px;cursor:pointer;
      box-shadow:0 16px 34px -18px rgba(43,34,54,0.55);transition:transform .15s;margin-top:6px;
    }
    .form-submit:hover { transform:translateY(-3px); }
    .form-submit:disabled { opacity:0.6;cursor:not-allowed;transform:none; }
    .form-status { font-size:14px;font-weight:600;margin-top:14px;min-height:20px;color:var(--ink); }
    .form-status.success { color:#0a6e3b; }
    .form-status.error { color:#9c1b2e; }
    .form-alt { font-size:13px;color:rgba(43,34,54,0.7);text-align:center;margin-top:16px; }
    .form-alt a { color:var(--ink);font-weight:700; }
    @media (max-width:520px) { .form-row { grid-template-columns:1fr; } }

    /* FOOTER */
    footer { background:var(--ink);color:var(--cream); }
    .footer-inner { max-width:1320px;margin:0 auto;padding:clamp(44px,6vw,68px) clamp(18px,4vw,56px); }
    .footer-top {
      display:flex;flex-wrap:wrap;justify-content:space-between;gap:34px;
      padding-bottom:36px;border-bottom:2px solid rgba(236,232,241,0.22);
    }
    .footer-brand { max-width:32ch; }
    .footer-logo { display:flex;align-items:flex-end;margin-bottom:14px;font-family:"Inter",sans-serif;font-weight:700;font-size:30px;line-height:1;letter-spacing:-0.04em; }
    .footer-tagline { font-size:15px;line-height:1.55;color:rgba(236,232,241,0.62);margin:0; }
    .footer-links { display:flex;gap:clamp(36px,6vw,84px);flex-wrap:wrap; }
    .footer-col { display:flex;flex-direction:column;gap:11px; }
    .footer-col-title { font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(236,232,241,0.45);font-weight:700; }
    .footer-col a { text-decoration:none;color:var(--cream);font-size:15px;font-weight:500;transition:color .15s; }
    .footer-col a:hover { color:var(--yellow); }
    .footer-bottom {
      display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;
      padding-top:22px;font-size:13px;color:rgba(236,232,241,0.5);
    }
    .footer-tagline-end { font-family:"Inter", system-ui, sans-serif;font-style:italic;font-size:18px;color:rgba(236,232,241,0.85); }

    /* Responsive nav */
    @media (max-width: 700px) {
      nav { display: none; flex-direction: column; position: absolute; top: 100%; left: 0; right: 0; background: rgba(43,34,54,0.97); padding: 16px clamp(18px,4vw,56px); gap: 14px; border-bottom: 1px solid rgba(236,232,241,0.14); }
      nav.open { display: flex; }
      .nav-mobile-toggle { display: block; }
      .ba-hero-grid { grid-template-columns: 1fr; }
      .ba-chart-box { display: none; }
      .seo-col + .seo-col { border-left: none; padding-left: 0; border-top: 1px solid rgba(236,232,241,0.2); padding-top: clamp(30px,4vw,56px); }
    }
  
/* --- Clickt Studio brand type layer --- */
.hero-title,.section-title,[class*="-title"],[class*="headline"],h1,h2,h3{font-weight:800;letter-spacing:-0.04em;}
.hero-eyebrow,.section-eyebrow,.cta-eyebrow,.included-eyebrow,.calc-label,.calc-result-label,.badge-included,.footer-tagline,.footer-tagline-end,.label,.eyebrow{font-family:"JetBrains Mono",ui-monospace,monospace;letter-spacing:.04em;text-transform:uppercase;}

/* --- Clickt Studio: recolor template SVGs to brand --- */
[fill="#ED3F8C"]{fill:#897B9E !important;} [stroke="#ED3F8C"]{stroke:#897B9E !important;}
[fill="#F26321"]{fill:#F86B3C !important;} [stroke="#F26321"]{stroke:#F86B3C !important;}
[fill="#FFC23C"]{fill:#C7BDD5 !important;} [stroke="#FFC23C"]{stroke:#C7BDD5 !important;}
[fill="#BCE05A"]{fill:#897B9E !important;} [stroke="#BCE05A"]{stroke:#897B9E !important;}
[fill="#6B4FB0"]{fill:#4E4060 !important;} [stroke="#6B4FB0"]{stroke:#4E4060 !important;}
[fill="#1FA98C"]{fill:#4E4060 !important;} [stroke="#1FA98C"]{stroke:#4E4060 !important;}
