/* =========================================================
   Bee One-Page Order – STILIUS
   ========================================================= */

/* Visada šviesus UI (įskaitant naršyklės valdomus elementus) */
html, :root { color-scheme: light; }

/* Tema (šviesi – numatytoji ir vienintelė) */
:root{
  --bg:#eef3ff;

  /* Akcentų „glow“ fonams (oranžinė paletė pagal BM) */
  --ring1: color-mix(in oklab, #f5a623 14%, transparent);
  --ring2: color-mix(in oklab, #f36700 12%, transparent);

  --text:#101338; 
  --muted:#6b7d99;

  --card: rgba(255,255,255,.82);
  --card-solid:#fff;
  --border:#dbe4ff; 
  --border-strong:#c7d2ff;

  --blue:#101338; 
  --cyan:#0ea5e9; 
  --blue-50:#eef4ff;

  --radius-xl:28px; 
  --radius-lg:20px; 
  --radius-md:14px;
  --blur:14px;

  --shadow-sm:0 8px 20px rgba(33,61,160,.10);
  --shadow-md:0 18px 44px rgba(33,61,160,.16);
  --shadow-lg:0 36px 96px rgba(33,61,160,.22);

  --ring: 0 0 0 4px color-mix(in oklab, var(--blue) 22%, transparent);
}

/* Fonas – šviesus, su oranžiniais „glow“ */
body{
 /* background:
    radial-gradient(1200px 520px at 12% -10%, var(--ring1), transparent 60%),
    radial-gradient(900px 600px at 100% 12%, var(--ring2), transparent 60%),
    var(--bg);*/
    
     --bg-top:  #f7faff;  /* labai šviesi mėlyna viršuje */
  --bg-bot:  #eaf1ff;  /* šiek tiek sodresnė apačioje */
  --glow-a:  rgba(42, 86, 255, .12);  /* indigo „glow“ kairėje viršuje */
  --glow-b:  rgba(0, 180, 255, .10);  /* cian „glow“ dešinėje */

  background:
    radial-gradient(1100px 520px at 10% -10%, var(--glow-a), transparent 60%),
    radial-gradient(900px 640px at 100% 20%, var(--glow-b), transparent 60%),
    linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bot) 100%);
  color:var(--text);
}

/* --------- LOCAL RESET (tik .bee-wrap viduje) --------- */
.bee-wrap * { box-sizing: border-box; }
.bee-wrap h1, .bee-wrap h2, .bee-wrap h3, .bee-wrap p, .bee-wrap label,
.bee-wrap .bee-tile__title { text-transform: none !important; letter-spacing: normal !important; }
.bee-wrap ul { margin: 0; padding: 0; }
.bee-wrap input, .bee-wrap select, .bee-wrap textarea { font: inherit; }

/* Header */
.bee-wrap{max-width:980px;margin:clamp(28px,6vw,64px) auto;padding:0 18px}
.bee-heading{text-align:center;margin-bottom:22px}
.bee-heading h2{font-size:clamp(32px,7vw,48px);line-height:1.03;letter-spacing:-.02em;margin:0 0 8px;font-weight:900}
.bee-heading p{color:var(--muted);margin:0 auto;max-width:72ch;font-size:clamp(14px,2.3vw,18px)}

/* Shell */
.bee-shell{display:block}
.bee-card{
  position:relative;border-radius:var(--radius-xl);
  padding: clamp(18px, 3vw, 28px);
  background: linear-gradient(180deg, rgba(255,255,255,.52), rgba(255,255,255,.36)), var(--card);
  border:1px solid color-mix(in oklab, var(--border) 60%, transparent);
  -webkit-backdrop-filter: blur(var(--blur)); backdrop-filter: blur(var(--blur));
  box-shadow: var(--shadow-lg); isolation:isolate;
}

/* Progress bar */
.bee-card::before{
  content:""; position:absolute; left:20px; right:20px; top:14px; height:10px;
  background: color-mix(in oklab, var(--border-strong) 55%, transparent); border-radius:999px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}
.bee-card::after{
  content:""; position:absolute; left:20px; top:14px; height:10px; width:46%;
  background: linear-gradient(90deg, var(--blue), var(--cyan));
  border-radius:999px; box-shadow: 0 4px 18px color-mix(in oklab, var(--blue) 26%, transparent);
  transition: width .35s ease;
}
.bee-card:has(.bee-step[data-step="2"].bee-step--active)::after{ width: calc(100% - 40px); }

.bee-card h2{margin:18px 0 10px;font-size:clamp(20px,3.2vw,30px);letter-spacing:-.01em}

/* Subhead */
.bee-sub{margin:14px 0 8px;font-weight:900;letter-spacing:-.01em;color:color-mix(in oklab, var(--text) 86%, var(--blue) 14%)}

/* PASLAUGŲ TILES */
.bee-tiles{
  display:grid !important;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin:12px 0 16px;
}
@media (max-width:980px){.bee-tiles{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.bee-tiles{grid-template-columns:1fr}}

.bee-tile{
  position:relative;cursor:pointer;overflow:clip;isolation:isolate;border-radius:18px;
  border:1px solid color-mix(in oklab, var(--border) 65%, transparent);
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.66)), var(--card-solid);
  box-shadow: var(--shadow-sm);
  transition: transform .18s ease, box-shadow .22s ease, border-color .18s ease, background .22s ease;
  display:block;
}

/* HIDE native radios */
.bee-tiles input[type="radio"]{
  position:absolute !important; inset:0 !important;
  width:1px; height:1px; opacity:0 !important; margin:0 !important; pointer-events:none;
  appearance:none; -webkit-appearance:none;
}

/* Kairinis akcentas – rodomas tik pažymėjus */
.bee-tile::before{
  content:""; position:absolute; inset:0 0 0 auto; width:8px; opacity:0;
  background: linear-gradient(180deg, var(--blue), var(--cyan)); transition:opacity .2s ease;
}

/* Turinio blokas */
.bee-tile__body{padding:48px 18px 18px; min-height:170px; display:flex; flex-direction:column; gap:10px}
.bee-badge{
  position:absolute; top:12px; left:14px; height:28px; line-height:28px; padding:0 12px; border-radius:999px;
  background:linear-gradient(135deg, var(--blue-50), #f7faff); color:var(--blue); font-weight:900; font-size:12px;
  border:1px solid var(--border); box-shadow:0 10px 24px color-mix(in oklab, var(--blue) 18%, transparent)
}
.bee-tile__title{font-weight:900;letter-spacing:-.01em;font-size:18px;color:var(--text)}
.bee-tile__list{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.bee-tile__list li{position:relative;padding-left:22px;font-size:14px;color:var(--muted);line-height:1.45}
.bee-tile__list li::before{
  content:""; position:absolute; left:0; top:.45em; width:12px; height:12px; border-radius:4px;
  background: linear-gradient(135deg, var(--blue), var(--cyan));
  box-shadow: 0 4px 10px color-mix(in oklab, var(--blue) 28%, transparent);
}

/* States */
.bee-tile:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-md);
  border-color:color-mix(in oklab, var(--blue) 35%, var(--border));
}
.bee-tile:has(input:focus-visible){outline:none;box-shadow:var(--shadow-md)}
.bee-tile:has(input:checked){
  border-color:color-mix(in oklab, var(--blue) 70%, var(--border));
  box-shadow:0 10px 30px color-mix(in oklab, var(--blue) 20%, transparent),var(--shadow-md);
}
.bee-tile:has(input:checked)::before{opacity:1}

/* CHECK indikatorius (be mask) */
.bee-tile:has(input:checked)::after{
  content:""; position:absolute; top:10px; right:10px; width:24px; height:24px;
  border-radius:999px;
  background: linear-gradient(135deg, var(--blue), var(--cyan));
  box-shadow: 0 8px 18px color-mix(in oklab, var(--blue) 26%, transparent);
}
.bee-tile:has(input:checked) .bee-tile__body::before{
  content:""; position:absolute; top:15px; right:17px; width:7px; height:13px;
  border-right:3px solid #fff; border-bottom:3px solid #fff; transform: rotate(45deg);
  border-radius:1px;
}

/* Formos grid */
.bee-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:12px 0 10px}
@media (max-width:720px){.bee-grid{grid-template-columns:1fr}}
.bee-col-2{grid-column:1/-1}
.bee-field{display:flex;flex-direction:column}
.bee-field label{
  margin:0 0 6px 2px;
  color: color-mix(in oklab, var(--text) 80%, var(--blue) 20%);
  font-size:14px; font-weight:800; text-transform:none !important; letter-spacing:normal !important;
}

/* Inputs (visada šviesūs) */
.bee-field input,.bee-field select{
  height:56px; line-height:56px; padding:0 16px; border-radius:16px;
  border:1px solid color-mix(in oklab, var(--border) 70%, transparent);
  background: linear-gradient(180deg, rgba(255,255,255,.86), rgba(255,255,255,.76));
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  color:var(--text);
  transition: box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.bee-field textarea{
  min-height:120px;padding:12px 16px;border-radius:16px;border:1px solid color-mix(in oklab, var(--border) 70%, transparent);
  background: linear-gradient(180deg, rgba(255,255,255,.86), rgba(255,255,255,.76));
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.bee-field input:focus,.bee-field select:focus,.bee-field textarea:focus{
  border-color:color-mix(in oklab, var(--blue) 62%, var(--border));box-shadow:var(--ring);outline:none
}
.bee-field select{-webkit-appearance:none;appearance:none;background-image:none;text-indent:.01px;text-overflow:""}
.bee-field input::placeholder{color:#98a7c6}

/* CTA (šviesi bazė, oranžinis primary) */
.bee-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:12px}
.bee-btn{
  display:inline-flex;align-items:center;gap:10px;border-radius:3px;padding:14px 18px;
  border:1px solid color-mix(in oklab, var(--border) 60%, transparent);
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,.75));
  color:#13203b;font-weight:900;cursor:pointer;text-decoration:none;
  transition:transform .06s, filter .15s, box-shadow .2s, border-color .15s;box-shadow:var(--shadow-sm)
}
.bee-btn:hover{border-color:color-mix(in oklab, var(--blue) 28%, var(--border));box-shadow:var(--shadow-md)}
.bee-btn:active{transform:translateY(1px)}
.bee-primary{
  background:linear-gradient(135deg, #f5a623, #f36700);color:#fff;
  border-color:color-mix(in oklab, var(--blue) 65%, var(--border));
  box-shadow:0 16px 36px color-mix(in oklab, var(--blue) 26%, transparent)
}
.bee-primary:hover{filter:brightness(1.04)}
.bee-arrow{display:inline-block;transform:translateX(0);transition:transform .18s}
.bee-btn:hover .bee-arrow{transform:translateX(4px)}

/* Info / note */
.bee-mini-proof{margin:10px 0 0;color:var(--muted);font-size:13px;text-align:center}
.bee-mini-proof span{color:color-mix(in oklab, var(--blue) 70%, var(--text));font-weight:800}

.bee-note{font-size:13px;color:var(--muted);margin-top:10px;text-align:center}
.bee-alert{margin-top:12px;padding:12px 14px;border-radius:16px;background:#fff3f3;color:#9b1c1c;border:1px solid #ffd0d0}

/* Step perjungimas */
.bee-step{display:none}
.bee-step--active{display:block;animation:bee-fade .32s ease both}
@keyframes bee-fade{from{opacity:0;transform:translateY(8px) scale(.995)}to{opacity:1;transform:translateY(0) scale(1)}}

/* Fokusas */
.bee-card :where(button,[role="button"],a,input,select,textarea):focus-visible{outline:none;box-shadow:var(--ring)}
.bee-field .is-invalid{border-color:#ff7a7a !important; box-shadow:0 0 0 5px rgba(255,122,122,.22) !important}