/* Web Mosis – "How it works" page (4.3: a page you scroll, FAQ accordion at the end) */
.dk-sec{padding:14px 0 30px}
.hw-stack{display:grid;gap:18px}
.dk{position:relative;border-radius:26px;background:linear-gradient(160deg,#0d2b4a 0%,#0a1c30 62%,#08182a 100%);color:#fff;box-shadow:0 40px 80px -46px rgba(11,37,64,.6);isolation:isolate;overflow:hidden;scroll-margin-top:96px}
.dk::before{content:"";position:absolute;inset:0;z-index:-1;background:
  radial-gradient(60% 50% at 88% 0%,rgba(34,195,189,.24),transparent 70%),
  radial-gradient(50% 45% at 0% 100%,rgba(31,95,148,.4),transparent 70%),
  repeating-linear-gradient(0deg,rgba(255,255,255,.028) 0 1px,transparent 1px 44px),
  repeating-linear-gradient(90deg,rgba(255,255,255,.028) 0 1px,transparent 1px 44px)}
.dk-glow{position:absolute;z-index:-1;width:320px;height:320px;border-radius:50%;inset-inline-start:2%;top:34%;background:radial-gradient(circle,rgba(34,195,189,.2),transparent 65%);filter:blur(10px);pointer-events:none}
.dk-num{position:absolute;z-index:-1;top:4px;inset-inline-end:20px;font-family:"DM Sans",system-ui,sans-serif;font-weight:800;font-size:clamp(4.6rem,14vw,9.5rem);line-height:1;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px rgba(127,224,216,.15);direction:ltr;pointer-events:none;user-select:none}
.dk-s{display:flex;flex-direction:column;justify-content:center;gap:22px;padding:34px 20px;min-width:0}

/* reveal while scrolling */
.js .dk-s [data-a]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i,0) * 70ms)}
.js .dk-s.in [data-a]{opacity:1;transform:none}

.dk-k{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;padding:7px 15px;border-radius:999px;background:rgba(127,224,216,.12);border:1px solid rgba(127,224,216,.22);color:var(--teal-3);font-family:var(--ff-h);font-weight:700;font-size:.8rem}
.dk-k::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--teal-2);box-shadow:0 0 0 4px rgba(34,195,189,.2)}
.dk-t{margin:14px 0 0;font-family:var(--ff-h);font-weight:800;font-size:clamp(1.4rem,4.8vw,2.3rem);line-height:1.5;color:#fff;text-wrap:balance}
.dk .hl{color:var(--teal-3);background-image:linear-gradient(90deg,rgba(34,195,189,.34),rgba(31,95,148,.3));background-size:100% .3em}
.dk-p{margin:12px 0 0;max-width:54ch;color:#b9cbd9;font-size:1rem;line-height:2}
.dk-ico{display:grid;place-items:center;width:60px;height:60px;margin-bottom:18px;border-radius:19px;background:var(--grad);color:#fff;box-shadow:0 18px 34px -14px rgba(34,195,189,.7),inset 0 1px 0 rgba(255,255,255,.3)}
.dk-btns{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:22px}
.btn-line{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.28);color:#fff}
.btn-line:hover{background:#fff;border-color:#fff;color:var(--navy);transform:translateY(-2px)}

/* text + list */
.dk-grid{display:grid;gap:26px;align-items:center}
.dk-side{min-width:0}
.dk-list{display:grid;gap:11px;min-width:0}
.dk-list li{display:flex;gap:14px;align-items:flex-start;padding:15px 16px;border-radius:18px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09)}
.dk-list--cards li:hover{background:rgba(255,255,255,.09);border-color:rgba(127,224,216,.35)}
.dk-li-ic{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:13px;background:rgba(127,224,216,.14);color:var(--teal-3);font-family:"DM Sans",system-ui,sans-serif;font-weight:800}
.dk-li-tx{min-width:0}
.dk-li-tx strong{display:block;color:#fff;font-family:var(--ff-h);font-size:.96rem;line-height:1.7}
.dk-li-tx small{display:block;margin-top:2px;color:#a9bccb;font-size:.88rem;line-height:1.9}
.dk .bico svg{vertical-align:-2px}

/* timeline */
.dk-list--line{gap:0}
.dk-list--line li{position:relative;padding:0 0 22px;background:none;border:0;border-radius:0}
.dk-list--line li:last-child{padding-bottom:0}
.dk-list--line li::before{content:"";position:absolute;top:44px;bottom:2px;inset-inline-start:20px;width:2px;border-radius:2px;background:linear-gradient(rgba(127,224,216,.6),rgba(127,224,216,.08))}
.dk-list--line li:last-child::before{display:none}
.dk-list--line .dk-li-ic,.dk-list--steps .dk-li-ic{border-radius:50%;background:var(--grad);color:#fff;box-shadow:0 0 0 5px rgba(34,195,189,.14)}
.dk-list--line .dk-li-tx{padding-top:5px}

/* cover */
.dk-s--cover{padding-top:46px;padding-bottom:30px}
.dk-cover{display:flex;flex-direction:column;align-items:center;text-align:center}
.dk-cover .dk-k{align-self:center}
.dk-cover .dk-t{font-size:clamp(1.6rem,6vw,3rem)}
.dk-cover .dk-p{font-size:1.04rem}
.dk-road{display:grid;gap:9px;width:100%;max-width:1000px;margin:26px 0 0;text-align:start}
.dk-road a{display:flex;align-items:center;gap:12px;height:100%;padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09);color:#fff;transition:background .3s,border-color .3s,transform .4s var(--spring)}
.dk-road a:hover{background:rgba(255,255,255,.1);border-color:rgba(127,224,216,.4);transform:translateY(-3px)}
.dk-road b{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:var(--grad);font-family:"DM Sans",system-ui,sans-serif;font-size:.9rem}
.dk-road strong{display:block;font-family:var(--ff-h);font-size:.9rem;line-height:1.7}
.dk-road small{display:block;color:#9fb4c4;font-size:.78rem;line-height:1.7}
.dk-down{display:inline-flex;flex-direction:column;align-items:center;gap:2px;margin-top:22px;color:#9fb4c4;font-size:.82rem}
.dk-down svg{animation:dkdown 1.6s ease-in-out infinite;color:var(--teal-3)}
@keyframes dkdown{50%{transform:translateY(6px)}}

/* plans */
.dk-center{text-align:center;display:flex;flex-direction:column;align-items:center}
.dk-center .dk-k{align-self:center}
.dk-plans{display:grid;gap:12px}
.dk-plan{display:flex;flex-direction:column;padding:16px;border-radius:20px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1)}
.dk-plan.is-top{background:linear-gradient(160deg,rgba(34,195,189,.2),rgba(31,95,148,.16));border-color:rgba(127,224,216,.45)}
.dk-plan header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dk-plan-n{padding:5px 13px;border-radius:999px;background:#eef7f6;color:var(--navy);font-family:var(--ff-h);font-weight:700;font-size:.82rem}
.dk-plan-pr{color:#cfe0ec;font-size:.84rem;white-space:nowrap}
.dk-plan-pr strong{font-family:"DM Sans",system-ui,sans-serif;font-size:1.6rem;color:#fff}
.dk-plan-who{margin:12px 0 10px;color:var(--teal-3);font-weight:700;font-size:.9rem}
.dk-yes{display:grid;gap:7px}
.dk-yes li{display:flex;gap:9px;align-items:flex-start;color:#dce9f2;font-size:.86rem;line-height:1.8}
.dk-yes li>svg{flex:none;width:19px;height:19px;padding:4px;margin-top:4px;border-radius:50%;background:rgba(127,224,216,.18);color:var(--teal-3);stroke-width:3}
.dk-no{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:14px}
.dk-no li{display:inline-flex;align-items:center;gap:7px;padding:4px 6px 4px 10px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:#a9bccb;font-size:.74rem;line-height:1.6}
[dir=ltr] .dk-no li{padding:4px 10px 4px 6px}
.dk-no .noic{width:24px;height:24px}
.dk-no .noic>svg{width:13px;height:13px}
.dk-no .noic>i{box-shadow:0 0 0 2px #0f2c49}
.dk-note{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin:0;color:#a9bccb;font-size:.88rem;text-align:center}
.dk-note svg{flex:none;color:var(--teal-3)}
.dk-note a{color:var(--teal-3);font-weight:700;text-decoration:underline;text-underline-offset:4px}

/* final notice */
.dk-end{display:flex;flex-direction:column;align-items:center;text-align:center}
.dk-end .dk-k{align-self:center;background:rgba(255,196,84,.12);border-color:rgba(255,196,84,.3);color:#ffd27a}
.dk-end .dk-k::before{background:#ffc454;box-shadow:0 0 0 4px rgba(255,196,84,.2)}
.dk-end .dk-p{font-size:1.04rem;max-width:46ch}
.dk-end .dk-btns{justify-content:center}
.dk-ico--lg{width:76px;height:76px;border-radius:24px}

/* FAQ: click a question, the answer opens */
.hw-faq{padding:56px 0 10px;scroll-margin-top:90px}
.acc{display:grid;gap:12px;max-width:860px;margin:0 auto}
.acc-i{border-radius:20px;background:var(--card);border:1px solid var(--line);box-shadow:var(--sh-1);transition:border-color .3s,box-shadow .3s}
.acc-i[open]{border-color:rgba(21,154,156,.5);box-shadow:0 18px 40px -24px rgba(21,154,156,.55)}
.acc-i summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;cursor:pointer;list-style:none;font-family:var(--ff-h);font-weight:700;font-size:1rem;line-height:1.8;color:var(--navy);-webkit-tap-highlight-color:transparent}
.acc-i summary::-webkit-details-marker{display:none}
.acc-i summary:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:20px}
.acc-ic{position:relative;flex:none;width:34px;height:34px;border-radius:50%;background:var(--mint);transition:background .3s,transform .4s var(--spring)}
.acc-ic::before,.acc-ic::after{content:"";position:absolute;inset:50% auto auto 50%;width:14px;height:2px;border-radius:2px;background:var(--teal);transform:translate(-50%,-50%);transition:transform .35s var(--ease),background .3s}
.acc-ic::after{transform:translate(-50%,-50%) rotate(90deg)}
.acc-i[open] .acc-ic{background:var(--teal);transform:rotate(180deg)}
.acc-i[open] .acc-ic::before,.acc-i[open] .acc-ic::after{background:#fff}
.acc-i[open] .acc-ic::after{transform:translate(-50%,-50%) rotate(0)}
.acc-a{padding:0 20px 20px}
.acc-a p{margin:0;padding-top:14px;border-top:1px dashed var(--line-2);color:var(--text);font-size:.98rem;line-height:2.05}
.acc-i[open] .acc-a{animation:accin .4s var(--ease)}
@keyframes accin{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

@media (min-width:600px){
  .dk-plans{grid-template-columns:repeat(3,1fr)}
  .dk-road{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:900px){
  .dk-sec{padding:20px 0 40px}
  .hw-stack{gap:26px}
  .dk{border-radius:32px}
  .dk-s{padding:60px 60px;min-height:440px}
  .dk-s--cover{padding:70px 60px 44px}
  .dk-grid{grid-template-columns:.92fr 1.08fr;gap:54px}
  .dk-ico{width:68px;height:68px;border-radius:22px}
  .dk-list li{padding:15px 18px}
  .dk-road{grid-template-columns:repeat(5,1fr);gap:12px;margin-top:38px}
  .dk-road a{flex-direction:column;align-items:flex-start;gap:12px;padding:16px}
  .dk-plans{gap:16px}
  .dk-plan{padding:22px}
  .dk-list--steps{grid-template-columns:1fr 1fr}
  .dk-list--steps li{flex-direction:column;gap:12px}
  .acc-i summary{padding:20px 26px;font-size:1.06rem}
  .acc-a{padding:0 26px 24px}
}
@media (max-width:599px){
  .dk-btns .btn{flex:1 1 auto}
}
@media (prefers-reduced-motion:reduce){
  .js .dk-s [data-a]{opacity:1;transform:none;transition:none}
  .dk-down svg,.acc-i[open] .acc-a{animation:none}
}

/* light mode for phones: flat panels, quick reveals */
@media (hover:none),(max-width:899px){
  .dk{box-shadow:none}
  .dk::before{background:radial-gradient(70% 40% at 90% 0%,rgba(34,195,189,.2),transparent 70%)}
  .dk-glow{display:none}
  .dk-down svg{animation:none}
  .js .dk-s [data-a]{transform:translateY(12px);transition:opacity .35s ease,transform .4s ease;transition-delay:0s}
  .acc-i[open] .acc-a{animation:none}
}