:root{
    --cream:#FFF7F0;
    --paper:#FFFFFF;
    --ink:#2A2222;
    --ink-soft:#6B5D57;
    --pink:#F9A8C4;
    --pink-deep:#E2547E;
    --pink-soft:#FFE9F1;
    --teal:#2BB5A5;
    --teal-deep:#0E8C80;
    --teal-soft:#DDF5F1;
    --yellow:#FFD166;
    --lilac:#C9B6F0;
    --border:3px solid var(--ink);
    --shadow:6px 6px 0 var(--ink);
    --shadow-sm:4px 4px 0 var(--ink);
    --shadow-lg:10px 10px 0 var(--ink);
    --radius:22px;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    font-family:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
    background:var(--cream);
    color:var(--ink);
    overflow-x:hidden;
    line-height:1.6;
  }
  ::selection{background:var(--pink);color:var(--ink)}
  section{scroll-margin-top:90px;position:relative;z-index:2}
  img{max-width:100%;display:block}

  /* ---------- sistem ikon ---------- */
  .icn{
    width:18px;height:18px;flex:none;display:inline-block;vertical-align:-.18em;
    fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;
  }
  .icn-xs{width:14px;height:14px}
  .icn-sm{width:16px;height:16px}
  .icn-md{width:22px;height:22px}
  .icn-lg{width:28px;height:28px}
  .icn-xl{width:46px;height:46px}

  /* ---------- kelopak sakura ---------- */
  #petals{position:fixed;inset:0;pointer-events:none;z-index:1;overflow:hidden}
  .petal{position:absolute;top:-50px;animation:fall linear infinite;opacity:.75;user-select:none}
  .petal svg{display:block}
  .sway{animation:sway 3.5s ease-in-out infinite alternate}
  @keyframes fall{
    0%{transform:translateY(-5vh) rotate(0deg)}
    100%{transform:translateY(110vh) rotate(360deg)}
  }
  @keyframes sway{from{margin-left:-18px}to{margin-left:18px}}

  /* ---------- navigasi ---------- */
  nav{
    position:sticky;top:0;z-index:50;
    background:rgba(255,247,240,.92);
    backdrop-filter:blur(8px);
    border-bottom:var(--border);
    transition:box-shadow .25s;
  }
  nav.scrolled{box-shadow:0 4px 0 rgba(42,34,34,.12)}
  .nav-inner{
    max-width:1120px;margin:0 auto;padding:14px 22px;
    display:flex;align-items:center;gap:18px;
  }
  .logo{display:flex;align-items:center;gap:10px;font-weight:900;font-size:1.15rem;text-decoration:none;color:var(--ink)}
  .logo .ic{
    width:40px;height:40px;border:var(--border);border-radius:12px;
    background:var(--pink);display:grid;place-items:center;color:var(--ink);
    box-shadow:3px 3px 0 var(--ink);flex:none;
  }
  .logo b{color:var(--pink-deep)}
  .logo .bot{color:var(--teal-deep)}
  .nav-links{display:flex;gap:4px;margin-left:auto;align-items:center}
  .nav-links a{
    text-decoration:none;color:var(--ink);font-weight:700;font-size:.92rem;
    padding:8px 13px;border-radius:999px;transition:.2s;
  }
  .nav-links a:hover{background:var(--pink-soft);transform:translateY(-1px)}
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:9px;
    font-weight:800;text-decoration:none;color:var(--ink);
    border:var(--border);border-radius:999px;
    padding:11px 22px;background:var(--paper);
    box-shadow:var(--shadow-sm);cursor:pointer;
    transition:transform .15s,box-shadow .15s;
    font-size:.95rem;line-height:1.3;font-family:inherit;
  }
  .btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
  .btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
  .btn-pink{background:var(--pink)}
  .btn-teal{background:var(--teal);color:#fff}
  .btn-yellow{background:var(--yellow)}
  .btn-lg{padding:15px 30px;font-size:1.05rem;box-shadow:var(--shadow)}
  .nav-cta{margin-left:6px}
  #navToggle{
    display:none;margin-left:auto;background:var(--paper);border:var(--border);
    border-radius:12px;width:44px;height:44px;cursor:pointer;
    box-shadow:3px 3px 0 var(--ink);color:var(--ink);
    display:none;place-items:center;
  }

  /* ---------- hero ---------- */
  .wrap{max-width:1120px;margin:0 auto;padding:0 22px}
  .hero{padding:64px 0 80px}
  .hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
  .badge{
    display:inline-flex;align-items:center;gap:9px;
    background:var(--teal-soft);border:var(--border);border-radius:999px;
    padding:7px 16px;font-weight:800;font-size:.85rem;box-shadow:var(--shadow-sm);
  }
  .dot{width:11px;height:11px;border-radius:50%;background:#2ecc71;border:2.5px solid var(--ink);animation:pulse 1.6s infinite}
  @keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(46,204,113,.6)}50%{box-shadow:0 0 0 7px rgba(46,204,113,0)}}
  h1{
    font-size:clamp(2.3rem,5.2vw,3.6rem);line-height:1.12;font-weight:900;
    margin:22px 0 18px;letter-spacing:-.5px;
  }
  h1 .icn{width:.75em;height:.75em;vertical-align:-.06em}
  .hl{
    color:var(--pink-deep);position:relative;white-space:nowrap;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M2 10 Q 15 2, 30 9 T 60 9 T 90 9 T 118 8' fill='none' stroke='%23F9A8C4' stroke-width='7' stroke-linecap='round'/%3E%3C/svg%3E") bottom/100% .34em no-repeat;
    padding-bottom:.12em;
  }
  .hl-teal{color:var(--teal-deep)}
  .hero p.lead{font-size:1.1rem;color:var(--ink-soft);max-width:46ch;margin-bottom:28px}
  .cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px}
  .mini-stats{display:flex;gap:10px;flex-wrap:wrap}
  .mini-stats span{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--paper);border:var(--border);border-radius:999px;
    padding:6px 14px;font-weight:700;font-size:.85rem;box-shadow:3px 3px 0 var(--ink);
  }
  .mini-stats .icn{color:var(--pink-deep)}
  .hero-art{position:relative}
  .hero-art .frame{
    border:var(--border);border-radius:28px;overflow:hidden;
    box-shadow:var(--shadow-lg);transform:rotate(2deg);
    background:var(--pink-soft);
  }
  .hero-art .frame img{width:100%;height:100%;object-fit:cover}
  .float-chip{
    position:absolute;border:var(--border);border-radius:14px;
    background:var(--paper);padding:9px 14px;font-weight:800;font-size:.88rem;
    box-shadow:var(--shadow-sm);animation:floaty 3.6s ease-in-out infinite;
    white-space:nowrap;display:flex;align-items:center;gap:10px;
  }
  .float-chip .fc-ic{
    width:30px;height:30px;border:2.5px solid var(--ink);border-radius:10px;
    display:grid;place-items:center;flex:none;
  }
  .float-chip small{display:block;font-weight:600;color:var(--ink-soft);font-size:.7rem;line-height:1.25}
  .fc1{top:6%;left:-8%;animation-delay:0s;background:var(--yellow);transform:rotate(-4deg)}
  .fc2{bottom:22%;right:-6%;animation-delay:1.2s;background:var(--teal);color:#fff;transform:rotate(3deg)}
  .fc2 .fc-ic{background:rgba(255,255,255,.18);color:#fff}
  .fc2 small{color:#eafffb}
  .fc3{bottom:-4%;left:4%;animation-delay:2s;background:var(--pink);transform:rotate(-2deg)}
  @keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -12px}}

  /* ---------- marquee ---------- */
  .marquee{
    background:var(--pink);border-top:var(--border);border-bottom:var(--border);
    transform:rotate(-1.2deg) scale(1.02);margin:10px 0 0;overflow:hidden;
    position:relative;z-index:3;
  }
  .marquee-track{
    display:flex;width:max-content;animation:scrollx 26s linear infinite;
    padding:13px 0;font-weight:900;letter-spacing:2px;font-size:.95rem;
  }
  .mq{display:inline-flex;align-items:center;gap:22px;padding:0 12px;white-space:nowrap}
  .mq .icn{color:var(--ink);animation:spin 7s linear infinite}
  @keyframes spin{to{transform:rotate(360deg)}}
  @keyframes scrollx{from{transform:translateX(0)}to{transform:translateX(-50%)}}

  /* ---------- heading section ---------- */
  .sec{padding:86px 0}
  .sec-head{text-align:center;max-width:640px;margin:0 auto 52px}
  .sec-tag{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--yellow);border:var(--border);
    border-radius:999px;padding:5px 16px;font-weight:900;font-size:.8rem;
    letter-spacing:2.5px;box-shadow:3px 3px 0 var(--ink);margin-bottom:16px;
  }
  h2{font-size:clamp(1.7rem,3.4vw,2.4rem);font-weight:900;line-height:1.2;margin-bottom:12px}
  .sec-head p{color:var(--ink-soft)}

  /* ---------- fitur ---------- */
  .features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
  .card{
    background:var(--paper);border:var(--border);border-radius:var(--radius);
    padding:26px;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s;
  }
  .card:hover{transform:translate(-3px,-3px) rotate(0deg)!important;box-shadow:12px 12px 0 var(--ink)}
  .card:nth-child(odd){transform:rotate(-1.2deg)}
  .card:nth-child(even){transform:rotate(1.2deg)}
  .card .ico{
    width:58px;height:58px;border:var(--border);border-radius:16px;
    display:grid;place-items:center;margin-bottom:16px;
    box-shadow:3px 3px 0 var(--ink);color:var(--ink);
  }
  .card .ico .icn{width:28px;height:28px}
  .card h3{font-size:1.15rem;margin-bottom:8px;font-weight:800}
  .card p{color:var(--ink-soft);font-size:.94rem}
  .card ul{list-style:none;margin-top:12px}
  .card li{
    font-size:.88rem;font-weight:600;padding:4px 0 4px 24px;position:relative;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1c2.7 2.4 4 5 4 7.4C12 12 10 15 8 15s-4-3-4-6.6C4 6 5.3 3.4 8 1z' fill='%23F9A8C4' stroke='%232A2222' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat left 6px/11px;
  }
  .bg-pink{background:var(--pink-soft)}
  .bg-teal{background:var(--teal-soft)}
  .bg-yellow{background:#FFF3D6}
  .bg-lilac{background:#F0EAFD}

  /* ---------- demo chat ---------- */
  .demo-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:48px;align-items:center}
  .phone{
    border:var(--border);border-radius:34px;background:var(--cream);
    box-shadow:var(--shadow-lg);overflow:hidden;max-width:390px;margin:0 auto;
    width:100%;
  }
  .phone-head{
    background:var(--teal);border-bottom:var(--border);
    display:flex;align-items:center;gap:11px;padding:13px 15px;color:#fff;
  }
  .phone-head .ava{
    width:42px;height:42px;border-radius:50%;border:2.5px solid var(--ink);
    overflow:hidden;flex:none;background:var(--pink-soft);
  }
  .phone-head .ava img{width:100%;height:100%;object-fit:cover}
  .phone-head .nm{font-weight:800;font-size:.98rem;line-height:1.2}
  .phone-head .st{font-size:.75rem;opacity:.92;display:flex;align-items:center;gap:5px}
  .phone-head .st::before{content:"";width:7px;height:7px;background:#B7F5C4;border-radius:50%;display:inline-block}
  .phone-head .ph-icons{margin-left:auto;display:flex;gap:12px}
  .chat-box{
    height:400px;overflow-y:auto;padding:16px 13px;
    background:
      radial-gradient(circle at 12px 12px, rgba(233,150,180,.16) 2.5px, transparent 3px);
    background-size:42px 42px;
    background-color:var(--cream);
    display:flex;flex-direction:column;gap:10px;
  }
  .msg{
    max-width:82%;padding:9px 13px;border:2.5px solid var(--ink);
    border-radius:16px;font-size:.88rem;position:relative;
    box-shadow:2.5px 2.5px 0 rgba(42,34,34,.9);
    white-space:pre-line;word-wrap:break-word;
    animation:pop .25s ease-out;
  }
  @keyframes pop{from{transform:scale(.9) translateY(8px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}
  .msg.bot{align-self:flex-start;background:#fff;border-bottom-left-radius:5px}
  .msg.me{align-self:flex-end;background:var(--pink);border-bottom-right-radius:5px}
  .msg .t{display:block;font-size:.62rem;opacity:.6;text-align:right;margin-top:3px;font-weight:600}
  .typing{
    align-self:flex-start;background:#fff;border:2.5px solid var(--ink);
    border-radius:16px;border-bottom-left-radius:5px;padding:11px 15px;
    display:none;gap:4px;box-shadow:2.5px 2.5px 0 rgba(42,34,34,.9);
  }
  .typing.show{display:inline-flex;animation:pop .2s ease-out}
  .typing i{width:7px;height:7px;background:var(--ink);border-radius:50%;animation:blink 1s infinite}
  .typing i:nth-child(2){animation-delay:.2s}
  .typing i:nth-child(3){animation-delay:.4s}
  @keyframes blink{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
  .chips{display:flex;gap:7px;flex-wrap:wrap;padding:10px 12px;border-top:2.5px dashed var(--ink);background:var(--paper)}
  .chips button{
    border:2px solid var(--ink);background:var(--pink-soft);border-radius:999px;
    padding:5px 12px;font-weight:700;font-size:.78rem;cursor:pointer;
    transition:.15s;font-family:inherit;color:var(--ink);
  }
  .chips button:hover{background:var(--pink);transform:translateY(-2px)}
  .chat-input{
    display:flex;gap:8px;padding:11px 12px;border-top:var(--border);background:var(--paper);
  }
  .chat-input input{
    flex:1;border:2.5px solid var(--ink);border-radius:999px;padding:10px 16px;
    font-size:.9rem;font-family:inherit;background:var(--cream);outline:none;font-weight:600;
  }
  .chat-input input:focus{background:#fff}
  .chat-input button{
    width:44px;height:44px;flex:none;border:var(--border);border-radius:50%;
    background:var(--teal);cursor:pointer;color:#fff;
    box-shadow:2.5px 2.5px 0 var(--ink);transition:.15s;display:grid;place-items:center;
  }
  .chat-input button:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
  .demo-side h2{text-align:left}
  .demo-side>p{color:var(--ink-soft);margin-bottom:20px}
  .demo-list{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:24px}
  .demo-list li{
    display:flex;gap:12px;align-items:flex-start;font-size:.95rem;font-weight:600;
  }
  .demo-list .n{
    flex:none;width:30px;height:30px;border:2.5px solid var(--ink);border-radius:10px;
    display:grid;place-items:center;font-weight:900;font-size:.85rem;
    box-shadow:2px 2px 0 var(--ink);
  }
  code.kbd{
    background:var(--ink);color:var(--pink);border-radius:7px;padding:2px 8px;
    font-size:.85em;font-weight:700;
  }

  /* ---------- explorer menu ---------- */
  .explorer-tools{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-bottom:30px}
  .search-wrap{position:relative}
  .search-wrap .icn{
    position:absolute;left:15px;top:50%;transform:translateY(-50%);
    width:17px;height:17px;color:var(--ink);pointer-events:none;
  }
  .search-wrap input{
    border:var(--border);border-radius:999px;padding:12px 18px 12px 44px;
    font-size:.95rem;font-family:inherit;font-weight:600;background:var(--paper);
    outline:none;width:290px;box-shadow:var(--shadow-sm);
  }
  .tabs{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
  .tabs button{
    border:2.5px solid var(--ink);background:var(--paper);border-radius:999px;
    padding:8px 16px;font-weight:800;font-size:.85rem;cursor:pointer;font-family:inherit;
    transition:.15s;color:var(--ink);box-shadow:2.5px 2.5px 0 var(--ink);
  }
  .tabs button:hover{transform:translateY(-2px)}
  .tabs button.active{background:var(--ink);color:var(--pink)}
  .cmd-count{text-align:center;font-weight:700;color:var(--ink-soft);margin-bottom:24px;font-size:.9rem}
  .cmd-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  .cmd{
    background:var(--paper);border:2.5px solid var(--ink);border-radius:16px;
    padding:14px 16px;box-shadow:var(--shadow-sm);transition:.15s;
    display:flex;flex-direction:column;gap:5px;
  }
  .cmd:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink);background:var(--pink-soft)}
  .cmd code{
    align-self:flex-start;background:var(--ink);color:var(--pink);padding:3px 10px;
    border-radius:8px;font-weight:800;font-size:.9rem;
  }
  .cmd p{font-size:.85rem;color:var(--ink-soft);font-weight:600}
  .cmd .cat{
    align-self:flex-start;font-size:.66rem;font-weight:900;letter-spacing:1px;
    text-transform:uppercase;border:2px solid var(--ink);border-radius:999px;padding:1px 9px;
  }
  .cat-umum{background:var(--yellow)}
  .cat-media{background:var(--pink)}
  .cat-down{background:var(--teal);color:#fff}
  .cat-ai{background:var(--lilac)}
  .cat-grup{background:#BFE3FF}
  .cat-fun{background:#FFD3B6}
  .cat-owner{background:var(--ink);color:var(--pink)}
  .empty{
    grid-column:1/-1;text-align:center;font-weight:700;color:var(--ink-soft);
    border:2.5px dashed var(--ink);border-radius:var(--radius);padding:34px;
    display:flex;flex-direction:column;align-items:center;gap:10px;
  }

  /* ---------- cara pakai ---------- */
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;position:relative}
  .step{
    background:var(--paper);border:var(--border);border-radius:var(--radius);
    padding:30px 26px;box-shadow:var(--shadow);text-align:center;position:relative;
  }
  .step .num{
    position:absolute;top:-20px;left:50%;transform:translateX(-50%);
    width:44px;height:44px;border:var(--border);border-radius:50%;
    display:grid;place-items:center;font-weight:900;font-size:1.15rem;
    box-shadow:3px 3px 0 var(--ink);background:var(--paper);
  }
  .step .big{
    width:74px;height:74px;margin:14px auto 12px;border:var(--border);border-radius:20px;
    display:grid;place-items:center;box-shadow:3px 3px 0 var(--ink);
  }
  .step h3{font-size:1.08rem;margin-bottom:8px;font-weight:800}
  .step p{color:var(--ink-soft);font-size:.92rem}
  .steps-cta{text-align:center;margin-top:46px}
  .steps-cta .btn{margin:0 8px 12px}

  /* ---------- stats band ---------- */
  .stats-band{
    background:var(--teal);border-top:var(--border);border-bottom:var(--border);
    padding:56px 0;
  }
  .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
  .stat b{
    display:block;font-size:clamp(1.9rem,4vw,2.7rem);font-weight:900;color:#fff;
    text-shadow:3px 3px 0 rgba(42,34,34,.85);
  }
  .stat span{
    display:inline-flex;align-items:center;gap:7px;margin-top:8px;background:#fff;
    border:2.5px solid var(--ink);border-radius:999px;padding:4px 15px;
    font-weight:800;font-size:.83rem;box-shadow:3px 3px 0 var(--ink);
  }
  .stat .icn{color:var(--pink-deep)}

  /* ---------- FAQ ---------- */
  .faq-list{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:16px}
  details{
    background:var(--paper);border:var(--border);border-radius:18px;
    box-shadow:var(--shadow-sm);overflow:hidden;
  }
  details[open]{box-shadow:var(--shadow)}
  summary{
    cursor:pointer;list-style:none;padding:18px 22px;font-weight:800;
    display:flex;align-items:center;gap:14px;font-size:1rem;
  }
  summary::-webkit-details-marker{display:none}
  summary::after{
    content:"+";margin-left:auto;width:32px;height:32px;flex:none;
    border:2.5px solid var(--ink);border-radius:10px;display:grid;place-items:center;
    background:var(--pink-soft);font-weight:900;transition:.2s;
  }
  details[open] summary::after{content:"−";background:var(--pink);transform:rotate(180deg)}
  details .a{padding:0 22px 20px;color:var(--ink-soft);font-size:.94rem}
  details .a code{background:var(--pink-soft);border:1.5px solid var(--ink);border-radius:6px;padding:1px 7px;font-weight:700;font-size:.85em}

  /* ---------- owner ---------- */
  .owner-grid{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center;
    background:var(--paper);border:var(--border);border-radius:28px;box-shadow:var(--shadow-lg);
    padding:44px;max-width:860px;margin:0 auto;transform:rotate(-.6deg)}
  .owner-ava{
    width:150px;height:150px;border:var(--border);border-radius:30px;
    background:var(--pink);box-shadow:var(--shadow);transform:rotate(3deg);
    overflow:hidden;
  }
  .owner-ava img{width:100%;height:100%;object-fit:cover;display:block}
  .owner-badge{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--yellow);border:2.5px solid var(--ink);
    border-radius:999px;padding:4px 14px;font-weight:900;font-size:.75rem;
    letter-spacing:1.5px;box-shadow:2.5px 2.5px 0 var(--ink);margin-bottom:10px;
  }
  .owner-badge .icn{color:var(--pink-deep)}
  .owner-grid h3{font-size:1.8rem;font-weight:900}
  .owner-grid p{color:var(--ink-soft);margin:10px 0 18px;max-width:52ch}
  .owner-chips{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:22px}
  .owner-chips span{
    display:inline-flex;align-items:center;gap:7px;
    border:2.5px solid var(--ink);border-radius:999px;padding:4px 13px;
    font-weight:700;font-size:.82rem;background:var(--pink-soft);
  }
  .owner-chips .icn{color:var(--teal-deep)}

  /* ---------- footer ---------- */
  footer{
    background:var(--ink);color:#F6E9E1;margin-top:86px;border-top:var(--border);
    padding:54px 0 26px;position:relative;z-index:2;
  }
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px;margin-bottom:36px}
  footer .logo{color:#fff}
  footer .logo .ic{background:var(--pink-deep)}
  footer p{opacity:.75;font-size:.9rem;max-width:38ch}
  footer h4{font-size:.85rem;letter-spacing:2px;text-transform:uppercase;margin-bottom:14px;color:var(--pink)}
  footer ul{list-style:none;display:flex;flex-direction:column;gap:9px}
  footer a{color:#F6E9E1;text-decoration:none;opacity:.85;font-size:.93rem;font-weight:600;display:inline-flex;align-items:center;gap:8px}
  footer a:hover{opacity:1;color:var(--pink)}
  footer a .icn{width:15px;height:15px}
  .heart-line{display:inline-flex;align-items:center;gap:6px}
  .heart-line .icn{color:var(--pink);vertical-align:middle}
  .foot-bottom{
    border-top:1.5px dashed rgba(246,233,225,.35);padding-top:22px;
    display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
    font-size:.83rem;opacity:.75;
  }

  /* ---------- reveal ---------- */
  .js .reveal{opacity:0;transform:translateY(28px);transition:opacity .6s ease,transform .6s ease}
  .js .reveal.in{opacity:1;transform:translateY(0)}

  /* ---------- responsif ---------- */
  @media (max-width:960px){
    .hero-grid{grid-template-columns:1fr;gap:40px}
    .hero{padding:44px 0 60px;text-align:center}
    .hero p.lead{margin:0 auto 26px}
    .cta-row,.mini-stats{justify-content:center}
    .hero-art{max-width:420px;margin:0 auto}
    .fc1{left:-4%}
    .fc2{right:-3%}
    .features-grid,.cmd-grid,.steps{grid-template-columns:repeat(2,1fr)}
    .demo-grid{grid-template-columns:1fr;gap:40px}
    .stats-grid{grid-template-columns:repeat(2,1fr)}
    .owner-grid{grid-template-columns:1fr;text-align:center;transform:none}
    .owner-grid p{margin-left:auto;margin-right:auto}
    .owner-chips,.owner-grid .btn{justify-content:center;margin-left:auto;margin-right:auto}
    .foot-grid{grid-template-columns:1fr 1fr}
  }
  @media (max-width:640px){
    .nav-links{
      display:none;position:absolute;top:100%;left:0;right:0;
      background:var(--cream);border-bottom:var(--border);
      flex-direction:column;align-items:stretch;padding:14px 22px;gap:4px;
    }
    .nav-links.open{display:flex}
    .nav-links a{padding:12px 14px}
    #navToggle{display:grid;margin-left:auto}
    .nav-inner > .logo{margin-right:auto}
    .nav-cta{display:none}
    .features-grid,.cmd-grid,.steps{grid-template-columns:1fr}
    .card:nth-child(odd),.card:nth-child(even){transform:rotate(0)}
    .sec{padding:60px 0}
    .owner-ava{margin:0 auto}
  }