*,*::before,*::after{box-sizing:border-box}

        :root{
          --bg:#0a0708;
          --bg2:rgba(12,9,10,.72);
          --sf:rgba(255,240,245,.035);
          --sf2:rgba(255,240,245,.07);
          --bd:rgba(255,210,220,.10);
          --bd2:rgba(255,210,220,.22);
          --fg:#f8eef1;
          --dm:#c4a8b0;
          --mu:#7a6068;
          --kb:#ffb3c9;
          --kb2:rgba(255,179,201,.08);
          --ms:#ff5c8a;
          --ms2:rgba(255,92,138,.08);
          --hm:#e8d8c8;
          --hm2:rgba(232,216,200,.08);
          --f:'Yomogi','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
          --m:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
          color-scheme:dark;
        }

        html,body{height:100%;margin:0}

        body{
          background:var(--bg);
          color:var(--fg);
          font-family:var(--f);
          font-size:14.5px;
          line-height:1.5;
          -webkit-font-smoothing:antialiased;
          user-select:none;
          overflow:hidden;
        }

        body::before{
          content:'';
          position:fixed;
          inset:0;
          background:url('images/background.jpeg') center/cover no-repeat;
          opacity:.7;
          z-index:0;
          pointer-events:none;
        }

        body::after{
          content:'';
          position:fixed;
          inset:0;
          z-index:0;
          pointer-events:none;
          background:linear-gradient(180deg, rgba(10,4,8,.72), rgba(10,4,8,.9));
        }

        ::-webkit-scrollbar{width:8px;height:8px}
        ::-webkit-scrollbar-track{background:transparent}
        ::-webkit-scrollbar-thumb{background:rgba(255,190,210,.12)}
        ::-webkit-scrollbar-thumb:hover{background:rgba(255,190,210,.22)}

        .ap{
          position:relative;
          z-index:1;
          display:grid;
          grid-template-rows:auto 1fr;
          height:100vh;
        }

        .tp{
          display:flex;
          align-items:center;
          justify-content:space-between;
          gap:32px;
          padding:16px 32px;
          background:var(--bg2);
          backdrop-filter:blur(20px) saturate(1.4);
          -webkit-backdrop-filter:blur(20px) saturate(1.4);
          border-bottom:1px solid var(--bd);
          position:relative;
        }

        .br{
          display:flex;
          align-items:center;
          gap:14px;
          text-decoration:none;
          color:inherit;
        }

        .bl{
          width:42px;height:42px;
          object-fit:contain;
          padding:5px;
          border:1px solid var(--bd2);
          background:var(--sf);
          flex-shrink:0;
        }

        .bi h1{
          margin:0;
          font-size:24px;
          font-weight:400;
          letter-spacing:.04em;
          line-height:1;
          color:var(--fg);
        }

        .bi span{
          display:block;
          margin-top:4px;
          font-size:11px;
          letter-spacing:.28em;
          text-transform:uppercase;
          color:var(--mu);
          font-weight:400;
        }

        .tr{
          display:flex;
          align-items:center;
          gap:10px;
        }

        .icm{
          display:inline-flex;
          align-items:center;
          gap:8px;
          padding:8px 14px;
          border:1px solid var(--bd);
          background:var(--sf);
          color:var(--dm);
          text-decoration:none;
          font-size:13px;
          letter-spacing:.06em;
          transition:background .15s,border-color .15s,color .15s;
        }

        .icm img{
          width:16px;height:16px;object-fit:contain;
          filter:brightness(0) saturate(100%) invert(73%) sepia(11%) saturate(561%) hue-rotate(314deg) brightness(97%) contrast(86%);
        }

        .icm:hover{
          background:var(--sf2);
          border-color:var(--bd2);
          color:var(--fg);
        }

        .cta{
          display:inline-block;
          padding:9px 22px;
          background:var(--ms);
          color:#fff;
          text-decoration:none;
          font-size:13.5px;
          letter-spacing:.08em;
          border:1px solid var(--ms);
          transition:background .2s, border-color .2s, transform .15s;
          white-space:nowrap;
        }

        .cta:hover{
          background:#ff7aa2;
          border-color:#ff7aa2;
        }

        .ctal{
          padding:13px 30px;
          font-size:14.5px;
        }

        .ctag{
          background:transparent;
          color:var(--fg);
          border:1px solid var(--bd2);
        }

        .ctag:hover{
          background:var(--sf2);
          border-color:var(--dm);
        }

        .stg{position:relative;overflow:hidden}

        .pn{
          position:absolute;inset:0;
          padding:40px 56px 40px;
          display:flex;flex-direction:column;
          overflow-y:auto;
          opacity:0;visibility:hidden;
          transform:translateY(8px);
          transition:opacity .3s,transform .3s,visibility 0s linear .3s;
        }

        .pn.on{
          opacity:1;visibility:visible;transform:translateY(0);
          transition:opacity .3s,transform .3s,visibility 0s;
        }

        .hm{
          width:100%;
          max-width:1080px;
          margin:0 auto;
          display:flex;
          flex-direction:column;
          gap:34px;
        }

        .hro{
          display:grid;
          grid-template-columns:1.15fr 1fr;
          gap:28px;
          align-items:stretch;
        }

        .hrl{
          display:flex;
          flex-direction:column;
          justify-content:center;
          padding:28px 8px 28px 4px;
        }

        .bdg{
          display:inline-flex;
          align-self:flex-start;
          align-items:center;
          padding:6px 12px;
          font-family:var(--m);
          font-size:10.5px;
          font-weight:600;
          letter-spacing:.14em;
          text-transform:uppercase;
          color:var(--kb);
          background:rgba(255,179,201,.07);
          border:1px solid rgba(255,179,201,.22);
          margin-bottom:22px;
        }

        .hl{
          width:72px;
          height:72px;
          object-fit:contain;
          padding:8px;
          border:1px solid var(--bd2);
          background:var(--sf);
          margin-bottom:22px;
        }

        .ht{
          margin:0 0 16px;
          font-size:52px;
          font-weight:400;
          letter-spacing:.01em;
          line-height:1.05;
          color:var(--fg);
        }

        .hd{
          margin:0 0 28px;
          max-width:520px;
          font-size:15px;
          line-height:1.75;
          color:var(--dm);
          letter-spacing:.02em;
        }

        .hra{
          display:flex;
          gap:12px;
          flex-wrap:wrap;
        }

        .hrr{
          display:flex;
          flex-direction:column;
          gap:12px;
          padding:22px;
          background:var(--sf);
          border:1px solid var(--bd);
          backdrop-filter:blur(14px);
          -webkit-backdrop-filter:blur(14px);
        }

        .sdl{
          font-size:10px;
          letter-spacing:.28em;
          text-transform:uppercase;
          color:var(--mu);
          margin-bottom:4px;
        }

        .ic{
          display:flex;
          align-items:center;
          gap:14px;
          padding:16px 18px;
          background:rgba(255,240,245,.02);
          border:1px solid var(--bd);
          text-decoration:none;
          color:var(--fg);
          transition:background .15s,border-color .15s,transform .15s;
        }

        .ic[href]:hover{
          background:var(--sf2);
          border-color:var(--bd2);
        }

        .ic[href]:hover .ar{
          transform:translateX(4px);
          color:var(--ms);
        }

        .ic img{
          width:30px;
          height:30px;
          object-fit:contain;
          flex-shrink:0;
          filter:brightness(0) saturate(100%) invert(73%) sepia(11%) saturate(561%) hue-rotate(314deg) brightness(97%) contrast(86%);
        }

        .ib{display:flex;flex-direction:column;min-width:0;flex:1}

        .il{
          font-size:10px;
          letter-spacing:.24em;
          text-transform:uppercase;
          color:var(--mu);
          margin-bottom:4px;
          font-weight:400;
        }

        .iv{
          font-size:15px;
          color:var(--fg);
          letter-spacing:.02em;
          word-break:break-all;
          line-height:1.3;
        }

        .is{
          font-size:11px;
          color:var(--mu);
          margin-top:3px;
          letter-spacing:.06em;
        }

        .ar{
          font-family:var(--m);
          font-size:14px;
          color:var(--mu);
          transition:transform .2s,color .2s;
          flex-shrink:0;
        }

        .ics{
          cursor:default;
          opacity:.9;
        }

        .sc{
          display:flex;
          flex-direction:column;
          gap:20px;
        }

        .sch{
          display:flex;
          flex-direction:column;
          gap:6px;
        }

        .sck{
          font-size:10px;
          letter-spacing:.28em;
          text-transform:uppercase;
          color:var(--dm);
          font-weight:400;
        }

        .sct{
          margin:0;
          font-size:26px;
          font-weight:400;
          letter-spacing:.01em;
          line-height:1.2;
          color:var(--fg);
        }

        .fg{
          display:grid;
          grid-template-columns:repeat(3,1fr);
          gap:12px;
        }

        .fc{
          padding:22px 22px 24px;
          background:var(--sf);
          border:1px solid var(--bd);
          transition:background .15s,border-color .15s,transform .2s;
        }

        .fc:hover{
          background:var(--sf2);
          border-color:var(--bd2);
          transform:translateY(-2px);
        }

        .fc img{
          width:28px;height:28px;
          object-fit:contain;
          margin-bottom:16px;
          filter:brightness(0) saturate(100%) invert(73%) sepia(11%) saturate(561%) hue-rotate(314deg) brightness(97%) contrast(86%);
        }

        .fc h3{
          margin:0 0 8px;
          font-size:17px;
          font-weight:400;
          letter-spacing:.02em;
          color:var(--fg);
        }

        .fc p{
          margin:0;
          font-size:13px;
          line-height:1.7;
          color:var(--dm);
          letter-spacing:.02em;
        }

        .fql{
          display:flex;
          flex-direction:column;
          gap:8px;
        }

        .fq{
          background:var(--sf);
          border:1px solid var(--bd);
          transition:background .15s,border-color .15s;
        }

        .fq[open]{
          background:var(--sf2);
          border-color:var(--bd2);
        }

        .fq summary{
          display:flex;
          align-items:center;
          justify-content:space-between;
          gap:16px;
          padding:18px 22px;
          cursor:pointer;
          font-size:15px;
          letter-spacing:.02em;
          color:var(--fg);
          list-style:none;
          transition:color .15s;
        }

        .fq summary::-webkit-details-marker{display:none}
        .fq summary::marker{content:''}

        .fq summary:hover{color:var(--kb)}

        .fqi{
          position:relative;
          width:14px;
          height:14px;
          flex-shrink:0;
        }

        .fqi::before,
        .fqi::after{
          content:'';
          position:absolute;
          background:var(--dm);
          transition:transform .25s,background .2s;
        }

        .fqi::before{
          top:50%;left:0;right:0;
          height:1.5px;
          transform:translateY(-50%);
        }

        .fqi::after{
          left:50%;top:0;bottom:0;
          width:1.5px;
          transform:translateX(-50%);
        }

        .fq[open] .fqi::after{transform:translateX(-50%) rotate(90deg);opacity:0}
        .fq[open] .fqi::before{background:var(--kb)}
        .fq summary:hover .fqi::before,
        .fq summary:hover .fqi::after{background:var(--kb)}

        .fqa{
          padding:0 22px 20px;
          font-size:13.5px;
          line-height:1.75;
          color:var(--dm);
          letter-spacing:.02em;
          max-width:820px;
        }

        .nw{
          position:relative;
          display:grid;
          grid-template-columns:200px 1fr;
          gap:28px;
          align-items:start;
          padding:24px 28px;
          background:var(--sf);
          border:1px solid var(--bd);
        }

        .nw::before{
          content:'';
          position:absolute;
          left:0;top:0;bottom:0;
          width:3px;
          background:var(--dm);
        }

        .nwm{
          display:flex;
          flex-direction:column;
          gap:4px;
          padding-top:2px;
        }

        .nt{
          font-size:10px;
          letter-spacing:.28em;
          text-transform:uppercase;
          color:var(--dm);
          font-weight:400;
        }

        .nd{
          font-size:11px;
          color:var(--mu);
          letter-spacing:.06em;
        }

        .nti{
          margin:0 0 8px;
          font-size:22px;
          font-weight:400;
          letter-spacing:.02em;
          line-height:1.25;
        }

        .nb{
          margin:0;
          font-size:13.5px;
          line-height:1.75;
          color:var(--dm);
          letter-spacing:.02em;
          max-width:640px;
        }

        .ft{
          display:flex;
          align-items:center;
          gap:10px;
          padding-top:20px;
          border-top:1px solid var(--bd);
          font-size:12px;
          color:var(--mu);
          letter-spacing:.06em;
        }

        .ft a{
          color:var(--dm);
          text-decoration:none;
        }

        .ft a:hover{color:var(--fg)}

        .ftd{color:var(--bd2)}

        .fts{flex:1}

        .ftt{
          font-family:var(--m);
          font-size:11px;
          color:var(--mu);
        }

        @media(max-width:960px){
          .hro{grid-template-columns:1fr;gap:20px}
          .hrl{padding:8px 0}
          .ht{font-size:38px}
          .fg{grid-template-columns:repeat(2,1fr)}
          .nw{grid-template-columns:1fr;gap:12px}
        }

        @media(max-width:820px){
          .tp{
            flex-wrap:wrap;
            padding:14px 20px;
            gap:14px;
          }
          .pn{padding:24px 20px 32px}
          .ht{font-size:32px}
          .hl{width:60px;height:60px}
          .ctal{padding:11px 22px}
          .sct{font-size:22px}
          .ft{flex-wrap:wrap}
          .ftt{width:100%;margin-top:4px}
        }

        @media(max-width:560px){
          .fg{grid-template-columns:1fr}
          .tr{width:100%}
          .tr .cta{flex:1;text-align:center}
          .icm{display:none}
          .hra{flex-direction:column;align-items:stretch}
          .hra .cta{text-align:center}
        }