:root{
      --op-bg-deep:#020713;
      --op-text-main:#e5f1ff;
      --op-text-soft:#a0b2d2;
      --op-text-faded:#7d90b2;
      --op-text-bright:#ffffff;

      --op-border-strong:rgba(122,190,255,.96);
      --op-border-soft:rgba(96,145,220,.9);

      --op-accent:#3ba7ff;
      --op-accent-strong:#66d1ff;

      --op-gold:#ffcc78;
      --op-gold-soft:rgba(255,204,120,.24);

      --op-success:#53e0b3;
      --op-danger:#ff6f8a;
    }

    *{ box-sizing:border-box; }

    body{
      margin:0;
      min-height:100vh;
      background:
        radial-gradient(circle at 10% -10%, rgba(121,190,255,.22) 0, transparent 55%),
        radial-gradient(circle at 90% -15%, rgba(98,170,255,.18) 0, transparent 60%),
        linear-gradient(180deg, #020713 0%, #01030b 52%, #000 100%);
      color:var(--op-text-main);
      font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    }

    a{ color:inherit; text-decoration:none; }
    a:hover{ text-decoration:underline; }

    main{ padding:1.6rem 0 4rem; }
    @media (max-width:575.98px){ main{ padding:1.2rem 0 3.2rem; } }

    /* Glass */
    .op-glass{
      border-radius:18px;
      background: radial-gradient(circle at top left,
                  rgba(92,160,255,.26) 0,
                  rgba(5,15,32,.97) 46%,
                  #040915 100%);
      border:1px solid var(--op-border-soft);
      box-shadow:
        0 0 0 1px rgba(0,0,0,.97),
        0 24px 48px rgba(5,20,48,.92),
        inset 0 0 18px rgba(110,180,255,.14);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .op-glass--alt{
      background: radial-gradient(circle at top right,
                  rgba(111,187,255,.20) 0,
                  rgba(4,15,32,.96) 55%,
                  #030712 100%);
    }

    .op-pad{ padding:1.05rem 1.2rem; }
    @media (max-width:575.98px){ .op-pad{ padding:0.95rem 1rem; } }

    .op-divider{
      height:1px;
      border-radius:999px;
      background: linear-gradient(90deg, rgba(110,180,255,.10), rgba(110,180,255,.82), rgba(110,180,255,.10));
      margin:0.65rem 0 0.85rem;
    }

    /* Breadcrumbs */
    .op-breadcrumbs{
      display:flex;
      flex-wrap:wrap;
      gap:.35rem;
      align-items:center;
      font-size:.78rem;
      color:var(--op-text-faded);
      margin-bottom:0.9rem;
      letter-spacing:.04em;
    }
    .op-breadcrumbs a{ color:var(--op-text-soft); }
    .op-breadcrumb-sep{ opacity:.75; }
    .op-breadcrumb-current{ color:rgba(230,244,255,.92); }

    /* Page title */
    .op-kicker{
      font-size:.78rem;
      text-transform:uppercase;
      letter-spacing:.16em;
      color:var(--op-text-faded);
      margin-bottom:.25rem;
      display:flex;
      align-items:center;
      gap:.5rem;
    }
    .op-title{
      font-size:clamp(1.45rem, 2.8vw, 2rem);
      font-weight:650;
      color:var(--op-text-bright);
      margin:0 0 .25rem;
      line-height:1.2;
    }
    .op-subtitle{
      margin:0;
      font-size:.88rem;
      color:var(--op-text-soft);
      max-width:72ch;
    }

    /* Quote summary */
    .op-summary{
      display:flex;
      flex-wrap:wrap;
      gap:.6rem 1rem;
      align-items:center;
      justify-content:space-between;
      margin-top:0.85rem;
    }
    .op-starting{
      display:flex;
      flex-direction:column;
      gap:.1rem;
    }
    .op-starting small{ color:var(--op-text-faded); font-size:.78rem; }
    .op-starting strong{
      color:var(--op-gold);
      font-size:1.35rem;
      letter-spacing:.02em;
    }

    .op-note{
      font-size:.8rem;
      color:var(--op-text-faded);
      margin-top:.2rem;
      max-width:70ch;
    }

    /* Buttons */
    .op-btn-primary{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.45rem;
      border-radius:999px;
      padding:.55rem 1.15rem;
      border:1px solid rgba(214,238,255,.98);
      background: linear-gradient(135deg, rgba(67,151,255,.42), rgba(134,209,255,.88));
      color:#04101f;
      font-size:.82rem;
      font-weight:700;
      letter-spacing:.09em;
      text-transform:uppercase;
      cursor:pointer;
      box-shadow:
        0 10px 22px rgba(0,0,0,.92),
        0 0 18px rgba(110,190,255,.45);
      transition:.16s ease-out;
      text-decoration:none;
      white-space:nowrap;
    }
    .op-btn-primary:hover{
      transform: translateY(-1px);
      box-shadow:
        0 14px 28px rgba(0,0,0,.96),
        0 0 26px rgba(145,214,255,.68);
      text-decoration:none;
    }

    .op-btn-outline{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.4rem;
      border-radius:999px;
      padding:.45rem .95rem;
      font-size:.8rem;
      letter-spacing:.06em;
      text-transform:uppercase;
      border:1px solid rgba(122,190,255,.96);
      background: rgba(3,10,24,.98);
      color: var(--op-text-main);
      cursor:pointer;
      box-shadow:
        0 7px 14px rgba(0,0,0,.9),
        0 0 12px rgba(110,190,255,.26);
      transition:.16s ease-out;
      text-decoration:none;
      white-space:nowrap;
    }
    .op-btn-outline:hover{
      border-color: rgba(151,210,255,1);
      transform: translateY(-1px);
      box-shadow:
        0 10px 20px rgba(0,0,0,.96),
        0 0 18px rgba(148,206,255,.55);
      text-decoration:none;
    }

    .op-btn-danger{
      border-radius:999px;
      padding:.38rem .75rem;
      font-size:.78rem;
      border:1px solid rgba(255,111,138,.72);
      background: rgba(25,6,12,.75);
      color: rgba(255,220,228,.92);
      cursor:pointer;
      transition:.14s ease-out;
    }
    .op-btn-danger:hover{
      border-color: rgba(255,111,138,.95);
      box-shadow: 0 10px 20px rgba(0,0,0,.9);
      transform: translateY(-1px);
    }

    /* Bundle cards */
    .op-bundle{
      padding:1.05rem 1.1rem;
    }

    .op-bundle-top{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:.75rem;
      margin-bottom:.55rem;
    }

    .op-bundle-kicker{
      font-size:.76rem;
      text-transform:uppercase;
      letter-spacing:.16em;
      color:var(--op-text-faded);
      display:flex;
      align-items:center;
      gap:.4rem;
      margin-bottom:.15rem;
    }

    .op-bundle-title{
      font-size:1.05rem;
      font-weight:650;
      color:var(--op-text-bright);
      margin:0 0 .1rem;
      line-height:1.2;
    }

    .op-bundle-desc{
      margin:0;
      font-size:.84rem;
      color:var(--op-text-soft);
      line-height:1.45;
      max-width:70ch;
    }

    .op-price-row{
      display:flex;
      flex-wrap:wrap;
      align-items:center;
      justify-content:space-between;
      gap:.6rem;
      margin-top:.75rem;
    }

    .op-price{
      display:flex;
      flex-direction:column;
      gap:.05rem;
    }
    .op-price small{
      font-size:.72rem;
      color:var(--op-text-faded);
      text-transform:uppercase;
      letter-spacing:.12em;
    }
    .op-price strong{
      color:var(--op-gold);
      font-size:1.12rem;
      letter-spacing:.02em;
    }

    /* Addons list */
    .op-addon-header{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:.75rem;
      margin-top:.85rem;
    }
    .op-addon-header .label{
      font-size:.78rem;
      text-transform:uppercase;
      letter-spacing:.14em;
      color:var(--op-text-faded);
      display:flex;
      align-items:center;
      gap:.45rem;
    }

    .op-addon-pill{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      border-radius:999px;
      padding:.22rem .65rem;
      border:1px solid rgba(122,190,255,.96);
      background: rgba(3,10,24,.96);
      color: var(--op-text-main);
      font-size:.78rem;
      margin:.4rem .4rem 0 0;
      box-shadow:
        0 0 0 1px rgba(0,0,0,.92),
        inset 0 0 10px rgba(110,180,255,.10);
    }

    .op-addon-pill .tag{
      font-size:.7rem;
      text-transform:uppercase;
      letter-spacing:.12em;
      color:var(--op-text-faded);
    }

    /* Form controls */
    .op-input,
    .op-select,
    .op-textarea{
      border-radius:14px;
      border:1px solid rgba(92,150,230,.96);
      padding:.62rem .85rem;
      font-size:.92rem;
      background: rgba(3,10,24,.96);
      color: var(--op-text-main);
      box-shadow:
        inset 0 0 12px rgba(0,0,0,.9),
        0 0 12px rgba(120,185,255,.18);
    }
    .op-input::placeholder,
    .op-textarea::placeholder{ color: rgba(160,178,210,.72); }

    .op-input:focus,
    .op-select:focus,
    .op-textarea:focus{
      outline:none;
      border-color: rgba(151,210,255,1);
      box-shadow:
        inset 0 0 12px rgba(0,0,0,.9),
        0 0 20px rgba(151,210,255,.62);
    }

    .op-help{
      font-size:.78rem;
      color:var(--op-text-faded);
      margin-top:.35rem;
      line-height:1.35;
    }

    /* Sidebar */
    .op-sticky{ position: sticky; top: 1rem; }
    @media (max-width:991.98px){ .op-sticky{ position: static; } }

    .op-mini-kicker{
      font-size:.78rem;
      text-transform:uppercase;
      letter-spacing:.16em;
      color:var(--op-text-faded);
      margin-bottom:.25rem;
      display:flex;
      align-items:center;
      gap:.45rem;
    }

    .op-mini-title{
      font-size:1rem;
      font-weight:650;
      color:var(--op-text-bright);
      margin:0 0 .35rem;
    }

    .op-mini-list{
      list-style:none;
      margin:0;
      padding:0;
      font-size:.84rem;
      color:var(--op-text-soft);
      line-height:1.45;
    }
    .op-mini-list li + li{ margin-top:.35rem; }
    .op-mini-list li i{ margin-right:.35rem; color: rgba(148,206,255,.95); }

    /* Empty state */
    .op-empty{
      padding:1.2rem 1.1rem;
      border:1px dashed rgba(122,190,255,.55);
      border-radius:18px;
      background: rgba(3,10,24,.55);
      color: var(--op-text-soft);
      text-align:center;
    }