/* Shared frosted surfaces. Opaque fallback comes first for older browsers. */
:root{
  --glass-edge:rgba(136,180,199,.38);
  --glass-shadow:0 14px 35px -20px rgba(21,68,94,.28),inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(148,185,199,.12);
  --glass-radius:20px;
}
.steps-grid,.groups-grid,.three-grid,.stats-grid{
  position:relative;
  isolation:isolate;
}
.steps-grid:before,.groups-grid:before,.three-grid:before,.stats-grid:before{
  content:"";
  position:absolute;
  inset:-20px -12px;
  z-index:-1;
  pointer-events:none;
  border-radius:40px;
  background:radial-gradient(ellipse at 12% 65%,#b6e1ed75,transparent 43%),radial-gradient(ellipse at 86% 12%,#c6d9ee75,transparent 42%),radial-gradient(ellipse at 58% 85%,#e9d9b64d,transparent 44%);
}
.step-card,.resource-card,.group-card,.story-card,.form-card,.panel,.notice,.stat,.progress-card,.plain-card,.request-item{
  position:relative;
  border:1px solid var(--glass-edge);
  border-radius:var(--glass-radius);
  background:linear-gradient(135deg,#ffffffed,#edf5f9e8 60%,#e6eff6eb);
  box-shadow:var(--glass-shadow);
}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .step-card,.resource-card,.group-card,.story-card,.form-card,.panel,.notice,.stat,.progress-card,.plain-card,.request-item{
    background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(247,252,255,.55) 50%,rgba(226,240,249,.66));
    -webkit-backdrop-filter:blur(14px) saturate(125%);
    backdrop-filter:blur(14px) saturate(125%);
  }
}
.step-card,.resource-card{
  display:flex;
  flex-direction:column;
  padding:30px;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.step-card:before,.resource-card:before{
  content:"";
  position:absolute;
  left:22px;
  right:22px;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,#fff 25%,#fff 75%,transparent);
  pointer-events:none;
}
.step-card:after,.resource-card:after{
  content:"";
  position:absolute;
  top:0;
  right:0;
  width:100px;
  height:100px;
  border-radius:0 var(--glass-radius) 0 100%;
  background:linear-gradient(135deg,#ffffff00,#ffffff70);
  pointer-events:none;
}
.step-card .card-top{margin-bottom:28px}
.step-card h3{font-size:1.4rem;color:#113b57}
.step-card p,.resource-card p{color:#456171;line-height:1.8}
.step-card .card-link,.step-card>.inline-link,.resource-card>.inline-link{
  margin-top:auto;
  padding-top:22px;
  border-top:1px solid #91b7c233;
  width:100%;
  display:flex;
  justify-content:space-between;
  gap:12px;
}
.step-card .card-link .icon,.resource-card>.inline-link .icon{
  padding:7px;
  box-sizing:content-box;
  width:17px;
  height:17px;
  border-radius:50%;
  background:#ffffffb8;
  border:1px solid #9dbaca40;
  box-shadow:0 3px 7px #244c6810;
  transition:transform .25s,background .25s,color .25s;
}
.step-card .soft-icon,.resource-card .soft-icon,.progress-card .soft-icon{
  width:52px;
  height:52px;
  border-radius:16px;
  background:linear-gradient(145deg,#ffffffef,#d9edf4c9);
  border:1px solid #ffffffed;
  color:#116a92;
  box-shadow:0 7px 17px -9px #2d718d66,inset 0 -1px 0 #8bb9cc44;
}
.card-top>span:last-child{
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.08em;
  color:#56798d;
  border:1px solid #ffffffa8;
  border-radius:30px;
  padding:5px 9px;
  background:#ffffff70;
}
.step-card:nth-child(2) .soft-icon{background:linear-gradient(145deg,#fff,#dfe6f7ce);color:#466795}
.step-card:nth-child(3) .soft-icon{background:linear-gradient(145deg,#fff,#d5ebe6ce);color:#2d7b70}
.step-card:nth-child(4) .soft-icon{background:linear-gradient(145deg,#fff,#efe5cdce);color:#8a713b}
.group-card{overflow:hidden}
.group-card .group-art,.group-card:nth-child(2) .group-art,.group-card:nth-child(3) .group-art{
  background:linear-gradient(115deg,#d7eaf4b3,#ffffff65);
  border-bottom:1px solid #ffffffd9;
}
.group-card:nth-child(2) .group-art{background:linear-gradient(115deg,#e3e8cfa1,#ffffff65)}
.group-card:nth-child(3) .group-art{background:linear-gradient(115deg,#d8e2f4b3,#ffffff65)}
.group-card .card-content{background:transparent}
.group-card .tag,.panel .tag{background:#ffffffa8;border:1px solid #b1cbd74d}
.group-card .outline,.progress-card .outline{background:#ffffff85;border-color:#b5cdd77a}
.plain-card{padding:25px}
.form-card,.panel,.notice,.story-card{box-shadow:var(--glass-shadow)}
.auth-layout .form-card{box-shadow:var(--glass-shadow);background:linear-gradient(140deg,#fffffff2,#edf5fabd)}
.form-card input,.form-card select,.form-card textarea,.panel input,.panel select,.panel textarea{
  background:#ffffffed;
  border-color:#a6bfca9c;
  box-shadow:inset 0 1px 3px #183e5005,0 1px 0 #fff;
}
.form-card input:focus,.form-card textarea:focus,.panel input:focus,.panel textarea:focus{
  background:#fff;
}
.panel .progress-card,.panel .notice{
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  background:linear-gradient(135deg,#ffffffc9,#dfedf585);
  box-shadow:inset 0 1px 0 #fff,0 5px 15px -12px #163c5740;
}
.panel .progress-card.complete{
  background:linear-gradient(135deg,#fafff6ed,#dfefceba);
  border-color:#b5cda58c;
}
.stat{padding:24px}
.stat strong{color:#123e5e}
.notice{border-left:3px solid #8cb8ca}
.request-item{overflow:hidden}
.request-item[open]{background:linear-gradient(135deg,#fffffff2,#eaf3f7eb)}
.panel table th{background:#dae9f26b}
.panel table td{border-bottom-color:#aac3ce52}
.event-date{background:linear-gradient(140deg,#ffffffeb,#dfecf4ba);border:1px solid #bbd0db8c;box-shadow:var(--glass-shadow);border-radius:13px}
@media(hover:hover) and (pointer:fine){
  a.step-card:hover,a.resource-card:hover{
    transform:translateY(-6px);
    border-color:#76a8bb9e;
    box-shadow:0 23px 40px -22px #124f7173,inset 0 1px 0 #fff,inset 0 0 22px #ffffff66;
    color:var(--ink);
  }
  a.step-card:hover .card-link .icon,a.resource-card:hover>.inline-link .icon{
    transform:translate(2px,-2px);
    background:#174c6b;
    color:#fff;
  }
}
a.step-card:focus-visible,a.resource-card:focus-visible{
  outline:3px solid #297b9d;
  outline-offset:5px;
}
@media(max-width:680px){
  :root{--glass-radius:16px}
  .step-card,.resource-card{padding:23px 19px}
  .step-card h3{font-size:1.2rem}
  .step-card .soft-icon,.resource-card .soft-icon{width:44px;height:44px;border-radius:13px}
  .steps-grid:before,.groups-grid:before,.three-grid:before,.stats-grid:before{inset:-10px 0}
  .step-card .card-link,.resource-card>.inline-link{padding-top:15px;font-size:.78rem}
  .step-card .card-link .icon,.resource-card>.inline-link .icon{width:15px;height:15px;padding:5px}
  .plain-card{padding:22px}
  .step-card,.resource-card,.group-card,.form-card,.panel{
    -webkit-backdrop-filter:blur(7px);
    backdrop-filter:blur(7px);
  }
  .panel .progress-card{-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media(prefers-reduced-motion:reduce){
  a.step-card:hover,a.resource-card:hover,a.step-card:hover .card-link .icon,a.resource-card:hover>.inline-link .icon{transform:none}
}
@media(forced-colors:active){
  .step-card,.resource-card,.group-card,.story-card,.form-card,.panel,.notice,.stat,.progress-card,.plain-card,.request-item{background:Canvas;border:1px solid CanvasText;box-shadow:none}
  .steps-grid:before,.groups-grid:before,.three-grid:before,.stats-grid:before,.step-card:before,.step-card:after,.resource-card:before,.resource-card:after{display:none}
}

/* Signed-in fellowship navigation and Online Worship Center. */
.member-bar{background:#eef5f9;border-bottom:1px solid #cadce6;color:#204d66;font-size:.78rem}
.member-bar>.wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:12px}
.member-bar>.wrap>span{display:flex;align-items:center;gap:9px}
.member-bar .icon{width:16px;height:16px;color:#287a67}
.member-bar nav{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.member-bar a{font-weight:650}.member-bar a[aria-current]{text-decoration:underline;text-underline-offset:5px}
.worship-welcome{display:grid;grid-template-columns:1fr 1fr;gap:35px;background:radial-gradient(ellipse at 90% 0%,#307b91,transparent 70%),#123653;color:white;border-radius:23px;padding:38px;margin-bottom:25px;box-shadow:0 15px 35px -20px #123e5970}
.worship-welcome h2{font-size:2.8rem;color:white}.worship-welcome .eyebrow{color:#efd29a;font-size:.65rem}.worship-welcome p{color:#d6e5ed;font-size:.94rem}
.member-access{display:inline-flex;align-items:center;gap:9px;padding:8px 13px;border:1px solid #9edab35c;background:#c0f3d514;border-radius:24px;color:#d8f2df;font-size:.75rem}
.worship-session{padding:25px;background:linear-gradient(130deg,#ffffff1c,#ffffff09);border:1px solid #ffffff30;border-radius:16px;box-shadow:inset 0 1px 0 #ffffff20}
.worship-session h3{font-size:1.5rem;color:white}.worship-session .eyebrow{margin-bottom:14px}.worship-session small{display:block;font-size:.75rem;color:#c2d9e3;margin-top:14px}
.worship-session .worship-pending{border-top:1px solid #ffffff24;padding-top:16px;margin-bottom:0;font-size:.85rem}
.member-shortcuts{margin-bottom:36px}.member-shortcuts .resource-card h3{font-size:1.3rem}
@media(max-width:800px){.worship-welcome{grid-template-columns:1fr;padding:28px;gap:22px}.member-bar>.wrap{align-items:start;flex-direction:column;gap:8px}.member-bar nav{gap:18px}}
@media(max-width:480px){.worship-welcome{padding:24px 20px;border-radius:17px}.worship-welcome h2{font-size:2.4rem}.worship-session{padding:20px}.member-bar{font-size:.72rem}}
