#component-home{
        --white: #ffffff;
        --mist: #f8fbff;
        --soft-gray: #e5ecf6;
        --ink: #122036;
        --charcoal: #3f4c62;
        --blue: #003f87;
        --blue-deep: #012b5f;
        --sky: #88b5e7;
        --sage: #7f9883;
        --navy: #091321;
        --navy-2: #101723;
        --page-bg: #f7faff;
        --blue-mist: #eef4ff;
        --glass-border: rgba(255, 255, 255, 0.62);
        --shadow: 0 30px 90px rgba(0, 63, 135, 0.15);
        --soft-shadow: 0 18px 42px rgba(0, 63, 135, 0.12);
        --heavy-shadow: 0 34px 90px rgba(0, 63, 135, 0.2), 0 12px 36px rgba(27, 27, 27, 0.1);
        --radius-card: 24px;
        --ease: cubic-bezier(0.22, 1, 0.36, 1);
        --spring: cubic-bezier(0.18, 0.9, 0.24, 1);
        --max-page: 1600px;
        --intro-cover-progress: 0;
        --intro-lift: 0px;
        --hero-panel-slide: 0px;
        --intro-card-parallax: 0px;
        --intro-media-parallax: 0px;
        --flow-content-parallax: 0px;
        --story-card-parallax: 0px;
        --story-media-parallax: 0px;
        --continuity-bg:
          radial-gradient(82% 32% at 50% 0%, rgba(136, 181, 231, 0.13), transparent 72%),
          radial-gradient(72% 36% at 50% 46%, rgba(136, 181, 231, 0.11), transparent 74%),
          radial-gradient(48% 28% at 82% 22%, rgba(0, 63, 135, 0.04), transparent 76%),
          linear-gradient(180deg, rgba(243, 248, 255, 0.99), rgba(247, 250, 255, 0.99) 48%, rgba(244, 249, 255, 0.99)),
          var(--page-bg);
      }
#component-home *{
        box-sizing: border-box;
      }
#component-home{
        min-width: 320px;
        scroll-behavior: smooth;
        background: var(--page-bg);
      }
#component-home{
        min-width: 320px;
        margin: 0;
        overflow-x: hidden;
        color: var(--ink);
        background:
          radial-gradient(60% 30% at 50% 0%, rgba(136, 181, 231, 0.16), transparent 72%),
          linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 250, 255, 0.96)),
          var(--page-bg);
        font-family: "Poppins", Arial, sans-serif;
      }
#component-home img,#component-home video,#component-home svg{
        display: block;
      }
#component-home a{
        color: inherit;
      }
#component-home button{
        font: inherit;
        -webkit-tap-highlight-color: transparent;
      }
#component-home .site-page{
        width: min(100%, var(--max-page));
        margin: 0 auto;
        overflow-x: clip;
        overflow-y: visible;
        background: var(--continuity-bg);
        box-shadow: 0 0 0 1px rgba(0, 63, 135, 0.06);
      }
#component-home .hero{
        position: relative;
        min-height: clamp(500px, 58svh, 680px);
        isolation: isolate;
        overflow: visible;
        background: var(--navy);
      }
#component-home .hero-video{
        position: absolute;
        inset: 0;
        z-index: -3;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center;
        background: #000;
        filter: saturate(0.98) contrast(1.02);
      }
#component-home .hero::before{
        position: absolute;
        inset: 0;
        z-index: -2;
        content: "";
        pointer-events: none;
        background:
          linear-gradient(180deg, rgba(7, 16, 28, 0.06) 0%, rgba(7, 16, 28, 0.12) 34%, rgba(7, 16, 28, 0.52) 100%),
          radial-gradient(90% 34% at 50% 88%, rgba(0, 24, 58, 0.32), transparent 72%),
          linear-gradient(90deg, rgba(0, 63, 135, 0.24), rgba(0, 63, 135, 0.06) 34%, rgba(255, 255, 255, 0.04) 100%);
      }
#component-home .hero::after{
        position: absolute;
        left: 0;
        right: 0;
        bottom: -1px;
        z-index: -1;
        height: 54px;
        content: "";
        pointer-events: none;
        background: linear-gradient(180deg, transparent, rgba(246, 249, 246, 0.86));
      }
#component-home .hero-inner{
        width: min(100%, var(--max-page));
        min-height: inherit;
        margin: 0 auto;
        display: grid;
        align-items: end;
        padding: clamp(34px, 5vw, 82px) clamp(16px, 2.4vw, 36px) clamp(18px, 2.4vw, 30px);
      }
#component-home .hero-panel{
        position: relative;
        isolation: isolate;
        width: min(calc(100% - clamp(28px, 4vw, 76px)), calc(var(--max-page) - clamp(72px, 10vw, 180px)));
        justify-self: center;
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
        align-items: center;
        padding: clamp(18px, 1.9vw, 30px) clamp(24px, 4.3vw, 72px);
        border: 1px solid rgba(255, 255, 255, 0.3);
        border-radius: 28px;
        background:
          linear-gradient(135deg, rgba(255, 255, 255, 0.24), rgba(255, 255, 255, 0.1) 42%, rgba(255, 255, 255, 0.04)),
          linear-gradient(92deg, rgba(8, 18, 36, 0.28), rgba(8, 18, 36, 0.16));
        box-shadow:
          0 -18px 42px rgba(0, 24, 58, 0.14),
          0 20px 48px rgba(0, 24, 58, 0.18),
          0 2px 10px rgba(0, 24, 58, 0.12),
          inset 0 1px 0 rgba(255, 255, 255, 0.48);
        backdrop-filter: blur(20px) saturate(150%);
        -webkit-backdrop-filter: blur(20px) saturate(150%);
      }
#component-home .hero-panel::before{
        position: absolute;
        inset: 1px 0 auto;
        height: 1px;
        content: "";
        pointer-events: none;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.62), transparent);
      }
#component-home .hero-panel::after{
        position: absolute;
        left: 5%;
        right: 5%;
        bottom: -20px;
        z-index: -2;
        height: 42px;
        content: "";
        pointer-events: none;
        border-radius: 999px;
        background: radial-gradient(ellipse at center, rgba(0, 24, 58, 0.34), rgba(0, 24, 58, 0.1) 50%, transparent 78%);
        filter: blur(20px);
        opacity: 0.72;
      }
#component-home .sr-only{
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
        border: 0 !important;
      }
#component-home .lsa-update-crawler[hidden],#component-home .lsa-note-scene[hidden]{
        display: none !important;
      }
#component-home .lsa-update-crawler{
        position: absolute;
        z-index: 6;
        top: clamp(12px, 1.7vw, 24px);
        left: 50%;
        width: min(calc(100% - clamp(24px, 4vw, 64px)), 1450px);
        min-height: 42px;
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: stretch;
        overflow: hidden;
        border: 1px solid rgba(255, 255, 255, 0.27);
        border-radius: 18px;
        color: rgba(250, 253, 255, 0.96);
        background:
          linear-gradient(180deg, rgba(255, 255, 255, 0.12), transparent 48%),
          rgba(7, 18, 33, 0.58);
        box-shadow:
          0 14px 34px rgba(0, 18, 43, 0.2),
          inset 0 1px 0 rgba(255, 255, 255, 0.22);
        backdrop-filter: blur(16px) saturate(145%);
        -webkit-backdrop-filter: blur(16px) saturate(145%);
        transform: translate(-50%, -54px);
        opacity: 0;
        animation: home-lsa-crawler-drop 680ms var(--spring) 160ms forwards;
      }
#component-home .lsa-update-label{
        position: relative;
        z-index: 2;
        min-width: 104px;
        display: grid;
        place-items: center;
        padding: 0 18px;
        color: #fff;
        background: rgba(0, 63, 135, 0.72);
        border-right: 1px solid rgba(255, 255, 255, 0.22);
        font-size: 0.72rem;
        font-weight: 800;
        letter-spacing: 0.08em;
        line-height: 1;
      }
#component-home .lsa-update-viewport{
        min-width: 0;
        display: flex;
        align-items: center;
        overflow: hidden;
        mask-image: linear-gradient(90deg, transparent, #000 18px, #000 calc(100% - 18px), transparent);
        -webkit-mask-image: linear-gradient(90deg, transparent, #000 18px, #000 calc(100% - 18px), transparent);
      }
#component-home .lsa-update-runner{
        width: max-content;
        display: flex;
        align-items: center;
        animation: home-lsa-ticker var(--ticker-duration, 22s) linear infinite;
        will-change: transform;
      }
#component-home .lsa-update-group{
        min-width: max-content;
        display: flex;
        align-items: center;
        gap: 32px;
        padding: 0 24px;
        font-size: clamp(0.76rem, 1vw, 0.88rem);
        font-weight: 600;
        line-height: 1.2;
        white-space: nowrap;
      }
#component-home .lsa-update-group::after{
        width: 5px;
        height: 5px;
        flex: 0 0 auto;
        content: "";
        border-radius: 50%;
        background: var(--sky);
        box-shadow: 0 0 12px rgba(136, 181, 231, 0.74);
      }
#component-home .lsa-update-crawler:hover .lsa-update-runner,#component-home .lsa-update-crawler:focus-within .lsa-update-runner{
        animation-play-state: paused;
      }
@keyframes home-lsa-crawler-drop{
        0% {
          opacity: 0;
          transform: translate(-50%, -54px);
        }

        72% {
          opacity: 1;
          transform: translate(-50%, 3px);
        }

        100% {
          opacity: 1;
          transform: translate(-50%, 0);
        }
      }
@keyframes home-lsa-ticker{
        to {
          transform: translateX(var(--ticker-translation, -50%));
        }
      }
#component-home .hero-copy{
        min-width: 0;
        max-width: none;
        display: grid;
        gap: clamp(8px, 1vw, 12px);
        align-content: center;
      }
#component-home .eyebrow{
        margin: 0 0 10px;
        color: var(--sky);
        font-size: clamp(0.74rem, 0.92vw, 0.92rem);
        font-weight: 800;
        line-height: 1.2;
        text-transform: uppercase;
      }
#component-home .hero-eyebrow{
        color: rgba(255, 255, 255, 0.84);
        text-shadow: 0 8px 26px rgba(0, 0, 0, 0.36);
      }
#component-home .hero h1{
        --hero-title-a: #ffffff;
        --hero-title-b: #e7f4ff;
        --hero-title-c: #b9d6f2;
        --hero-title-d: #79a6da;
        --hero-title-e: #f7fbff;
        position: relative;
        width: 100%;
        max-width: none;
        margin: 0;
        color: transparent;
        font-size: clamp(1.85rem, 3.1vw, 3.9rem);
        font-weight: 300;
        line-height: 1.02;
        letter-spacing: 0;
        text-shadow:
          0 1px 0 rgba(255, 255, 255, 0.16),
          0 18px 42px rgba(0, 0, 0, 0.5);
        text-wrap: normal;
        white-space: nowrap;
      }
#component-home .hero h1::before{
        position: absolute;
        inset: -18px -28px -22px;
        z-index: -1;
        content: "";
        pointer-events: none;
        border-radius: 42px;
        background:
          radial-gradient(88% 130% at 16% 28%, rgba(255, 255, 255, 0.18), transparent 58%),
          radial-gradient(92% 130% at 72% 72%, rgba(121, 166, 218, 0.16), transparent 64%),
          linear-gradient(90deg, rgba(255, 255, 255, 0.1), rgba(136, 181, 231, 0.09), rgba(242, 178, 0, 0.026));
        filter: blur(14px) saturate(108%);
        opacity: 0.76;
        animation: home-hero-title-field 15s ease-in-out infinite;
      }
#component-home .hero-title-part{
        display: inline;
        background: linear-gradient(
          96deg,
          var(--hero-title-a),
          var(--hero-title-b),
          var(--hero-title-c),
          var(--hero-title-d),
          var(--hero-title-e),
          var(--hero-title-a)
        );
        background-size: 320% 100%;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        animation: home-hero-title-flow 12s ease-in-out infinite;
        -webkit-text-stroke: 0.25px rgba(255, 255, 255, 0.2);
        filter:
          drop-shadow(0 1px 0 rgba(255, 255, 255, 0.12))
          drop-shadow(0 14px 26px rgba(0, 24, 58, 0.38));
      }
#component-home .hero h1 strong{
        display: inline;
        font-weight: 800;
      }
#component-home .hero-title-strong{
        background-position: 44% 50%;
      }
#component-home .hero-actions,#component-home .cta-row{
        display: flex;
        flex-wrap: wrap;
        gap: 14px;
        align-items: center;
      }
#component-home .hero-actions{
        width: min(100%, 360px);
        min-width: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        justify-self: end;
        align-self: center;
        gap: 10px;
        padding-bottom: 0;
      }
#component-home .spring-btn{
        position: relative;
        isolation: isolate;
        min-height: 54px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.58em;
        padding: 15px 28px;
        overflow: hidden;
        border: 0;
        border-radius: 999px;
        color: #fff;
        background: linear-gradient(135deg, #88b6e8 0%, #2a6abb 46%, #003f87 100%);
        box-shadow:
          0 10px 20px rgba(0, 63, 135, 0.22),
          0 2px 6px rgba(0, 0, 0, 0.12);
        font-size: clamp(0.95rem, 1.12vw, 1.04rem);
        font-weight: 700;
        line-height: 1;
        text-decoration: none;
        cursor: pointer;
        transform: scale(var(--spring-scale, 1));
        transform-origin: center;
        will-change: transform;
        transition: box-shadow 240ms ease, filter 240ms ease;
      }
#component-home .spring-btn span,#component-home .glass-btn span{
        white-space: nowrap;
      }
#component-home .spring-btn::before{
        display: none;
      }
#component-home .spring-btn::after{
        position: absolute;
        inset: -2px;
        z-index: -1;
        content: "";
        border-radius: inherit;
        background: linear-gradient(135deg, #88b6e8 0%, #2a6abb 46%, #003f87 100%);
        filter: blur(12px);
        opacity: 0;
        transition: opacity 250ms ease;
      }
#component-home .spring-btn:hover,#component-home .spring-btn:focus-visible{
        box-shadow:
          0 14px 24px rgba(0, 63, 135, 0.24),
          0 4px 10px rgba(0, 0, 0, 0.12);
        filter: saturate(1.04);
      }
#component-home .spring-btn:hover::after,#component-home .spring-btn:focus-visible::after{
        opacity: 0.4;
      }
#component-home .spring-btn:focus-visible{
        outline: 3px solid rgba(242, 178, 0, 0.9);
        outline-offset: 4px;
      }
#component-home .spring-btn--sky{
        color: #173457;
        background: linear-gradient(135deg, #eef6ff 0%, #b5d2f1 100%);
        box-shadow:
          0 10px 20px rgba(121, 166, 218, 0.2),
          0 2px 6px rgba(0, 0, 0, 0.08);
      }
#component-home .spring-btn--sky::after{
        background: linear-gradient(135deg, #ecf5ff 0%, #8db8e9 100%);
      }
#component-home .spring-btn--small{
        min-height: 46px;
        padding: 13px 22px;
        font-size: 0.92rem;
      }
#component-home .btn-arrow{
        width: 1.08em;
        height: 1.08em;
        flex: 0 0 auto;
      }
#component-home .school-intro{
        position: relative;
        z-index: 3;
        margin-top: -56px;
        margin-right: 0;
        margin-left: 0;
        padding: clamp(56px, 6.4vw, 92px) clamp(18px, 3.4vw, 48px) clamp(40px, 5.4vw, 78px);
        overflow: visible;
        border-radius: 24px;
        background: var(--continuity-bg);
        box-shadow:
          0 -42px 92px rgba(0, 24, 58, 0.16),
          0 36px 96px rgba(8, 23, 42, 0.18),
          0 18px 42px rgba(0, 63, 135, 0.11),
          inset 0 1px 0 rgba(255, 255, 255, 0.72);
        transform: translateY(var(--intro-card-parallax));
        transition: transform 80ms linear;
        will-change: transform;
      }
#component-home .school-intro::before{
        position: absolute;
        inset: 0;
        z-index: -1;
        content: "";
        pointer-events: none;
        border-radius: inherit;
        background:
          linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.82),
            rgba(255, 255, 255, 0.16) 18%,
            transparent 30%
          ),
          radial-gradient(55% 45% at 18% 12%, rgba(136, 181, 231, 0.12), transparent 68%),
          radial-gradient(40% 36% at 84% 10%, rgba(0, 63, 135, 0.06), transparent 72%);
        
        backdrop-filter: blur(8px) saturate(135%);
        -webkit-backdrop-filter: blur(8px) saturate(135%);
      }
#component-home .school-intro::after{
        display: none;
        content: none;
      }
#component-home .lsa-note-scene{
        --note-tilt: -2.6deg;
        position: absolute;
        z-index: 8;
        top: clamp(118px, 21%, 178px);
        left: calc(50% - 26px);
        width: clamp(238px, 19vw, 292px);
        aspect-ratio: 1 / 1;
        perspective: 1200px;
        transform-style: preserve-3d;
        pointer-events: none;
      }
#component-home .lsa-note-shadow{
        position: absolute;
        z-index: 0;
        left: 50%;
        bottom: -25px;
        width: 82%;
        height: 24%;
        pointer-events: none;
        border-radius: 50%;
        background: radial-gradient(ellipse at center, rgba(11, 26, 45, 0.24), rgba(11, 26, 45, 0.1) 44%, transparent 74%);
        filter: blur(16px);
        transform: translateX(-50%) rotate(var(--note-tilt));
      }
#component-home .lsa-sticky-note{
        position: relative;
        z-index: 2;
        width: 100%;
        height: 100%;
        padding: 24px 24px 25px 26px;
        overflow: hidden;
        pointer-events: auto;
        color: #40331f;
        border: 1px solid rgba(132, 107, 17, 0.24);
        border-radius: 3px 3px 17px 5px / 3px 3px 19px 6px;
        background:
          linear-gradient(180deg, rgba(255, 255, 255, 0.3), transparent 24%),
          radial-gradient(115% 72% at 17% 12%, rgba(255, 255, 255, 0.48), transparent 31%),
          linear-gradient(160deg, rgba(255, 255, 255, 0.16), transparent 38%),
          linear-gradient(180deg, #fff8b8, #f7e783 72%, #e8cf5e);
        box-shadow:
          inset 0 2px 0 rgba(255, 255, 255, 0.56),
          inset 0 -2px 6px rgba(131, 101, 8, 0.1),
          0 6px 10px rgba(17, 28, 43, 0.13),
          0 27px 52px rgba(9, 15, 24, 0.23);
        clip-path: polygon(1.3% 0.8%, 98.8% 0.2%, 99.7% 98.1%, 4.1% 99.5%, 0.2% 2.9%);
        transform: rotate(var(--note-tilt)) rotateX(3.5deg) rotateY(-3deg) translateZ(0);
        transform-origin: 50% 8%;
        transition: transform 220ms ease, box-shadow 220ms ease;
        will-change: transform, clip-path, border-radius, filter;
      }
#component-home .lsa-sticky-note:hover{
        transform: rotate(calc(var(--note-tilt) + 0.15deg)) rotateX(2deg) rotateY(-2deg) translateY(-2px);
        box-shadow:
          inset 0 2px 0 rgba(255, 255, 255, 0.62),
          inset 0 -2px 6px rgba(131, 101, 8, 0.1),
          0 8px 14px rgba(17, 28, 43, 0.14),
          0 34px 64px rgba(9, 15, 24, 0.25);
      }
#component-home .lsa-sticky-note::before{
        position: absolute;
        inset: 0;
        z-index: 0;
        content: "";
        pointer-events: none;
        opacity: 0.2;
        mix-blend-mode: multiply;
        background-image:
          radial-gradient(circle at 18% 22%, rgba(107, 84, 10, 0.1) 0 0.8px, transparent 1.15px),
          radial-gradient(circle at 78% 34%, rgba(107, 84, 10, 0.08) 0 0.75px, transparent 1.2px),
          radial-gradient(circle at 43% 72%, rgba(107, 84, 10, 0.08) 0 0.8px, transparent 1.2px),
          linear-gradient(transparent 0 96%, rgba(105, 78, 6, 0.045) 100%);
        background-size: 14px 14px, 18px 18px, 16px 16px, 100% 7px;
      }
#component-home .lsa-sticky-note::after{
        position: absolute;
        z-index: 1;
        right: 6px;
        bottom: 7px;
        width: 78px;
        height: 48px;
        content: "";
        pointer-events: none;
        border-radius: 50%;
        opacity: 0.5;
        background:
          radial-gradient(ellipse at 28% 25%, rgba(255, 255, 255, 0.34), transparent 56%),
          linear-gradient(135deg, rgba(255, 255, 255, 0.17), rgba(113, 85, 3, 0.09));
        box-shadow: 10px 13px 17px rgba(0, 0, 0, 0.1);
        filter: blur(0.6px);
        transform: rotate(-13deg) skewX(-13deg);
      }
#component-home .lsa-note-adhesive{
        position: absolute;
        z-index: 1;
        top: 0;
        left: 22px;
        right: 22px;
        height: 25px;
        pointer-events: none;
        border-radius: 0 0 11px 11px;
        opacity: 0.62;
        background:
          linear-gradient(180deg, rgba(255, 255, 255, 0.56), rgba(255, 255, 255, 0.08) 47%, rgba(103, 79, 7, 0.055));
        mix-blend-mode: screen;
      }
#component-home .lsa-note-content{
        position: relative;
        z-index: 4;
        height: 100%;
        display: flex;
        flex-direction: column;
        gap: 8px;
      }
#component-home .lsa-note-header{
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 3px;
      }
#component-home .lsa-note-eyebrow{
        margin-top: 8px;
        color: rgba(86, 67, 10, 0.7);
        font-size: 0.68rem;
        font-weight: 700;
        letter-spacing: 0.13em;
        line-height: 1;
        text-transform: uppercase;
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.28);
      }
#component-home .lsa-note-dismiss{
        width: 32px;
        height: 32px;
        flex: 0 0 auto;
        display: grid;
        place-items: center;
        padding: 0 0 2px;
        border: 0;
        border-radius: 50%;
        color: rgba(77, 57, 9, 0.82);
        background:
          linear-gradient(180deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.1)),
          rgba(113, 89, 8, 0.08);
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.58),
          0 3px 9px rgba(0, 0, 0, 0.08);
        font-size: 1.15rem;
        line-height: 1;
        cursor: pointer;
      }
#component-home .lsa-note-dismiss:hover{
        transform: translateY(-1px);
      }
#component-home .lsa-note-dismiss:active{
        transform: translateY(1px) scale(0.88);
      }
#component-home .lsa-note-title,#component-home .lsa-note-message{
        font-family: "Patrick Hand", "Segoe Print", "Bradley Hand", "Marker Felt", cursive;
      }
#component-home .lsa-note-title{
        margin: 0;
        color: #40331f;
        font-size: clamp(1.55rem, 2.3vw, 2rem);
        font-weight: 400;
        line-height: 1;
      }
#component-home .lsa-note-message{
        flex: 1;
        margin: 1px 0 0;
        color: rgba(57, 43, 23, 0.94);
        font-size: clamp(1.05rem, 1.7vw, 1.32rem);
        line-height: 1.25;
        overflow-wrap: anywhere;
        white-space: pre-line;
      }
#component-home .lsa-note-scene.is-dismissing .lsa-sticky-note{
        pointer-events: none;
        transform-origin: 50% 50%;
        animation: home-lsa-note-crumple-fall 1450ms cubic-bezier(0.38, 0.02, 0.35, 1) forwards;
      }
#component-home .lsa-note-scene.is-dismissing .lsa-note-content,#component-home .lsa-note-scene.is-dismissing .lsa-note-adhesive{
        animation: home-lsa-note-ink-collapse 570ms cubic-bezier(0.5, 0, 0.6, 1) forwards;
      }
#component-home .lsa-note-scene.is-dismissing .lsa-note-shadow{
        animation: home-lsa-note-shadow-fall 1450ms ease-in forwards;
      }
@keyframes home-lsa-note-crumple-fall{
        0% {
          opacity: 1;
          border-radius: 3px 3px 17px 5px / 3px 3px 19px 6px;
          filter: none;
          transform: translate3d(0, 0, 0) rotate(var(--note-tilt)) rotateX(3.5deg) rotateY(-3deg) scale(1);
          clip-path: polygon(1.3% 0.8%, 98.8% 0.2%, 99.7% 98.1%, 4.1% 99.5%, 0.2% 2.9%);
        }

        18% {
          border-radius: 13% 8% 21% 15% / 9% 18% 13% 22%;
          transform: translate3d(-2px, 4px, 0) rotate(7deg) rotateX(9deg) rotateY(5deg) scale(0.82, 0.66) skew(-7deg, 3deg);
          clip-path: polygon(13% 8%, 91% 11%, 95% 75%, 73% 95%, 17% 85%, 7% 23%);
        }

        40% {
          border-radius: 44% 35% 48% 39% / 39% 47% 35% 45%;
          filter: contrast(1.09) saturate(1.04);
          transform: translate3d(-1px, 11px, 0) rotate(18deg) rotateX(8deg) rotateY(7deg) scale(0.245, 0.205) skew(-8deg, 5deg);
          clip-path: polygon(18% 17%, 73% 10%, 91% 43%, 76% 81%, 38% 94%, 9% 64%, 11% 31%);
        }

        54% {
          opacity: 1;
          border-radius: 50% 43% 48% 45% / 46% 50% 43% 49%;
          filter: contrast(1.13) saturate(1.04) drop-shadow(0 10px 9px rgba(0, 0, 0, 0.17));
          transform: translate3d(0, 15px, 0) rotate(36deg) scale(0.2, 0.19);
          clip-path: polygon(25% 10%, 67% 7%, 91% 34%, 84% 72%, 58% 94%, 21% 87%, 8% 54%, 12% 25%);
        }

        70% {
          opacity: 1;
          transform: translate3d(1.7vw, 36vh, 0) rotate(242deg) scale(0.205, 0.195);
        }

        86% {
          opacity: 1;
          transform: translate3d(-1vw, 82vh, 0) rotate(486deg) scale(0.21, 0.2);
        }

        100% {
          opacity: 0;
          transform: translate3d(1vw, 130vh, 0) rotate(720deg) scale(0.19, 0.18);
        }
      }
@keyframes home-lsa-note-ink-collapse{
        0% {
          opacity: 1;
          transform: scale(1);
        }

        55% {
          opacity: 0.64;
          filter: blur(0.2px);
          transform: scale(0.58, 0.42) rotate(5deg);
        }

        100% {
          opacity: 0;
          filter: blur(0.7px);
          transform: scale(0.08) rotate(18deg);
        }
      }
@keyframes home-lsa-note-shadow-fall{
        0% {
          opacity: 1;
          transform: translateX(-50%) scale(1) rotate(var(--note-tilt));
        }

        54% {
          opacity: 0.2;
          transform: translateX(-50%) translateY(15px) scale(0.16, 0.28);
        }

        100% {
          opacity: 0;
          transform: translateX(-50%) translateY(120vh) scale(0.05);
        }
      }
#component-home .intro-grid{
        width: min(100%, 1280px);
        margin: 0 auto;
        display: grid;
        grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
        gap: clamp(30px, 5.5vw, 82px);
        align-items: center;
      }
#component-home .intro-copy h2,#component-home .story-copy h2{
        margin: 0;
        color: var(--blue);
        font-size: clamp(2.1rem, 4.4vw, 4.8rem);
        font-weight: 800;
        line-height: 1.05;
        letter-spacing: 0;
        text-wrap: balance;
      }
#component-home .intro-greeting{
        padding-bottom: 0.08em;
        line-height: 1.08;
      }
#component-home .intro-copy p:not(.eyebrow),#component-home .story-copy p:not(.eyebrow){
        max-width: 62rem;
        margin: clamp(16px, 2vw, 24px) 0 0;
        color: var(--charcoal);
        font-size: clamp(1rem, 1.24vw, 1.18rem);
        line-height: 1.68;
        text-wrap: pretty;
      }
#component-home .intro-copy{
        position: relative;
        max-width: 39rem;
      }
#component-home .intro-copy::after,#component-home .story-copy::after{
        position: absolute;
        inset: -34px -18px -38px -36px;
        z-index: -2;
        content: "";
        pointer-events: none;
        border-radius: 38px;
        background:
          radial-gradient(68% 58% at 26% 24%, rgba(136, 181, 231, 0.12), transparent 74%),
          linear-gradient(140deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.14) 54%, transparent 100%);
        opacity: 0.96;
      }
#component-home .intro-copy::before,#component-home .story-copy::before{
        position: absolute;
        left: -16px;
        top: 12px;
        bottom: 12px;
        width: 2px;
        content: "";
        border-radius: 999px;
        background: linear-gradient(180deg, rgba(136, 181, 231, 0.84), rgba(0, 63, 135, 0.22), transparent);
        opacity: 0.8;
      }
#component-home .intro-copy p:not(.eyebrow){
        max-width: 33rem;
      }
#component-home .cta-row{
        margin-top: clamp(24px, 3vw, 34px);
      }
#component-home .cta-row--center{
        width: min(100%, 33rem);
        justify-content: center;
      }
#component-home .campus-photo{
        position: relative;
        min-height: clamp(360px, 37vw, 540px);
        margin: 0;
        overflow: hidden;
        border-radius: var(--radius-card);
        background: rgba(121, 166, 218, 0.18);
        box-shadow:
          0 40px 96px rgba(0, 63, 135, 0.16),
          0 16px 36px rgba(27, 27, 27, 0.12);
        isolation: isolate;
      }
#component-home .campus-photo::before{
        position: absolute;
        inset: 1px;
        z-index: 1;
        content: "";
        border-radius: inherit;
        border: 1px solid rgba(255, 255, 255, 0.48);
        pointer-events: none;
      }
#component-home .campus-photo > img:not(.photo-logo){
        position: absolute;
        inset: 0;
        z-index: -2;
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: saturate(1.04) contrast(1.02);
        transform: translateY(var(--intro-media-parallax)) scale(1.05);
        transition: transform 80ms linear;
        will-change: transform;
      }
#component-home .campus-photo::after{
        position: absolute;
        inset: 0;
        z-index: -1;
        content: "";
        pointer-events: none;
        background:
          linear-gradient(90deg, rgba(243, 248, 240, 0.5), rgba(243, 248, 240, 0.08) 48%, rgba(1, 43, 95, 0.24)),
          linear-gradient(180deg, rgba(27, 27, 27, 0.02), rgba(1, 43, 95, 0.24));
      }
#component-home .photo-logo{
        position: absolute;
        left: clamp(18px, 3vw, 34px);
        bottom: clamp(18px, 3vw, 34px);
        width: clamp(78px, 10vw, 128px);
        height: auto;
        padding: 12px;
        border-radius: 22px;
        background: rgba(255, 255, 255, 0.76);
        border: 1px solid rgba(255, 255, 255, 0.72);
        box-shadow:
          0 22px 42px rgba(0, 63, 135, 0.18),
          inset 0 1px 0 rgba(255, 255, 255, 0.84);
        backdrop-filter: blur(18px) saturate(150%);
        -webkit-backdrop-filter: blur(18px) saturate(150%);
      }
#component-home .photo-caption{
        position: absolute;
        right: clamp(18px, 3vw, 34px);
        bottom: clamp(18px, 3vw, 34px);
        max-width: min(330px, calc(100% - 180px));
        padding: 16px 18px;
        border-radius: 20px;
        color: var(--white);
        background: rgba(9, 19, 33, 0.5);
        border: 1px solid rgba(255, 255, 255, 0.2);
        font-size: clamp(0.82rem, 1vw, 0.96rem);
        font-weight: 600;
        line-height: 1.38;
        box-shadow: 0 18px 46px rgba(0, 0, 0, 0.24);
        backdrop-filter: blur(16px) saturate(140%);
        -webkit-backdrop-filter: blur(16px) saturate(140%);
      }
#component-home .flow-band{
        position: relative;
        isolation: isolate;
        z-index: 1;
        margin-top: clamp(-64px, -4vw, -44px);
        padding: clamp(28px, 3.2vw, 50px) 0 clamp(42px, 4vw, 66px);
        color: rgba(242, 248, 255, 0.92);
        background: #0a1829;
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.045),
          inset 0 -34px 74px rgba(0, 0, 0, 0.42),
          0 -18px 64px rgba(8, 20, 33, 0.18);
        overflow: hidden;
      }
#component-home .flow-band::before{
        position: absolute;
        inset: 0;
        z-index: -2;
        content: "";
        background:
          linear-gradient(rgba(136, 181, 231, 0.035) 1px, transparent 1px),
          linear-gradient(90deg, rgba(136, 181, 231, 0.03) 1px, transparent 1px);
        background-size: 78px 78px;
        opacity: 0.34;
      }
#component-home .flow-band::after{
        display: none;
        content: none;
      }
#component-home #home-lsa-coverflow,#component-home #home-lsa-coverflow *{
        box-sizing: border-box;
      }
#component-home #home-lsa-coverflow{
        --lsa-blue: #003f87;
        --lsa-sky: #79a6da;
        --card-size: 336px;
        --track-extra: 220px;
        --persp: 1400px;
        --cf-pad-top: 8px;
        --cf-pad-bottom: 46px;
        --dot-margin-top: 18px;
        --accent: #f2b200;
        --glass-edge: rgba(255, 255, 255, 0.74);
        --glass-shadow: rgba(0, 63, 135, 0.16);
        --cf-spring: cubic-bezier(0.16, 1.28, 0.36, 1);
        position: relative;
        width: 100%;
        min-height: clamp(500px, 58svh, 660px);
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: var(--cf-pad-top) 0 var(--cf-pad-bottom);
        overflow: hidden;
        color: rgba(242, 248, 255, 0.92);
        font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
        overscroll-behavior: auto;
        transform: translateY(var(--flow-content-parallax));
        transition: transform 80ms linear;
        will-change: transform;
      }
#component-home #home-lsa-coverflow::before{
        display: none;
        content: none;
      }
#component-home #home-lsa-coverflow::after{
        position: absolute;
        inset: 0;
        z-index: -1;
        content: "";
        pointer-events: none;
        background-image:
          linear-gradient(rgba(136, 181, 231, 0.038) 1px, transparent 1px),
          linear-gradient(90deg, rgba(136, 181, 231, 0.032) 1px, transparent 1px);
        background-size: 78px 78px;
        mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 88%, transparent);
        opacity: 0.44;
      }
#component-home .cf-wrap{
        width: 100%;
        max-width: 1520px;
        min-height: 0;
        margin: clamp(-54px, -3.4vw, -34px) auto 0;
        position: relative;
        flex: 0 1 auto;
        padding-inline: clamp(10px, 2vw, 28px);
        perspective: var(--persp);
        perspective-origin: 50% 38%;
      }
#component-home .cf-stage-floor{
        position: absolute;
        left: 50%;
        bottom: 100px;
        z-index: -1;
        width: min(1040px, 88%);
        height: 138px;
        pointer-events: none;
        transform: translateX(-50%);
        border-radius: 999px;
        background:
          radial-gradient(ellipse at center, rgba(121, 166, 218, 0.36) 0, rgba(0, 63, 135, 0.22) 42%, transparent 76%),
          linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0));
        filter: blur(24px);
        opacity: 0.72;
      }
#component-home .cf-stage-floor::before{
        position: absolute;
        inset: 38px 8% auto;
        height: 48px;
        content: "";
        border-radius: 999px;
        background:
          linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.02)),
          linear-gradient(90deg, rgba(121, 166, 218, 0.22), rgba(255, 255, 255, 0.06), rgba(121, 166, 218, 0.18));
        box-shadow:
          0 22px 50px rgba(0, 0, 0, 0.28),
          inset 0 1px 0 rgba(255, 255, 255, 0.2);
      }
#component-home .cf-wrap::before{
        position: absolute;
        left: 50%;
        bottom: 144px;
        z-index: -1;
        width: min(1100px, 90%);
        height: 1px;
        content: "";
        pointer-events: none;
        transform: translateX(-50%);
        background: linear-gradient(90deg, transparent, rgba(136, 181, 231, 0.44), transparent);
        opacity: 0.86;
      }
#component-home .cf-track{
        position: relative;
        height: calc(var(--card-size) + var(--track-extra));
        display: grid;
        place-items: center;
        transform-style: preserve-3d;
        opacity: 0;
        cursor: grab;
        touch-action: pan-y;
        user-select: none;
        -webkit-user-select: none;
        outline: none;
        transition: opacity 350ms ease;
      }
#component-home .cf-track.is-ready{
        opacity: 1;
      }
#component-home .cf-track.is-dragging{
        cursor: grabbing;
      }
#component-home .cf-track.is-scroll-fanning .cf-card{
        transition: transform 80ms linear, opacity 200ms ease;
      }
#component-home .cf-card{
        --card-tone-a: rgba(255, 255, 255, 0.98);
        --card-tone-b: rgba(236, 245, 255, 0.94);
        --card-glow-a: rgba(81, 194, 255, 0.13);
        --card-glow-b: rgba(124, 145, 255, 0.1);
        --card-glow-c: rgba(121, 166, 218, 0.1);
        --card-glow-d: rgba(255, 255, 255, 0.18);
        position: absolute;
        top: 50%;
        left: 50%;
        width: var(--card-size);
        height: var(--card-size);
        margin-top: calc(var(--card-size) * -0.5);
        margin-left: calc(var(--card-size) * -0.5);
        isolation: isolate;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        padding: clamp(12px, 1.55vw, 16px);
        border-radius: var(--radius-card);
        border: 1px solid rgba(255, 255, 255, 0.9);
        background:
          linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(250, 253, 255, 0.96) 45%, rgba(232, 243, 255, 0.92)),
          linear-gradient(180deg, var(--card-tone-a), var(--card-tone-b));
        box-shadow:
          0 52px 120px rgba(0, 0, 0, 0.42),
          0 20px 42px rgba(0, 24, 58, 0.24),
          0 0 52px rgba(121, 166, 218, 0.18),
          inset 0 1px 0 rgba(255, 255, 255, 0.86),
          inset 0 -1px 0 rgba(0, 63, 135, 0.06);
        
        transform-origin: center center;
        transform-style: preserve-3d;
        transition:
          transform 620ms var(--cf-spring),
          opacity 420ms ease,
          filter 420ms ease,
          box-shadow 320ms ease,
          border-color 320ms ease;
        contain: layout paint;
        will-change: transform;
        cursor: pointer;
      }
#component-home .cf-card::before{
        position: absolute;
        inset: -18%;
        z-index: 0;
        content: "";
        border-radius: inherit;
        pointer-events: none;
        background:
          radial-gradient(120% 150% at 34% 28%, var(--card-glow-a) 0 22%, transparent 62%),
          radial-gradient(130% 150% at 76% 68%, var(--card-glow-b) 0 20%, transparent 66%),
          radial-gradient(120% 140% at 54% 56%, var(--card-glow-c) 0 16%, transparent 60%),
          radial-gradient(120% 130% at 50% 94%, var(--card-glow-d) 0 18%, transparent 58%);
        mix-blend-mode: screen;
        opacity: 0.7;
        filter: blur(20px) saturate(114%);
        transform: translate3d(0, 0, -1px) scale(1);
        animation: home-card-field 13s ease-in-out infinite;
      }
#component-home .cf-card[data-id="welcome"]{
        --card-tone-a: rgba(255, 255, 255, 0.98);
        --card-tone-b: rgba(236, 245, 255, 0.94);
        --card-glow-a: rgba(81, 194, 255, 0.13);
        --card-glow-b: rgba(124, 145, 255, 0.1);
        --card-glow-c: rgba(121, 166, 218, 0.1);
      }
#component-home .cf-card[data-id="affiliation"]{
        --card-tone-a: rgba(255, 255, 255, 0.98);
        --card-tone-b: rgba(236, 245, 255, 0.94);
        --card-glow-a: rgba(81, 194, 255, 0.13);
        --card-glow-b: rgba(124, 145, 255, 0.1);
        --card-glow-c: rgba(121, 166, 218, 0.1);
      }
#component-home .cf-card[data-id="mission"]{
        --card-tone-a: rgba(255, 255, 255, 0.98);
        --card-tone-b: rgba(236, 245, 255, 0.94);
        --card-glow-a: rgba(81, 194, 255, 0.13);
        --card-glow-b: rgba(124, 145, 255, 0.1);
        --card-glow-c: rgba(121, 166, 218, 0.1);
      }
#component-home .cf-card[data-id="church"]{
        --card-tone-a: rgba(255, 255, 255, 0.98);
        --card-tone-b: rgba(236, 245, 255, 0.94);
        --card-glow-a: rgba(81, 194, 255, 0.13);
        --card-glow-b: rgba(124, 145, 255, 0.1);
        --card-glow-c: rgba(121, 166, 218, 0.1);
      }
#component-home .cf-card[data-id="hours"]{
        --card-tone-a: rgba(255, 255, 255, 0.98);
        --card-tone-b: rgba(236, 245, 255, 0.94);
        --card-glow-a: rgba(81, 194, 255, 0.13);
        --card-glow-b: rgba(124, 145, 255, 0.1);
        --card-glow-c: rgba(121, 166, 218, 0.1);
      }
#component-home .cf-card[data-id="weather"]{
        --card-tone-a: rgba(255, 255, 255, 0.98);
        --card-tone-b: rgba(236, 245, 255, 0.94);
        --card-glow-a: rgba(81, 194, 255, 0.13);
        --card-glow-b: rgba(124, 145, 255, 0.1);
        --card-glow-c: rgba(121, 166, 218, 0.1);
      }
#component-home .cf-card[data-id="verse"]{
        --card-tone-a: rgba(255, 255, 255, 0.98);
        --card-tone-b: rgba(236, 245, 255, 0.94);
        --card-glow-a: rgba(81, 194, 255, 0.13);
        --card-glow-b: rgba(124, 145, 255, 0.1);
        --card-glow-c: rgba(121, 166, 218, 0.1);
      }
#component-home .cf-card::after{
        position: absolute;
        inset: 1px;
        z-index: 0;
        content: "";
        border: 1px solid rgba(255, 255, 255, 0.34);
        border-radius: inherit;
        pointer-events: none;
        background:
          linear-gradient(120deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0.14) 32%, transparent 58%),
          linear-gradient(to bottom, rgba(255, 255, 255, 0.36), transparent 48%);
        box-shadow:
          inset 0 0 34px rgba(255, 255, 255, 0.16),
          inset 0 -22px 38px rgba(0, 63, 135, 0.035);
      }
#component-home .cf-card:hover{
        border-color: rgba(255, 255, 255, 0.9);
        box-shadow:
          0 58px 126px rgba(0, 0, 0, 0.46),
          0 20px 44px rgba(0, 24, 58, 0.24),
          0 0 54px rgba(121, 166, 218, 0.26),
          inset 0 1px 0 rgba(255, 255, 255, 0.82),
          inset 0 -1px 0 rgba(0, 63, 135, 0.06);
      }
#component-home .cf-card .inner{
        position: relative;
        z-index: 1;
        height: 100%;
        min-height: 0;
        display: flex;
        flex-direction: column;
        gap: 6px;
        padding: clamp(12px, calc(var(--card-size) * 0.047), 18px);
        overflow: hidden;
        pointer-events: none;
        border-radius: calc(var(--radius-card) - 8px);
        background:
          linear-gradient(180deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.14) 54%, rgba(238, 245, 255, 0.12)),
          linear-gradient(180deg, rgba(255, 255, 255, 0.2), transparent 68%);
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.72),
          inset 0 -18px 28px rgba(0, 63, 135, 0.04);
      }
#component-home .cf-card .inner > *{
        flex-shrink: 0;
      }
#component-home .cf-card[data-active="true"] .inner{
        pointer-events: auto;
      }
#component-home .cf-card h2{
        margin: 0 0 6px;
        font-size: clamp(18px, calc(var(--card-size) * 0.074), 27px);
        font-weight: 800;
        line-height: 0.96;
        letter-spacing: 0;
        color: transparent;
        background: linear-gradient(110deg, #003f87, #1f6fbc 42%, #79a6da 72%, #003f87);
        background-size: 180% 100%;
        -webkit-background-clip: text;
        background-clip: text;
        text-shadow: 0 10px 26px rgba(0, 63, 135, 0.12);
      }
#component-home .cf-card[data-active="true"] h2{
        animation: home-title-flow 11s ease-in-out infinite;
      }
#component-home .cf-kicker{
        margin: 0 0 8px;
        color: rgba(0, 63, 135, 0.56);
        font-size: clamp(8px, calc(var(--card-size) * 0.026), 11px);
        font-weight: 800;
        line-height: 1.2;
        letter-spacing: 0.12em;
        text-transform: uppercase;
      }
#component-home .cf-card h3{
        margin: 0 0 8px;
        color: rgba(1, 43, 95, 0.88);
        font-size: clamp(13px, calc(var(--card-size) * 0.059), 18px);
        font-weight: 700;
        line-height: 1.16;
      }
#component-home .cf-card p{
        margin: 0 0 8px;
        color: rgba(18, 32, 54, 0.74);
        font-size: clamp(11px, calc(var(--card-size) * 0.046), 15px);
        font-weight: 500;
        line-height: 1.36;
        text-wrap: pretty;
      }
#component-home .cf-card p strong{
        color: rgba(1, 43, 95, 0.92);
        font-weight: 800;
      }
#component-home .cf-card p.clamp{
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: var(--p-lines, 4);
      }
#component-home .cf-card[data-id="mission"] h2{
        font-size: clamp(18px, calc(var(--card-size) * 0.068), 25px);
        line-height: 1;
      }
#component-home .cf-card .mission-statement{
        margin-bottom: 4px;
        color: rgba(18, 32, 54, 0.78);
        font-size: clamp(9.5px, calc(var(--card-size) * 0.035), 12px);
        font-weight: 500;
        line-height: 1.27;
      }
#component-home .cf-card[data-id="church"] p.clamp{
        font-size: clamp(9.5px, calc(var(--card-size) * 0.038), 12px);
        line-height: 1.2;
        margin-bottom: 4px;
      }
#component-home .cf-card[data-id="church"] h2{
        font-size: clamp(17px, calc(var(--card-size) * 0.066), 24px);
        line-height: 0.94;
      }
#component-home .cf-card[data-id="church"] .cf-schedule{
        gap: 4px;
        margin-bottom: 6px;
      }
#component-home .cf-card[data-id="church"] .cf-schedule div{
        padding: 6px 8px;
      }
#component-home .cf-card[data-id="welcome"] p.clamp{
        font-size: clamp(12px, calc(var(--card-size) * 0.048), 15px);
      }
#component-home .cf-card .cf-list,#component-home .cf-card .cf-schedule{
        display: grid;
        gap: 6px;
        margin: 2px 0 10px;
      }
#component-home .cf-card .cf-list div,#component-home .cf-card .cf-schedule div{
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 8px;
        padding: 8px 10px;
        border-radius: 13px;
        background: rgba(255, 255, 255, 0.46);
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.66),
          0 8px 20px rgba(0, 63, 135, 0.06);
      }
#component-home .cf-card .cf-list span,#component-home .cf-card .cf-schedule span{
        color: rgba(18, 32, 54, 0.68);
        font-size: clamp(10px, calc(var(--card-size) * 0.041), 13px);
        font-weight: 700;
      }
#component-home .cf-card .cf-list strong,#component-home .cf-card .cf-schedule strong{
        color: var(--blue);
        font-size: clamp(10px, calc(var(--card-size) * 0.043), 13px);
        font-weight: 800;
        text-align: right;
        white-space: nowrap;
      }
#component-home .mission-points{
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: auto;
        padding-top: 10px;
      }
#component-home .mission-points span{
        padding: 6px 10px;
        border: 1px solid rgba(255, 255, 255, 0.6);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.48);
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.72),
          0 8px 18px rgba(0, 63, 135, 0.08);
        color: rgba(1, 43, 95, 0.8);
        font-size: clamp(10px, calc(var(--card-size) * 0.041), 13px);
        font-weight: 700;
        line-height: 1.15;
      }
#component-home .mission-values{
        display: grid;
        gap: 1px;
        margin-top: auto;
        padding-top: 6px;
        color: rgba(1, 43, 95, 0.68);
        font-size: clamp(8.5px, calc(var(--card-size) * 0.031), 10.5px);
        font-weight: 700;
        line-height: 1.3;
      }
#component-home .weather-stat{
        display: flex;
        align-items: baseline;
        gap: 8px;
        margin: 0 0 6px;
      }
#component-home .weather-temp{
        color: var(--blue-deep);
        font-size: clamp(34px, calc(var(--card-size) * 0.19), 60px);
        font-weight: 800;
        line-height: 0.88;
        letter-spacing: 0;
        text-shadow: 0 12px 26px rgba(0, 63, 135, 0.1);
      }
#component-home .weather-desc{
        max-width: 8ch;
        color: rgba(1, 43, 95, 0.72);
        font-size: clamp(12px, calc(var(--card-size) * 0.046), 16px);
        font-weight: 700;
        line-height: 1.02;
      }
#component-home .weather-copy{
        color: rgba(18, 32, 54, 0.62);
        font-size: clamp(10px, calc(var(--card-size) * 0.036), 12px);
      }
#component-home .verse-ref{
        display: inline-flex;
        align-items: center;
        width: fit-content;
        margin: 0 0 8px;
        padding: 6px 9px;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.48);
        color: var(--blue);
        font-size: clamp(9px, calc(var(--card-size) * 0.038), 12px);
        font-weight: 800;
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.7),
          0 8px 18px rgba(0, 63, 135, 0.06);
      }
#component-home .cf-card[data-id="codebreaker"]{
        background:
          linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(250, 253, 255, 0.96) 45%, rgba(232, 243, 255, 0.92)),
          linear-gradient(180deg, var(--card-tone-a), var(--card-tone-b));
      }
#component-home .codebreaker-mark{
        width: clamp(40px, calc(var(--card-size) * 0.172), 72px);
        height: clamp(40px, calc(var(--card-size) * 0.172), 72px);
        display: grid;
        place-items: center;
        margin-bottom: auto;
        color: #7eb5ff;
        filter: drop-shadow(0 12px 24px rgba(0, 63, 135, 0.34)) drop-shadow(0 0 18px rgba(126, 181, 255, 0.34));
        animation: home-codebreaker-icon-glow 3.6s ease-in-out infinite;
      }
#component-home .codebreaker-mark svg{
        width: 100%;
        height: 100%;
      }
#component-home .codebreaker-title{
        position: relative;
        width: max-content;
        max-width: 100%;
        margin-top: clamp(6px, calc(var(--card-size) * 0.03), 18px);
        color: transparent;
        background:
          linear-gradient(110deg, #eaf7ff 0%, #bfdfff 18%, #5aa3ff 34%, #1675f2 50%, #ffffff 58%, #7eb5ff 68%, #1e70de 100%);
        background-size: 260% 100%;
        -webkit-background-clip: text;
        background-clip: text;
        font-size: clamp(22px, calc(var(--card-size) * 0.12), 52px);
        font-weight: 800;
        line-height: 0.98;
        text-shadow: 0 0 26px rgba(80, 150, 240, 0.42);
        animation: home-codebreaker-word-flow 3.7s ease-in-out infinite;
      }
#component-home .codebreaker-title::before{
        position: absolute;
        z-index: -1;
        inset: -34% -18% -28%;
        content: "";
        border-radius: 999px;
        background: linear-gradient(115deg, rgba(126, 181, 255, 0.48), rgba(45, 125, 226, 0.18), transparent 72%);
        filter: blur(18px);
        opacity: 0.86;
        transform: scale(0.96);
        animation: home-codebreaker-title-aura 3.7s ease-in-out infinite;
      }
#component-home .codebreaker-subcopy{
        margin-top: 3px;
        color: rgba(1, 43, 95, 0.78);
        font-weight: 700;
      }
#component-home .cf-card[data-id="affiliation"] .logo-wrap{
        flex: 1;
        min-height: calc(var(--card-size) * 0.42);
        display: grid;
        place-items: center;
        margin-top: 4px;
      }
#component-home .cf-card[data-id="affiliation"] .logo-box{
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
        padding: clamp(8px, calc(var(--card-size) * 0.038), 14px);
        border-radius: 20px;
        background:
          linear-gradient(180deg, rgba(255, 255, 255, 0.48), rgba(237, 243, 255, 0.2));
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.72),
          inset 0 -16px 24px rgba(0, 63, 135, 0.04);
      }
#component-home .cf-card[data-id="affiliation"] .logo-img{
        max-width: 88%;
        max-height: 58%;
        width: auto;
        height: auto;
        object-fit: contain;
        border-radius: 20px;
        filter:
          drop-shadow(0 24px 38px rgba(0, 63, 135, 0.18))
          drop-shadow(0 10px 20px rgba(0, 0, 0, 0.14));
        opacity: 0;
        transition: opacity 220ms ease;
      }
#component-home .cf-card[data-id="affiliation"] .logo-img.is-ready{
        opacity: 1;
      }
#component-home .cf-card[data-id="affiliation"] .logo-fallback{
        font-size: clamp(20px, 2vw, 24px);
        font-weight: 800;
        letter-spacing: 0;
      }
#component-home .cf-card[data-id="affiliation"] .logo-fallback .oe{
        color: var(--accent);
      }
#component-home .glass-btn{
        position: relative;
        isolation: isolate;
        width: min(100%, clamp(148px, calc(var(--card-size) * 0.74), 240px));
        max-width: 100%;
        min-width: 0;
        min-height: clamp(31px, calc(var(--card-size) * 0.092), 40px);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        align-self: center;
        margin-top: auto;
        margin-bottom: 2px;
        padding: clamp(0.5em, calc(var(--card-size) * 0.01), 0.64em) clamp(0.84em, calc(var(--card-size) * 0.017), 1em);
        overflow: visible;
        border: 0;
        border-radius: 999px;
        color: #fff;
        background: linear-gradient(135deg, #88b6e8 0%, #2a6abb 46%, #003f87 100%);
        box-shadow:
          0 10px 18px rgba(0, 63, 135, 0.18),
          0 2px 6px rgba(0, 0, 0, 0.12);
        font-size: clamp(0.64rem, calc(var(--card-size) * 0.028), 0.8rem);
        font-weight: 800;
        letter-spacing: 0;
        text-decoration: none;
        white-space: nowrap;
        text-overflow: ellipsis;
        transform: translate3d(0, -2px, 18px) scale(var(--btn-scale, 1));
        will-change: transform;
        cursor: pointer;
        transition: box-shadow 240ms ease, filter 240ms ease;
      }
#component-home .cf-card .glass-btn,#component-home .cf-card .cf-list,#component-home .cf-card .cf-schedule,#component-home .cf-card .mission-values,#component-home .cf-card .weather-copy,#component-home .cf-card .verse-ref,#component-home .cf-card .codebreaker-subcopy,#component-home .cf-card .logo-box,#component-home .cf-card p.clamp{
        transition: opacity 260ms ease, transform 320ms var(--cf-spring), filter 320ms ease;
      }
#component-home .cf-card:not([data-active="true"]) .glass-btn{
        opacity: 0;
        transform: translate3d(0, 10px, 0) scale(0.92);
      }
#component-home .cf-card[data-depth="2"] .cf-list,#component-home .cf-card[data-depth="2"] .cf-schedule,#component-home .cf-card[data-depth="2"] .mission-values,#component-home .cf-card[data-depth="2"] .weather-copy,#component-home .cf-card[data-depth="2"] .codebreaker-subcopy{
        opacity: 0.5;
      }
#component-home .cf-card[data-depth="3"] .cf-list,#component-home .cf-card[data-depth="3"] .cf-schedule,#component-home .cf-card[data-depth="3"] .mission-values,#component-home .cf-card[data-depth="3"] .weather-copy,#component-home .cf-card[data-depth="3"] .codebreaker-subcopy,#component-home .cf-card[data-depth="3"] .verse-ref{
        opacity: 0;
        transform: translateY(10px);
      }
#component-home .cf-card[data-depth="2"] p.clamp{
        opacity: 0.66;
      }
#component-home .cf-card[data-depth="3"] p.clamp,#component-home .cf-card[data-depth="3"] .logo-box{
        opacity: 0.42;
      }
#component-home .glass-btn::before{
        display: none;
      }
#component-home .glass-btn::after{
        position: absolute;
        inset: -2px;
        z-index: -1;
        content: "";
        border-radius: inherit;
        background: linear-gradient(135deg, #88b6e8 0%, #2a6abb 46%, #003f87 100%);
        filter: blur(12px);
        opacity: 0;
        transition: opacity 240ms ease;
      }
#component-home .glass-btn:hover,#component-home .glass-btn:focus-visible{
        box-shadow:
          0 14px 24px rgba(0, 63, 135, 0.22),
          0 4px 10px rgba(0, 0, 0, 0.12);
        filter: saturate(1.04);
      }
#component-home .glass-btn:hover::after,#component-home .glass-btn:focus-visible::after{
        opacity: 0.4;
      }
#component-home .glass-btn:focus-visible,#component-home .cf-arrow:focus-visible,#component-home .cf-dot:focus-visible{
        outline: 3px solid rgba(242, 178, 0, 0.9);
        outline-offset: 4px;
      }
#component-home .cf-ctrl{
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        pointer-events: none;
      }
#component-home .cf-arrow{
        position: relative;
        width: clamp(48px, 4vw, 58px);
        height: clamp(48px, 4vw, 58px);
        display: grid;
        place-items: center;
        margin: 0 clamp(8px, 2vw, 18px);
        overflow: hidden;
        border: 1px solid rgba(255, 255, 255, 0.22);
        border-radius: 999px;
        color: rgba(225, 240, 255, 0.96);
        background: rgba(255, 255, 255, 0.08);
        box-shadow:
          0 16px 34px rgba(0, 0, 0, 0.36),
          inset 0 1px 0 rgba(255, 255, 255, 0.18);
        pointer-events: auto;
        cursor: pointer;
        transform: translateY(-4px) scale(var(--arrow-scale, 1));
        will-change: transform, box-shadow;
        backdrop-filter: blur(16px) saturate(160%);
        -webkit-backdrop-filter: blur(16px) saturate(160%);
        transition:
          transform 260ms var(--cf-spring),
          box-shadow 250ms ease,
          border-color 250ms ease;
      }
#component-home .cf-arrow::before{
        display: none;
      }
#component-home .cf-arrow:hover{
        border-color: rgba(255, 255, 255, 0.4);
        box-shadow:
          0 20px 42px rgba(0, 0, 0, 0.42),
          0 0 34px rgba(121, 166, 218, 0.2);
        transform: translateY(-7px) scale(var(--arrow-scale, 1.06));
      }
#component-home .cf-arrow svg{
        position: relative;
        z-index: 1;
        width: 21px;
        height: 21px;
        filter: drop-shadow(0 2px 7px rgba(0, 63, 135, 0.16));
      }
#component-home .cf-arrow path{
        stroke: currentColor;
      }
#component-home .cf-dots{
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        margin-top: var(--dot-margin-top);
        padding-inline: 18px;
      }
#component-home .cf-dot{
        width: 9px;
        height: 9px;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: rgba(203, 226, 255, 0.28);
        box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16), 0 4px 12px rgba(0, 0, 0, 0.28);
        cursor: pointer;
        transition: transform 280ms var(--cf-spring), background 220ms ease, width 280ms var(--cf-spring);
      }
#component-home .cf-dot.is-active{
        width: 28px;
        border-radius: 999px;
        background: #79a6da;
        transform: scale(1.05);
      }
#component-home .cf-card[data-active="true"]{
        filter: saturate(1.08) brightness(1.04);
        box-shadow:
          0 64px 130px rgba(0, 0, 0, 0.46),
          0 24px 44px rgba(0, 24, 58, 0.26),
          0 0 64px rgba(121, 166, 218, 0.3),
          inset 0 1px 0 rgba(255, 255, 255, 0.88),
          inset 0 -1px 0 rgba(0, 63, 135, 0.05);
      }
#component-home .cf-card[data-active="true"]:hover{
        transform: var(--card-transform) translateY(-6px) scale(1.018) !important;
      }
#component-home .story-section{
        position: relative;
        z-index: 3;
        margin: clamp(-46px, -3vw, -28px) 0 0;
        padding: clamp(10px, 1.4vw, 22px) clamp(18px, 3.4vw, 48px) clamp(64px, 8vw, 108px);
        overflow: hidden;
        border-radius: 24px;
        background: var(--continuity-bg);
        box-shadow:
          0 -42px 96px rgba(0, 24, 58, 0.2),
          0 38px 112px rgba(0, 24, 58, 0.14),
          inset 0 1px 0 rgba(255, 255, 255, 0.7);
        transform: translateY(var(--story-card-parallax));
        transition: transform 80ms linear;
        will-change: transform;
      }
#component-home .story-section::before{
        position: absolute;
        inset: 0;
        z-index: -1;
        content: "";
        pointer-events: none;
        border-radius: inherit;
        background:
          radial-gradient(46% 30% at 20% 10%, rgba(136, 181, 231, 0.12), transparent 72%),
          radial-gradient(36% 28% at 84% 18%, rgba(0, 63, 135, 0.045), transparent 74%);
      }
#component-home .story-grid{
        width: min(100%, 1220px);
        margin: 0 auto;
        display: grid;
        grid-template-columns: minmax(0, 0.82fr) minmax(420px, 1.32fr);
        gap: clamp(28px, 5vw, 74px);
        align-items: center;
      }
#component-home .story-copy h2{
        font-size: clamp(2rem, 4.4vw, 4.2rem);
      }
#component-home .story-copy{
        position: relative;
        max-width: 36rem;
      }
#component-home .lsavs{
        --accent: #003f87;
        --stroke: rgba(255, 255, 255, 0.14);
        --txt: #fff;
        --muted: rgba(255, 255, 255, 0.72);
        --radius: 24px;
        --halo: rgba(0, 63, 135, 0.45);
        --haloL: rgba(0, 63, 135, 0.35);
        --haloR: rgba(0, 63, 135, 0.35);
      }
#component-home .ap-shell{
        --radius: 24px;
        --txt: #fff;
        --stroke: rgba(255, 255, 255, 0.24);
        position: relative;
        isolation: isolate;
        overflow: clip;
        border-radius: var(--radius);
        background: #000;
        aspect-ratio: 16 / 9;
        box-shadow:
          0 0 92px var(--halo),
          0 44px 160px -20px rgba(0, 0, 0, 0.62),
          0 24px 70px rgba(0, 63, 135, 0.18);
      }
#component-home .ap-halo{
        position: absolute;
        
        inset: 0;
        z-index: 0;
        pointer-events: none;
        filter: blur(50px);
        background:
          radial-gradient(60% 70% at 20% 50%, var(--haloL) 0 50%, transparent 70%),
          radial-gradient(60% 70% at 80% 50%, var(--haloR) 0 50%, transparent 70%);
        opacity: 0.8;
      }
#component-home .ap-frame{
        position: absolute;
        inset: 0;
        z-index: 1;
        overflow: clip;
        border-radius: var(--radius);
      }
#component-home .ap-video,#component-home .ap-poster{
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        background: #000;
        transform: translateY(var(--story-media-parallax)) scale(1.04);
        transition: transform 80ms linear;
        will-change: transform;
      }
#component-home .ap-ambient{
        display: none;
        position: absolute;
        inset: -10%;
        z-index: 0;
        width: 120%;
        height: 120%;
        object-fit: cover;
        opacity: 0.85;
        pointer-events: none;
        filter: blur(110px) saturate(220%) brightness(1.15);
        transform: scale(1.15);
        mask-image: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.95) 30%, rgba(0, 0, 0, 0.6) 65%, transparent 100%);
      }
#component-home .ap-ui{
        position: absolute;
        inset: auto 14px 14px;
        z-index: 2;
        display: grid;
        color: var(--txt);
        transition: opacity 250ms ease;
      }
#component-home .ap-ui.is-hidden{
        opacity: 0;
        pointer-events: none;
      }
#component-home .ap-controls{
        align-self: end;
        display: grid;
        gap: 10px;
        padding: 12px;
        border-radius: 16px;
        background: linear-gradient(135deg, rgba(18, 32, 54, 0.64), rgba(18, 32, 54, 0.44));
        border: 1px solid var(--stroke);
        backdrop-filter: blur(10px) saturate(130%);
        -webkit-backdrop-filter: blur(10px) saturate(130%);
      }
#component-home .ap-seek{
        margin: 2px 4px 6px;
      }
#component-home .ap-row{
        display: flex;
        align-items: center;
        gap: 12px;
        flex-wrap: wrap;
      }
#component-home .ap-left{
        display: flex;
        align-items: center;
        gap: 10px;
        flex: 1;
      }
#component-home .ap-track{
        position: relative;
        width: 100%;
        height: 3px;
        overflow: hidden;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.16);
        cursor: pointer;
      }
#component-home .ap-buffered,#component-home .ap-fill{
        position: absolute;
        inset: 0 auto 0 0;
        width: 0%;
      }
#component-home .ap-buffered{
        background: rgba(255, 255, 255, 0.22);
      }
#component-home .ap-fill{
        background: linear-gradient(90deg, #79a6da, rgba(255, 255, 255, 0.9));
        box-shadow: 0 0 14px rgba(255, 255, 255, 0.35);
      }
#component-home .ap-handle{
        position: absolute;
        top: 50%;
        left: 0%;
        width: 12px;
        height: 12px;
        border: 2px solid rgba(0, 0, 0, 0.25);
        border-radius: 50%;
        background: #fff;
        box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
        transform: translate(-50%, -50%);
      }
#component-home .ap-btn{
        --size: 34px;
        width: var(--size);
        height: var(--size);
        display: grid;
        place-items: center;
        border: 1px solid var(--stroke);
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.08);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
        cursor: pointer;
        user-select: none;
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
        transition: transform 160ms ease, box-shadow 200ms ease;
      }
#component-home .ap-btn:hover{
        transform: translateY(-1px) scale(1.03);
      }
#component-home .ap-btn svg{
        width: 16px;
        height: 16px;
        fill: #fff;
        opacity: 0.95;
      }
#component-home .ap-time{
        min-width: 78px;
        color: var(--muted);
        font: 600 11px/1 ui-sans-serif, system-ui;
        text-align: center;
      }
#component-home .ap-mobile-play{
        position: absolute;
        inset: 0;
        z-index: 3;
        display: none;
        place-items: center;
        pointer-events: none;
      }
#component-home .ap-mobile-play svg{
        width: 64px;
        height: 64px;
        fill: #fff;
        opacity: 0.92;
        filter:
          drop-shadow(0 8px 24px rgba(0, 0, 0, 0.45))
          drop-shadow(0 0 18px rgba(0, 0, 0, 0.35));
        animation: home-apPulse 2.4s ease-in-out infinite;
      }
#component-home [data-reveal]{
        opacity: 0;
        transform: translateY(10px);
        transition: opacity 440ms var(--ease), transform 440ms var(--ease);
        transition-delay: var(--reveal-delay, 0ms);
      }
#component-home [data-reveal].is-visible{
        opacity: 1;
        transform: translateY(0);
      }
#component-home .hero-panel[data-reveal]{
        transform: translateY(calc(10px + var(--hero-panel-slide)));
      }
#component-home .hero-panel[data-reveal].is-visible{
        transform: translateY(var(--hero-panel-slide));
        transition: opacity 440ms var(--ease), transform 40ms linear;
      }
@keyframes home-codebreaker-word-flow{
        0%,
        100% {
          background-position: 0% 50%;
          filter: drop-shadow(0 0 10px rgba(58, 137, 241, 0.22));
        }

        45% {
          background-position: 100% 50%;
          filter: drop-shadow(0 0 22px rgba(126, 181, 255, 0.48));
        }

        64% {
          background-position: 72% 50%;
          filter: drop-shadow(0 0 16px rgba(255, 255, 255, 0.34));
        }
      }
@keyframes home-codebreaker-title-aura{
        0%,
        100% {
          opacity: 0.44;
          transform: scale(0.92) translateX(-4%);
        }

        50% {
          opacity: 0.95;
          transform: scale(1.08) translateX(5%);
        }
      }
@keyframes home-codebreaker-icon-glow{
        0%,
        100% {
          filter: drop-shadow(0 12px 24px rgba(0, 63, 135, 0.32)) drop-shadow(0 0 12px rgba(126, 181, 255, 0.24));
        }

        50% {
          filter: drop-shadow(0 12px 24px rgba(0, 63, 135, 0.32)) drop-shadow(0 0 28px rgba(126, 181, 255, 0.58));
        }
      }
@keyframes home-codebreaker-card-breathe{
        0%,
        100% {
          filter: saturate(1) brightness(1);
        }

        50% {
          filter: saturate(1.1) brightness(1.035);
        }
      }
@keyframes home-card-field{
        0%,
        100% {
          transform: translate3d(-1%, -1%, -1px) scale(1);
          opacity: 0.66;
          filter: blur(18px) saturate(108%);
        }

        50% {
          transform: translate3d(1.2%, 1%, -1px) scale(1.025);
          opacity: 0.82;
          filter: blur(20px) saturate(116%);
        }
      }
@keyframes home-hero-title-flow{
        0%,
        100% {
          background-position: 0% 50%;
        }

        50% {
          background-position: 100% 50%;
        }
      }
@keyframes home-hero-title-field{
        0%,
        100% {
          transform: translate3d(-1%, -1%, 0) scale(1);
          opacity: 0.52;
          filter: blur(14px) saturate(106%);
        }

        50% {
          transform: translate3d(1.2%, 1%, 0) scale(1.025);
          opacity: 0.76;
          filter: blur(16px) saturate(112%);
        }
      }
@keyframes home-title-flow{
        0%,
        100% {
          background-position: 0% 50%;
        }

        50% {
          background-position: 100% 50%;
        }
      }
@keyframes home-apPulse{
        0%,
        100% {
          transform: scale(1);
          opacity: 0.9;
        }

        50% {
          transform: scale(1.08);
          opacity: 1;
        }
      }
@media (min-width: 1001px){#component-home .story-copy{
          padding-top: 18px;
        }}
@media (min-width: 751px) and (max-width: 1000px){#component-home .hero{
          min-height: 600px;
        }
#component-home .lsa-update-crawler{
          top: 14px;
          width: calc(100% - 28px);
        }
#component-home .hero-panel,#component-home .story-grid{
          grid-template-columns: 1fr;
        }
#component-home .hero-panel{
          gap: 0;
          padding: clamp(18px, 3vw, 30px) clamp(22px, 4vw, 48px);
        }
#component-home .hero h1{
          max-width: 18ch;
          font-size: clamp(2.2rem, 6vw, 4.4rem);
          white-space: normal;
        }
#component-home .hero-actions{
          width: min(100%, 560px);
          min-width: 0;
          grid-template-columns: repeat(2, minmax(0, 1fr));
          justify-self: start;
        }
#component-home .intro-grid{
          grid-template-columns: 1fr;
        }
#component-home .lsa-note-scene{
          top: auto;
          right: clamp(38px, 8vw, 78px);
          bottom: clamp(62px, 8vw, 96px);
          left: auto;
          width: clamp(226px, 31vw, 270px);
        }
#component-home .campus-photo{
          min-height: clamp(360px, 52vw, 520px);
        }
#component-home .story-grid{
          gap: 28px;
        }
#component-home .story-copy{
          text-align: center;
        }
#component-home .story-copy p:not(.eyebrow){
          margin-inline: auto;
        }
#component-home .intro-copy::before,#component-home .story-copy::before{
          display: none;
        }}
@media (max-width: 750px){#component-home .hero{
          min-height: clamp(470px, 60svh, 610px);
        }
#component-home .lsa-update-crawler{
          top: max(10px, env(safe-area-inset-top));
          width: calc(100% - 20px);
          min-height: 36px;
          border-radius: 15px;
        }
#component-home .lsa-update-label{
          min-width: 78px;
          padding-inline: 11px;
          font-size: 0.6rem;
          letter-spacing: 0.06em;
        }
#component-home .lsa-update-group{
          gap: 22px;
          padding-inline: 16px;
          font-size: 0.7rem;
        }
#component-home .hero-inner{
          padding: clamp(26px, 8vw, 42px) 12px 18px;
        }
#component-home .hero-panel{
          grid-template-columns: 1fr;
          gap: 0;
          justify-items: center;
          text-align: center;
          padding: 14px 16px calc(18px + env(safe-area-inset-bottom));
          border: 1px solid rgba(255, 255, 255, 0.32);
          border-radius: 22px;
          background:
            linear-gradient(145deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.08)),
            rgba(9, 19, 33, 0.19);
          box-shadow:
            0 -14px 34px rgba(0, 24, 58, 0.12),
            0 18px 36px rgba(0, 24, 58, 0.15),
            0 2px 8px rgba(0, 24, 58, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.44);
          backdrop-filter: blur(18px) saturate(145%);
          -webkit-backdrop-filter: blur(18px) saturate(145%);
        }
#component-home .hero h1{
          max-width: 12.5ch;
          margin-inline: auto;
          font-size: clamp(1.5rem, 7vw, 2.3rem);
          line-height: 1.04;
          text-align: center;
          white-space: normal;
        }
#component-home .hero h1::before{
          inset: -12px -18px -16px;
          border-radius: 28px;
          filter: blur(14px) saturate(110%);
        }
#component-home .hero h1 strong{
          display: block;
          margin-top: 0.04em;
        }
#component-home .hero-copy{
          padding: 0;
          display: grid;
          justify-items: center;
        }
#component-home .hero-eyebrow{
          margin-bottom: 6px;
          font-size: clamp(0.62rem, 2.2vw, 0.74rem);
          text-align: center;
        }
#component-home .hero-actions,#component-home .cta-row{
          align-items: stretch;
        }
#component-home .hero-actions{
          display: grid;
          width: min(272px, 100%);
          min-width: 0;
          grid-template-columns: minmax(0, 1fr);
          justify-self: center;
          gap: 8px;
        }
#component-home .hero-actions .spring-btn--sky{
          display: none;
        }
#component-home .spring-btn{
          width: 100%;
          min-height: 40px;
          padding: 10px 14px;
          gap: 0.42em;
          font-size: clamp(0.7rem, 2.65vw, 0.82rem);
        }
#component-home .school-intro,#component-home .story-section{
          padding-inline: 14px;
        }
#component-home .school-intro{
          margin-top: calc(-34px - var(--intro-lift));
          padding-top: 38px;
          padding-bottom: 34px;
        }
#component-home .lsa-note-scene{
          top: auto;
          right: 16px;
          bottom: 68px;
          left: auto;
          width: min(218px, 57vw);
        }
#component-home .lsa-sticky-note{
          padding: 18px 18px 20px 20px;
        }
#component-home .lsa-note-adhesive{
          right: 17px;
          left: 17px;
          height: 21px;
        }
#component-home .lsa-note-eyebrow{
          margin-top: 6px;
          font-size: 0.58rem;
        }
#component-home .lsa-note-dismiss{
          width: 28px;
          height: 28px;
          font-size: 1rem;
        }
#component-home .lsa-note-title{
          font-size: clamp(1.34rem, 6vw, 1.64rem);
        }
#component-home .lsa-note-message{
          font-size: clamp(0.92rem, 4.4vw, 1.08rem);
          line-height: 1.2;
        }
#component-home .intro-grid,#component-home .story-grid{
          grid-template-columns: 1fr;
        }
#component-home .intro-copy h2,#component-home .story-copy h2{
          max-width: 9.4ch;
          margin-inline: auto;
          font-size: clamp(1.88rem, 10.6vw, 3.02rem);
          line-height: 0.98;
        }
#component-home .intro-copy,#component-home .story-copy{
          text-align: center;
        }
#component-home .intro-copy p:not(.eyebrow),#component-home .story-copy p:not(.eyebrow){
          margin-inline: auto;
        }
#component-home .cta-row{
          justify-content: center;
        }
#component-home .campus-photo{
          min-height: 470px;
        }
#component-home .photo-logo{
          width: 82px;
          padding: 10px;
        }
#component-home .photo-caption{
          left: 16px;
          right: 16px;
          bottom: 120px;
          max-width: none;
        }
#component-home .flow-band{
          margin-top: -42px;
          padding-top: 34px;
          padding-bottom: 36px;
        }
#component-home .intro-copy::before,#component-home .story-copy::before{
          display: none;
        }
#component-home #home-lsa-coverflow{
          min-height: clamp(500px, 64svh, 640px);
        }
#component-home .cf-wrap{
          margin-top: -26px;
          padding-inline: 0;
        }
#component-home .cf-stage-floor{
          bottom: 84px;
          width: min(100%, 96%);
          height: 104px;
        }
#component-home .cf-wrap::before{
          width: min(100%, 94%);
          bottom: 118px;
        }
#component-home .cf-arrow{
          display: none;
        }
#component-home .cf-card{
          padding: 12px;
        }
#component-home .cf-card .inner{
          gap: 8px;
          padding: 16px;
        }
#component-home .cf-card[data-id="mission"] .inner{
          gap: 8px;
          padding: 16px;
        }
#component-home .cf-card[data-id="mission"] .cf-kicker{
          margin-bottom: 4px;
          font-size: clamp(9px, calc(var(--card-size) * 0.032), 11px);
        }
#component-home .cf-card[data-id="mission"] h2{
          margin-bottom: 4px;
          font-size: clamp(21px, calc(var(--card-size) * 0.072), 26px);
        }
#component-home .cf-card[data-id="mission"] .mission-statement{
          margin-bottom: 3px;
          font-size: clamp(11px, calc(var(--card-size) * 0.041), 13px);
          line-height: 1.34;
        }
#component-home .cf-card[data-id="mission"] .mission-values{
          gap: 2px;
          padding-top: 5px;
          font-size: clamp(10px, calc(var(--card-size) * 0.035), 11.5px);
          line-height: 1.3;
        }
#component-home .cf-card h2{
          margin-bottom: 5px;
          font-size: clamp(20px, calc(var(--card-size) * 0.068), 24px);
        }
#component-home .cf-kicker{
          margin-bottom: 6px;
          font-size: clamp(9px, 2.2vw, 11px);
          letter-spacing: 0.1em;
        }
#component-home .cf-card p{
          margin-bottom: 6px;
          font-size: clamp(11px, calc(var(--card-size) * 0.045), 14px);
          line-height: 1.34;
        }
#component-home .cf-card .cf-list,#component-home .cf-card .cf-schedule{
          gap: 7px;
          margin: 4px 0 10px;
        }
#component-home .cf-card .cf-list div,#component-home .cf-card .cf-schedule div{
          padding: 9px 10px;
        }
#component-home .cf-card .cf-list span,#component-home .cf-card .cf-schedule span,#component-home .cf-card .cf-list strong,#component-home .cf-card .cf-schedule strong{
          font-size: clamp(11px, calc(var(--card-size) * 0.04), 12px);
        }
#component-home .mission-values,#component-home .weather-copy,#component-home .codebreaker-subcopy{
          font-size: clamp(10px, calc(var(--card-size) * 0.034), 11.5px);
        }
#component-home .weather-temp{
          font-size: clamp(34px, calc(var(--card-size) * 0.18), 56px);
        }
#component-home .weather-desc{
          font-size: clamp(12px, calc(var(--card-size) * 0.045), 15px);
        }
#component-home .cf-card[data-id="affiliation"] .logo-wrap{
          min-height: calc(var(--card-size) * 0.36);
        }
#component-home .glass-btn{
          min-height: 42px;
          font-size: clamp(0.72rem, calc(var(--card-size) * 0.03), 0.82rem);
        }
#component-home .cf-card[data-id="weather"] .weather-copy,#component-home .cf-card[data-id="codebreaker"] .codebreaker-subcopy,#component-home .cf-card[data-id="church"] p.clamp{
          display: block;
        }
#component-home .cf-card[data-id="church"] p.clamp{
          display: -webkit-box;
          -webkit-line-clamp: 3;
          -webkit-box-orient: vertical;
        }
#component-home .story-grid{
          gap: 24px;
        }
#component-home .story-copy p:not(.eyebrow){
          font-size: 0.98rem;
        }
#component-home .ap-ui,#component-home .ap-ambient{
          display: none !important;
        }
#component-home .ap-mobile-play{
          display: grid;
        }
#component-home .ap-shell.is-playing .ap-mobile-play{
          display: none;
        }
#component-home .intro-copy::after,#component-home .story-copy::after{
          inset: -18px -10px -22px -14px;
        }}
@media (max-width: 420px){#component-home .lsa-note-scene{
          right: 12px;
          bottom: 58px;
          width: min(196px, 56vw);
        }
#component-home .intro-copy h2,#component-home .story-copy h2{
          font-size: clamp(1.74rem, 11vw, 2.72rem);
        }
#component-home .hero h1{
          font-size: clamp(1.42rem, 7.4vw, 2.1rem);
        }
#component-home .campus-photo{
          min-height: 430px;
        }
#component-home .photo-caption{
          bottom: 104px;
          padding: 14px 15px;
        }}
#component-home .cf-card,#component-home .cf-card[data-id],#component-home .cf-card[data-active="true"]{
        background: #fff;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        box-shadow: 0 14px 28px rgba(0, 18, 43, 0.32),
          0 4px 10px rgba(0, 18, 43, 0.22);
      }
#component-home .cf-card::before{ display: none; }
#component-home .hero-inner{
        padding-bottom: 88px;
      }
#component-home .hero-panel{
        padding: clamp(26px, 2.6vw, 38px) clamp(24px, 3.8vw, 56px);
        border: 1px solid rgba(231, 244, 255, 0.42);
        border-radius: 30px;
        background:
          radial-gradient(ellipse at 0% 0%, rgba(121, 166, 218, 0.26), transparent 68%),
          linear-gradient(125deg, rgba(255, 255, 255, 0.12), transparent 48%),
          rgba(8, 28, 52, 0.64);
        box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.48),
          inset 0 -1px 0 rgba(121, 166, 218, 0.14),
          0 18px 44px rgba(0, 18, 43, 0.24);
        backdrop-filter: blur(24px) saturate(135%);
        -webkit-backdrop-filter: blur(24px) saturate(135%);
      }
#component-home .hero-panel::before{
        inset: 0 30px auto;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.76) 25%, rgba(121, 166, 218, 0.3) 75%, transparent);
      }
#component-home .hero-panel::after,#component-home .hero h1::before{
        display: none;
      }
#component-home .hero-copy{ gap: 16px; }
#component-home .hero-eyebrow{
        margin: 0;
        color: #e7f4ff;
        letter-spacing: 0.14em;
        text-shadow: none;
      }
#component-home .hero h1{
        color: #fff;
        line-height: 1.18;
        letter-spacing: -0.025em;
        text-shadow: 0 2px 12px rgba(0, 18, 43, 0.18);
      }
#component-home .hero-title-part{
        background: none;
        -webkit-text-fill-color: currentColor;
        -webkit-text-stroke: 0;
        animation: none;
        filter: none;
      }
#component-home .hero-title-strong{ color: #cce3fa; }
@media (max-width: 750px){#component-home .hero-inner{ padding-bottom: 78px; }
#component-home .hero-panel{ padding: 24px 20px; border-radius: 26px; }
#component-home .hero-copy{ gap: 14px; }
#component-home .hero-eyebrow{ line-height: 1.6; }}
@media (hover: hover){#component-home .ap-shell.hide-cursor{
          cursor: none;
        }}
@media (prefers-reduced-motion: reduce){#component-home *,#component-home *::before,#component-home *::after{
          animation-duration: 1ms !important;
          animation-iteration-count: 1 !important;
          scroll-behavior: auto !important;
          transition-duration: 1ms !important;
        }
#component-home .spring-btn,#component-home .glass-btn,#component-home .cf-card::before{
          transform: none !important;
        }
#component-home .lsa-update-crawler{
          opacity: 1;
          transform: translate(-50%, 0);
        }
#component-home .lsa-update-runner{
          width: 100%;
          animation: none !important;
        }
#component-home .lsa-update-group{
          min-width: 0;
          width: 100%;
          overflow: hidden;
        }
#component-home .lsa-update-group span{
          overflow: hidden;
          text-overflow: ellipsis;
        }
#component-home .lsa-update-group[aria-hidden="true"]{
          display: none;
        }
#component-home .lsa-note-scene.is-dismissing{
          opacity: 0;
          transform: translateY(28px);
          transition: opacity 180ms ease, transform 180ms ease;
        }}