/* Ycash shared stylesheet.
   Extracted verbatim from the inline <style> block every page carried. These
   are the leading rules that were identical, in the same order, on all 12
   pages, so linking this file immediately before each page's remaining inline
   <style> reproduces the original cascade exactly. Do not reorder, and do not
   add page-specific rules here. */


  :root{
    --orange:#F56733;
    --orange-dark:#E0521F;
    --orange-soft:#FFF1EA;
    --ink:#16130F;
    --ink-2:#3D362F;
    --muted:#7A726A;
    --line:#ECE7E1;
    --bg:#FFFFFF;
    --bg-warm:#FBF8F5;
    --bg-dark:#15110D;
    --radius:18px;
    --radius-lg:26px;
    --shadow-sm:0 1px 2px rgba(20,15,10,.04), 0 4px 14px rgba(20,15,10,.05);
    --shadow-md:0 8px 30px rgba(20,15,10,.09);
    --shadow-orange:0 10px 30px rgba(245,103,51,.28);
    --maxw:1180px;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
    color:var(--ink);
    background:var(--bg);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
  section{position:relative;}

  /* ---------- buttons ---------- */
  .btn{
    display:inline-flex;align-items:center;gap:9px;
    font-weight:700;font-size:15px;
    padding:14px 26px;border-radius:999px;
    cursor:pointer;border:1.5px solid transparent;
    transition:transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
    white-space:nowrap;
  }
  .btn-primary{background:var(--orange);color:#fff;box-shadow:var(--shadow-orange);}
  .btn-primary:hover{background:var(--orange-dark);transform:translateY(-2px);}
  .btn-ghost{background:#fff;color:var(--ink);border-color:var(--line);}
  .btn-ghost:hover{border-color:var(--orange);color:var(--orange);transform:translateY(-2px);}
  .btn-dark{background:var(--ink);color:#fff;}
  .btn-dark:hover{background:#000;transform:translateY(-2px);}
  .btn svg{width:17px;height:17px;}

  /* ---------- nav ---------- */
  header{
    position:sticky;top:0;z-index:100;
    background:rgba(255,255,255,.86);
    backdrop-filter:saturate(160%) blur(12px);
    border-bottom:1px solid transparent;
    transition:border-color .25s ease, box-shadow .25s ease;
  }
  header.scrolled{border-bottom-color:var(--line);box-shadow:0 6px 24px rgba(20,15,10,.05);}
  .nav{display:flex;align-items:center;justify-content:space-between;height:74px;}
  .brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:21px;letter-spacing:-.02em;}
  .brand img{width:38px;height:38px;}
  .nav-links{display:flex;align-items:center;gap:34px;}
  .nav-links a{font-weight:600;font-size:15px;color:var(--ink-2);transition:color .15s ease;}
  .nav-links a:hover{color:var(--orange);}
  .nav-cta{display:flex;align-items:center;gap:14px;}
  .menu-btn{display:none;background:none;border:none;cursor:pointer;padding:8px;}
  .menu-btn span{display:block;width:22px;height:2px;background:var(--ink);margin:4px 0;border-radius:2px;transition:.25s;}
  .mobile-menu{display:none;}

  /* ---------- hero ---------- */
  .hero{padding:74px 0 90px;overflow:hidden;}
  .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
  .eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
    color:var(--orange);background:var(--orange-soft);
    padding:7px 14px;border-radius:999px;margin-bottom:22px;
  }
  .eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--orange);}
  .hero h1{
    font-size:56px;line-height:1.06;letter-spacing:-.03em;font-weight:800;
    margin-bottom:20px;
  }
  .hero h1 .accent{color:var(--orange);}
  .hero .lead{font-size:18.5px;color:var(--ink-2);max-width:498px;margin-bottom:32px;}
  .hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:34px;}
  .hero-trust{display:flex;align-items:center;gap:22px;flex-wrap:wrap;color:var(--muted);font-size:13.5px;font-weight:600;}
  .hero-trust .tdiv{width:1px;height:16px;background:var(--line);}
  .hero-trust span{display:inline-flex;align-items:center;gap:7px;}
  .hero-trust svg{width:15px;height:15px;color:var(--orange);}

  /* hero visual */
  .hero-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:420px;}
  .glow{
    position:absolute;width:430px;height:430px;border-radius:50%;
    background:radial-gradient(circle,rgba(245,103,51,.32) 0%,rgba(245,103,51,.10) 45%,transparent 70%);
    filter:blur(6px);
  }
  .ring{
    position:absolute;border:1.5px dashed rgba(245,103,51,.35);border-radius:50%;
  }
  .ring.r1{width:330px;height:330px;animation:spin 36s linear infinite;}
  .ring.r2{width:430px;height:430px;animation:spin 52s linear infinite reverse;}
  @keyframes spin{to{transform:rotate(360deg);}}
  .hero-logo{width:208px;height:208px;position:relative;z-index:2;filter:drop-shadow(0 18px 40px rgba(245,103,51,.34));}
  .chip{
    position:absolute;z-index:3;
    display:flex;align-items:center;gap:9px;
    background:#fff;border:1px solid var(--line);
    padding:11px 15px;border-radius:14px;
    box-shadow:var(--shadow-md);
    font-size:13.5px;font-weight:700;
  }
  .chip svg{width:17px;height:17px;color:var(--orange);}
  .chip.c1{top:34px;left:-6px;animation:float 5s ease-in-out infinite;}
  .chip.c2{bottom:92px;right:10px;animation:float 5.6s ease-in-out infinite .6s;}
  .chip.c3{bottom:14px;left:40px;animation:float 6.2s ease-in-out infinite 1.1s;}
  @keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-11px);}}

  /* ---------- logos / stat strip ---------- */
  .stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg-warm);}
  .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);}
  .stat{padding:34px 24px;text-align:center;border-right:1px solid var(--line);}
  .stat:last-child{border-right:none;}
  .stat .num{font-size:30px;font-weight:800;letter-spacing:-.02em;color:var(--ink);}
  .stat .num span{color:var(--orange);}
  .stat .lbl{font-size:13.5px;color:var(--muted);font-weight:600;margin-top:2px;}

  /* ---------- section heading ---------- */
  .sec{padding:96px 0;}
  .sec-head{max-width:620px;margin-bottom:50px;}
  .sec-head.center{margin-left:auto;margin-right:auto;text-align:center;}
  .kicker{font-size:13px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--orange);margin-bottom:13px;}
  .sec h2{font-size:39px;line-height:1.12;letter-spacing:-.025em;font-weight:800;margin-bottom:16px;}
  .sec p.sub{font-size:17px;color:var(--ink-2);}

  /* ---------- why cards ---------- */
  .why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .card{
    background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
    padding:34px 30px;box-shadow:var(--shadow-sm);
    transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  }
  .card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:#e3d8cf;}
  .card .ico{
    width:54px;height:54px;border-radius:15px;
    background:var(--orange-soft);color:var(--orange);
    display:flex;align-items:center;justify-content:center;margin-bottom:20px;
  }
  .card .ico svg{width:27px;height:27px;}
  .card h3{font-size:21px;font-weight:800;letter-spacing:-.01em;margin-bottom:9px;}
  .card p{font-size:15px;color:var(--muted);}

  /* ---------- steps ---------- */
  .steps{background:var(--bg-warm);}
  .steps-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
  .step{
    display:flex;gap:20px;align-items:flex-start;
    background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
    padding:28px 28px;box-shadow:var(--shadow-sm);
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .step:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:#e3d8cf;}
  .step:hover .watch{gap:11px;}
  .step:hover .step-num{background:var(--orange);}
  .step-num{
    flex-shrink:0;width:46px;height:46px;border-radius:13px;
    background:var(--ink);color:#fff;font-weight:800;font-size:18px;
    display:flex;align-items:center;justify-content:center;
  }
  .step-body h3{font-size:18.5px;font-weight:800;margin-bottom:5px;}
  .step-body p{font-size:14.5px;color:var(--muted);margin-bottom:12px;}
  .watch{
    display:inline-flex;align-items:center;gap:7px;
    font-size:13.5px;font-weight:700;color:var(--orange);
  }
  .watch svg{width:16px;height:16px;}
  .watch:hover{gap:10px;}
  .steps-note{text-align:center;margin-top:30px;font-size:14px;color:var(--muted);}

  /* ---------- learn band ---------- */
  .learn-band{
    background:var(--ink);color:#fff;border-radius:var(--radius-lg);
    padding:52px 56px;display:flex;align-items:center;justify-content:space-between;gap:40px;
    box-shadow:var(--shadow-md);overflow:hidden;position:relative;
  }
  .learn-band::before{
    content:"";position:absolute;right:-80px;top:-80px;width:320px;height:320px;border-radius:50%;
    background:radial-gradient(circle,rgba(245,103,51,.45),transparent 68%);
  }
  .learn-band .lb-text{position:relative;z-index:2;}
  .learn-band h2{font-size:30px;letter-spacing:-.02em;margin-bottom:10px;font-weight:800;}
  .learn-band p{color:#C9C2BA;font-size:16px;max-width:520px;}
  .learn-band .btn{position:relative;z-index:2;flex-shrink:0;}

  /* ---------- contact ---------- */
  .contact-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:54px;align-items:start;}
  .contact-info h2{font-size:36px;letter-spacing:-.025em;margin-bottom:14px;font-weight:800;}
  .contact-info p{font-size:16px;color:var(--ink-2);margin-bottom:26px;}
  .contact-points{display:flex;flex-direction:column;gap:16px;}
  .cpoint{display:flex;gap:13px;align-items:flex-start;font-size:14.5px;}
  .cpoint .ci{
    width:38px;height:38px;border-radius:11px;flex-shrink:0;
    background:var(--orange-soft);color:var(--orange);
    display:flex;align-items:center;justify-content:center;
  }
  .cpoint .ci svg{width:18px;height:18px;}
  .cpoint b{display:block;font-weight:800;font-size:15px;}
  .cpoint span{color:var(--muted);}
  /* ---------- header breathing room + price ticker (3 September 2026) ----------
     The nav row was carrying the brand, seven links, the live price chip and
     the CTA on one 74px line. At roughly 1140px and below it ran out of room
     and wrapped mid-phrase ("What is / Ycash"), with the brand colliding with
     "Home". The chip now lives in its own full-width strip below the nav, the
     nav text can no longer wrap, and the burger takes over earlier. Nothing
     above this comment was changed. */

  /* nav items break the row, never the phrase */
  .brand,
  .nav-links a,
  .nav-cta .btn,
  .ticker-note { white-space:nowrap; }
  /* the brand and the CTA hold their size; the link row keeps its natural
     width so justify-content:space-between still distributes exactly as
     before — this only stops the three from being squeezed */
  .brand { flex:0 0 auto; }
  .nav-cta { flex:0 0 auto; }

  /* the strip */
  .ticker { border-top:1px solid var(--line); background:var(--orange-soft); }
  .ticker .wrap {
    display:flex; align-items:center; justify-content:space-between;
    gap:14px; min-height:40px; padding-top:5px; padding-bottom:5px;
  }
  .ticker-note { font-size:12px; font-weight:600; color:var(--muted); }
  /* full width here, so the chip can show everything again — these undo the
     narrow-screen trims that only existed because it sat in the nav row */
  .ticker .price-chip .pc-sym,
  .ticker .price-chip .pc-sep,
  .ticker .price-chip .pc-30d { display:inline; }

  /* tighten the link row before it has a chance to overflow */
  @media (max-width:1080px){
    .nav-links { gap:22px; }
    .nav-links a { font-size:14.5px; }
  }

  /* hand over to the burger earlier than 760px — seven items plus a CTA
     never fitted comfortably in the 760-940px band */
  @media (max-width:940px){
    .nav-links,.nav-cta .btn{display:none;}
    .menu-btn{display:block;}
    .nav-cta{gap:0;}
    .mobile-menu{display:none;flex-direction:column;gap:4px;padding:14px 24px 22px;border-top:1px solid var(--line);background:#fff;}
    .mobile-menu.open{display:flex;}
    .mobile-menu a{padding:11px 4px;font-weight:600;color:var(--ink-2);border-bottom:1px solid var(--line);}
    .mobile-menu a:last-of-type{border-bottom:none;}
    .mobile-menu .btn{margin-top:10px;justify-content:center;}
  }

  /* the sticky header is now two rows, so in-page anchors (#learn, #contact)
     need to clear it. They did not clear the single row either — this fixes
     that too. */
  html { scroll-padding-top:124px; }

  @media (max-width:600px){
    .ticker-note{display:none;}
    .ticker .wrap{justify-content:flex-start;min-height:38px;}
  }

  /* ---------- accessibility: skip link + reduced motion (3 September 2026) ---------- */
  .skip-link{
    position:absolute; left:-9999px; top:0; z-index:200;
    background:var(--orange); color:#fff; font-weight:700; font-size:14px;
    padding:10px 16px; border-radius:0 0 8px 0;
  }
  .skip-link:focus{ left:0; }
  #main{ scroll-margin-top:124px; }

  /* Respect the operating-system "reduce motion" setting. The site animates
     roughly twenty elements into view per page; for anyone who has asked for
     less movement, they simply appear. */
  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
    *,*::before,*::after{
      animation-duration:0.001ms !important;
      animation-iteration-count:1 !important;
      transition-duration:0.001ms !important;
      scroll-behavior:auto !important;
    }
  }