/*==================================================
    GERMAINE — ACADEMIC PROGRAMMES
    "Explore Your Future Career" — futuristic WHITE
    interface (VisionOS / Fluent / Linear inspired).
    Fully scoped under .afp so nothing else is affected.
==================================================*/
.afp{
    --afp-ink:#102A5C;
    --afp-ink-2:#102A5C;
    --afp-blue:#EC4899;
    --afp-blue-2:#EC4899;
    --afp-cyan:#EC4899;
    --afp-gold:#EC4899;
    --afp-line:rgba(16, 42, 92, .10);
    --afp-glass:rgba(255, 255, 255, .72);
    --afp-glass-bd:rgba(255, 255, 255, .85);
    --afp-ease:.45s cubic-bezier(.25,.8,.25,1);

    position:relative;
    overflow:hidden;
    padding:74px 0 84px;
    color:var(--afp-ink);
    background:
        linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 34%, #FFFFFF 68%, #FFFFFF 100%);
    isolation:isolate;
}
@property --afp-a{ syntax:'<angle>'; inherits:false; initial-value:0deg; }

/* ---------- LAYER 1+3+4: blueprint grid + digital nodes + hexagons ---------- */
.afp::before{
    content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
    background-image:
        /* scattered glowing nodes (blue / cyan / gold) */
        radial-gradient(circle at 12% 22%, rgba(16, 42, 92, .35) 0 2px, transparent 3px),
        radial-gradient(circle at 82% 16%, rgba(16, 42, 92, .32) 0 3px, transparent 4px),
        radial-gradient(circle at 66% 40%, rgba(236, 72, 153, .30) 0 2px, transparent 3px),
        radial-gradient(circle at 30% 64%, rgba(16, 42, 92, .28) 0 2px, transparent 3px),
        radial-gradient(circle at 92% 70%, rgba(16, 42, 92, .30) 0 3px, transparent 4px),
        radial-gradient(circle at 48% 84%, rgba(236, 72, 153, .26) 0 2px, transparent 3px),
        radial-gradient(circle at 20% 90%, rgba(16, 42, 92, .28) 0 2px, transparent 3px),
        /* blueprint engineering grid */
        linear-gradient(rgba(16, 42, 92, .04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(16, 42, 92, .04) 1px, transparent 1px);
    background-size:
        100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%,
        40px 40px, 40px 40px;
    opacity:.9;
}
/* ---------- LAYER 2+5: circuit / neural network lines (SVG) ---------- */
.afp .afp-circuit{
    position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='600' fill='none'%3E%3Cg stroke='%23EC2D7A' stroke-opacity='0.10' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M40 120 H220 Q240 120 240 140 V240'/%3E%3Cpath d='M860 90 H660 Q640 90 640 110 V210'/%3E%3Cpath d='M120 520 V420 Q120 400 140 400 H360'/%3E%3Cpath d='M780 540 V440 Q780 420 760 420 H560'/%3E%3Cpath d='M460 60 V160 Q460 180 480 180 H600'/%3E%3C/g%3E%3Cg fill='%23EC2D7A' fill-opacity='0.5'%3E%3Ccircle cx='240' cy='240' r='3'/%3E%3Ccircle cx='640' cy='210' r='3'/%3E%3Ccircle cx='360' cy='400' r='3'/%3E%3Ccircle cx='560' cy='420' r='3'/%3E%3Ccircle cx='600' cy='180' r='3'/%3E%3C/g%3E%3C/svg%3E") center/cover no-repeat;
}
/* ---------- LAYER 6: aurora glow behind heading + LAYER 7: background pulse ---------- */
.afp .afp-aurora{
    position:absolute; top:-120px; left:50%; transform:translateX(-50%);
    width:1000px; height:640px; z-index:0; pointer-events:none;
    background:
        radial-gradient(closest-side, rgba(236, 72, 153, .20), transparent 70%),
        radial-gradient(closest-side, rgba(16, 42, 92, .16), transparent 72%);
    background-position:40% 40%, 62% 55%;
    background-repeat:no-repeat;
    filter:blur(30px);
    animation:afpPulse 18s ease-in-out infinite;
}
@keyframes afpPulse{
    0%,100%{ opacity:.85; transform:translateX(-50%) scale(1); }
    50%{ opacity:1; transform:translateX(-50%) scale(1.05); }
}
/* ---------- LAYER 7b: glass reflection sweep across whole section ---------- */
.afp .afp-reflect{
    position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.6;
    background:linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .5) 45%, transparent 60%);
    mix-blend-mode:screen;
}
/* ---------- Travelling light streaks ---------- */
.afp .afp-streak{
    position:absolute; z-index:1; pointer-events:none;
    height:2px; width:38%;
    background:linear-gradient(90deg, transparent, rgba(236, 72, 153, .55), rgba(16, 42, 92, .5), transparent);
    filter:blur(1.5px); opacity:.35; border-radius:4px;
    box-shadow:0 0 12px rgba(236, 72, 153, .5);
}
.afp .afp-streak.s1{ top:20%; left:-40%; animation:afpStreak 12s linear infinite; }
.afp .afp-streak.s2{ top:74%; left:-40%; width:30%; animation:afpStreak 16s linear infinite; animation-delay:4s; }
@keyframes afpStreak{ 0%{ transform:translateX(0); } 100%{ transform:translateX(380%); } }

/* floating light particles */
.afp .afp-particle{
    position:absolute; z-index:1; width:4px; height:4px; border-radius:50%;
    background:radial-gradient(circle, rgba(236, 72, 153, .9), transparent 70%);
    animation:afpFloat 9s ease-in-out infinite; opacity:0;
}
.afp .afp-particle:nth-child(1){ left:22%; top:30%; animation-delay:0s; }
.afp .afp-particle:nth-child(2){ left:70%; top:26%; width:3px; height:3px; background:radial-gradient(circle, rgba(16, 42, 92, .9), transparent 70%); animation-delay:1.5s; }
.afp .afp-particle:nth-child(3){ left:54%; top:60%; width:5px; height:5px; background:radial-gradient(circle, rgba(236, 72, 153, .8), transparent 70%); animation-delay:3s; }
.afp .afp-particle:nth-child(4){ left:34%; top:78%; animation-delay:4.5s; }
.afp .afp-particle:nth-child(5){ left:86%; top:66%; width:3px; height:3px; animation-delay:6s; }
@keyframes afpFloat{
    0%{ opacity:0; transform:translateY(0) scale(.8); }
    30%{ opacity:.8; }
    70%{ opacity:.6; }
    100%{ opacity:0; transform:translateY(-40px) scale(1.2); }
}

/* ---------- container ---------- */
.afp .afp-wrap{ position:relative; z-index:2; width:100%; max-width:1220px; margin:0 auto; padding:0 24px; }

/* ---------- heading ---------- */
.afp-eyebrow{
    display:block; text-align:center;
    font-family:var(--font-heading,'Poppins',sans-serif);
    font-size:.82rem; font-weight:700; letter-spacing:5px; text-transform:uppercase;
    color:var(--afp-blue); margin-bottom:10px;
}
.afp-title{
    text-align:center; font-family:var(--font-heading,'Poppins',sans-serif);
    font-weight:800; font-size:clamp(2.2rem,5vw,3.6rem); line-height:1.08;
    color:var(--afp-ink); margin:0 0 14px;
}
.afp-title .b{ color:var(--afp-blue); }
.afp-sub{
    text-align:center; max-width:620px; margin:0 auto 40px;
    font-size:1.05rem; line-height:1.7; color:var(--afp-ink-2);
}

/* ---------- floating glass panel ---------- */
.afp-panel{
    position:relative;
    display:grid; grid-template-columns:340px 1fr; gap:30px;
    padding:30px; border-radius:26px;
    background:rgba(255, 255, 255, .55);
    backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
    border:1px solid rgba(255, 255, 255, .8);
    box-shadow:0 40px 100px rgba(16, 42, 92, .10), inset 0 1px 0 rgba(255, 255, 255, .9);
}

/* column titles */
.afp-coltitle{
    display:flex; align-items:center; gap:10px;
    font-family:var(--font-heading,'Poppins',sans-serif);
    font-size:.82rem; font-weight:700; letter-spacing:2.5px; text-transform:uppercase;
    color:var(--afp-blue); margin-bottom:18px;
}
.afp-coltitle::after{ content:""; height:1px; flex:1; background:linear-gradient(90deg, rgba(16, 42, 92, .3), transparent); }
.afp-colhead{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.afp-viewall{
    font-size:.86rem; font-weight:700; color:var(--afp-blue); text-decoration:none;
    display:inline-flex; align-items:center; gap:7px; transition:var(--afp-ease);
}
.afp-viewall:hover{ gap:11px; }

/* ---------- glass card base + hover border energy ---------- */
.afp-card{
    position:relative; overflow:hidden; border-radius:18px;
    background:var(--afp-glass);
    backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
    border:1px solid var(--afp-glass-bd);
    box-shadow:0 30px 80px rgba(16, 42, 92, .08), 0 0 0 1px rgba(236, 72, 153, .05);
    transition:transform var(--afp-ease), box-shadow var(--afp-ease);
}
.afp-card::before{   /* travelling border energy (appears on hover) */
    content:""; position:absolute; inset:0; z-index:4; pointer-events:none;
    border-radius:18px; padding:1.5px;
    background:conic-gradient(from var(--afp-a), transparent 0 66%, var(--afp-blue) 82%, var(--afp-cyan) 90%, transparent 100%);
    -webkit-mask:linear-gradient(#102A5C 0 0) content-box, linear-gradient(#102A5C 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude;
    /* This conic-gradient custom-property animation used to run continuously
       on all 12 school cards at once even though it's only ever visible on
       hover (opacity:0 at rest) — 12 invisible per-frame gradient repaints,
       all the time, on every homepage load. animation-play-state:paused
       stops the browser computing it until the card is actually hovered. */
    opacity:0; transition:opacity var(--afp-ease); animation:afpTravel 3s linear infinite; animation-play-state:paused;
}
.afp-card:hover{ transform:translateY(-6px); box-shadow:0 40px 90px rgba(16, 42, 92, .16), 0 0 40px rgba(236, 72, 153, .18); }
.afp-card:hover::before{ opacity:1; animation-play-state:running; }
@keyframes afpTravel{ to{ --afp-a:360deg; } }

/* ---------- OUR SCHOOLS list ---------- */
.afp-schools{ display:flex; flex-direction:column; gap:14px; }
.afp-school{ display:flex; align-items:center; gap:0; padding:0; }
.afp-school-img{ width:78px; height:74px; flex-shrink:0; border-radius:16px 0 0 16px; overflow:hidden; }
.afp-school-img img{ width:100%; height:100%; object-fit:cover; }
.afp-school-body{ display:flex; align-items:center; gap:14px; flex:1; padding:12px 16px; }
.afp-hex{
    width:44px; height:44px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
    color:var(--afp-blue); font-size:1.1rem;
    background:rgba(236, 72, 153, .08); border:1px solid rgba(236, 72, 153, .2);
    clip-path:polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0 50%);
}
.afp-school.gold .afp-hex{ color:var(--afp-gold); background:rgba(236, 72, 153, .12); border-color:rgba(236, 72, 153, .3); }
.afp-school.cyan .afp-hex{ color:#102A5C; background:rgba(16, 42, 92, .12); border-color:rgba(236, 72, 153, 0.36); }
.afp-school.violet .afp-hex{ color:#EC4899; background:rgba(236, 72, 153, .1); border-color:rgba(236, 72, 153, .25); }
.afp-school.pink .afp-hex{ color:#EC4899; background:rgba(236, 72, 153, .1); border-color:rgba(236, 72, 153, .25); }
.afp-school-text{ flex:1; }
.afp-school-text h3{ font-family:var(--font-heading,'Poppins',sans-serif); font-size:1rem; font-weight:700; color:var(--afp-ink); margin:0 0 2px; }
.afp-school-text span{ font-size:.82rem; color:var(--afp-ink-2); }
.afp-school-go{ color:var(--afp-blue); font-size:.9rem; transition:var(--afp-ease); }
.afp-school:hover .afp-school-go{ transform:translateX(4px); }

/* ---------- "Explore All Programmes" capstone card ----------
   Reuses the school-card shell (same width, radius, border, hover
   lift + travelling-light) so it belongs to the same family. It
   grows slightly taller than its siblings — the brief asks this
   card to carry a title, a full description sentence and a button,
   which a single 74px photo row can't hold without truncating one
   of the three, so height is the one dimension that flexes. */
.afp-school-all{ align-items:stretch; }
.afp-school-all-icon{
    display:flex; align-items:center; justify-content:center;
    background:linear-gradient(135deg,#EC4899,#102A5C);
    color:#FFFFFF; font-size:1.4rem;
}
.afp-school-all .afp-school-body{ align-items:flex-start; flex-direction:column; gap:8px; padding:14px 18px; }
.afp-school-all .afp-school-text span{
    display:block; font-size:.78rem; line-height:1.45; color:var(--afp-ink-2); font-weight:400;
}
.afp-school-cta{
    display:inline-flex; align-items:center; gap:7px;
    padding:7px 14px; border-radius:50px;
    background:rgba(236, 72, 153, .1); color:#EC4899;
    font-size:.78rem; font-weight:700;
    transition:var(--afp-ease);
}
.afp-school-all:hover .afp-school-cta{ background:#EC4899; color:#FFFFFF; gap:10px; }

/* ---------- programmes grid ---------- */
.afp-prog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.afp-prog{ display:flex; flex-direction:column; text-decoration:none; }
.afp-prog-img{ position:relative; height:120px; overflow:hidden; }
.afp-prog-img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.afp-prog:hover .afp-prog-img img{ transform:scale(1.07); }
.afp-tag{
    position:absolute; top:12px; left:12px; z-index:3;
    padding:5px 12px; border-radius:50px; font-size:.66rem; font-weight:800; letter-spacing:1px;
    color:#FFFFFF; background:linear-gradient(135deg,var(--afp-blue),var(--afp-blue-2));
    box-shadow:0 6px 16px rgba(16, 42, 92, .35);
}
.afp-tag.cert{ background:linear-gradient(135deg,#102A5C,#102A5C); box-shadow:0 6px 16px rgba(16, 42, 92, .3), 0 0 18px rgba(236, 72, 153, 0.3); }
.afp-tag.gold{ background:linear-gradient(135deg,#EC4899,#EC4899); box-shadow:0 6px 16px rgba(236, 72, 153, .3); }
.afp-tag.cyan{ background:linear-gradient(135deg,#102A5C,#EC4899); box-shadow:0 6px 16px rgba(16, 42, 92, .3), 0 0 18px rgba(236, 72, 153, 0.3); }
.afp-tag.violet{ background:linear-gradient(135deg,#EC4899,#EC4899); box-shadow:0 6px 16px rgba(236, 72, 153, .3); }
.afp-tag.pink{ background:linear-gradient(135deg,#EC4899,#EC4899); box-shadow:0 6px 16px rgba(236, 72, 153, .3); }
.afp-prog-body{ padding:16px 16px 18px; display:flex; flex-direction:column; flex:1; }
.afp-prog-body h4{ font-family:var(--font-heading,'Poppins',sans-serif); font-size:1rem; font-weight:700; line-height:1.3; color:var(--afp-ink); margin:0 0 10px; }
.afp-prog-dur{ display:inline-flex; align-items:center; gap:7px; font-size:.82rem; color:var(--afp-ink-2); margin-bottom:14px; }
.afp-prog-dur i{ color:var(--afp-blue); }
.afp-prog-explore{ margin-top:auto; display:inline-flex; align-items:center; gap:7px; font-size:.86rem; font-weight:700; color:var(--afp-blue); transition:var(--afp-ease); }
.afp-prog:hover .afp-prog-explore{ gap:11px; }


.afp-band{
    position:relative; z-index:2;
    display:grid; grid-template-columns:1.1fr 1fr; gap:24px; margin-top:26px;
}
.afp-stats{
    display:grid; grid-template-columns:repeat(4,1fr); gap:6px; padding:26px 20px;
    border-radius:22px; background:rgba(255, 255, 255, .6);
    backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
    border:1px solid rgba(255, 255, 255, .8); box-shadow:0 30px 70px rgba(16, 42, 92, .08), 0 0 18px rgba(236, 72, 153, 0.16);
    text-align:center;
}
.afp-stat i{ font-size:1.4rem; color:var(--afp-blue); margin-bottom:8px; display:block; }
.afp-stat:nth-child(2) i{ color:var(--afp-gold); }
.afp-stat:nth-child(3) i{ color:var(--afp-blue-2); }
.afp-stat:nth-child(4) i{ color:#102A5C; }
.afp-stat h3{ font-family:var(--font-heading,'Poppins',sans-serif); font-weight:800; font-size:1.7rem; color:var(--afp-ink); margin:0 0 3px; }
.afp-stat span{ font-size:.78rem; color:var(--afp-ink-2); line-height:1.3; display:block; }

.afp-cta{
    position:relative; overflow:hidden; padding:34px 36px; border-radius:24px;
    background:
        linear-gradient(120deg, rgba(255, 255, 255, .72) 0%, rgba(255, 255, 255, .62) 55%, rgba(255, 255, 255, .6) 100%);
    backdrop-filter:blur(24px) saturate(140%); -webkit-backdrop-filter:blur(24px) saturate(140%);
    border:1px solid rgba(255, 255, 255, .85); box-shadow:0 30px 80px rgba(16, 42, 92, .1), 0 8px 26px rgba(255, 255, 255, .4);
    display:flex; flex-direction:column; justify-content:center;
}
@property --afp-a{ syntax:'<angle>'; inherits:false; initial-value:0deg; }
@keyframes afpTravel{ to{ --afp-a:360deg; } }
.afp-cta-glass::before{
    content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
    border-radius:inherit; padding:1px;
    background:conic-gradient(from var(--afp-a),
        transparent 0 64%, #EC4899 78%, #FFFFFF 86%, #102A5C 94%, transparent 100%);
    -webkit-mask:linear-gradient(#102A5C 0 0) content-box, linear-gradient(#102A5C 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude;
    /* This CTA panel sits at the bottom of the Academic Programmes section
       and used to run its conic-gradient repaint continuously even while
       scrolled far out of view. Paused by default; academic-programmes.js
       adds .afp-anim-visible via IntersectionObserver only while the panel
       is actually on screen, same pattern already proven on Partner With Us. */
    animation:afpTravel 14s linear infinite; animation-play-state:paused;
}
.afp-cta-glass.afp-anim-visible::before{ animation-play-state:running; }
.afp-cta-float-icon{
    position:absolute; top:22px; right:26px; z-index:1;
    width:46px; height:46px; border-radius:14px;
    display:flex; align-items:center; justify-content:center; font-size:1.15rem; color:#FFFFFF;
    background:linear-gradient(135deg,#EC4899,#102A5C);
    box-shadow:0 10px 26px rgba(236, 72, 153, .35);
    animation:afpFloatIcon 6s ease-in-out infinite;
}
@keyframes afpFloatIcon{ 0%,100%{ transform:translateY(-3px); } 50%{ transform:translateY(4px); } }
.afp-cta > *{ position:relative; z-index:1; }
.afp-cta .sm{ font-family:var(--font-heading,'Poppins',sans-serif); font-weight:700; color:var(--afp-ink); font-size:1rem; margin-bottom:2px; }
.afp-cta .big{
    font-family:var(--font-heading,'Poppins',sans-serif); font-weight:800; font-size:1.9rem; line-height:1.15;
    background:linear-gradient(100deg, var(--afp-ink) 0%, #EC4899 60%, #102A5C 100%);
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
    max-width:320px;
}
.afp-cta p{ font-size:.92rem; color:var(--afp-ink-2); margin:10px 0 18px; max-width:340px; }
.afp-btn{
    position:relative; overflow:hidden; align-self:flex-start;
    display:inline-flex; align-items:center; gap:10px; padding:14px 26px; border-radius:14px;
    background:linear-gradient(135deg, var(--afp-blue), #102A5C); color:#FFFFFF; text-decoration:none;
    font-family:var(--font-button,'Montserrat',sans-serif); font-weight:600; font-size:.9rem;
    box-shadow:0 14px 30px rgba(16, 42, 92, .35); transition:transform var(--afp-ease), box-shadow var(--afp-ease);
}
.afp-btn-neon{
    background:linear-gradient(115deg, #EC4899 0%, #EC4899 50%, #102A5C 100%);
    background-size:200% 200%;
    box-shadow:0 14px 32px rgba(236, 72, 153, .32);
    animation:afpBtnGradient 6s ease-in-out infinite;
}
@keyframes afpBtnGradient{ 0%,100%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } }
.afp-btn:hover{ transform:translateY(-3px); box-shadow:0 18px 38px rgba(16, 42, 92, .5); }
.afp-btn-neon:hover{ box-shadow:0 20px 44px rgba(236, 72, 153, .45); }
.afp-btn::after{  /* button shine sweep */
    content:""; position:absolute; top:0; left:-70%; width:45%; height:100%;
    background:linear-gradient(120deg, transparent, rgba(255, 255, 255, .5), transparent);
    transform:skewX(-20deg); translate:0;
    animation:afpShine 5s ease-in-out infinite; will-change:translate; pointer-events:none;
}
@keyframes afpShine{ 0%{ translate:0; } 55%,100%{ translate:444% 0; } }

@media (prefers-reduced-motion: reduce){
    .afp .afp-aurora, .afp .afp-streak, .afp .afp-particle, .afp-card::before, .afp-btn::after,
    .afp-cta-glass::before, .afp-cta-float-icon, .afp-btn-neon{ animation:none !important; }
}

/* ---------- responsive ---------- */
@media(max-width:992px){
    .afp-panel{ grid-template-columns:1fr; }
    .afp-prog-grid{ grid-template-columns:repeat(2,1fr); }
    .afp-band{ grid-template-columns:1fr; }
}
@media(max-width:640px){
    .afp{ padding:54px 0 60px; }
    .afp-prog-grid{ grid-template-columns:1fr; }
    .afp-stats{ grid-template-columns:1fr 1fr; gap:16px 6px; }
    .afp-cta-float-icon{ top:16px; right:16px; width:38px; height:38px; font-size:1rem; }
    .afp-panel{ padding:18px; }
}

/*==================================================
    REFINEMENTS v2 — HUD frames, neon edges, glows,
    stronger motion (to match the reference mockup)
==================================================*/

/* per-variant accent edge + glow colours */
.afp-card{ --afp-edge:rgba(236, 72, 153, .95); --afp-glow:rgba(236, 72, 153, .4); }
.afp-school.gold,   .afp-prog.gold  { --afp-edge:rgba(236, 72, 153, .98); --afp-glow:rgba(236, 72, 153, .45); }
.afp-school.cyan,   .afp-prog.cyan  { --afp-edge:rgba(16, 42, 92, .9);  --afp-glow:rgba(16, 42, 92, .4); }
.afp-school.violet, .afp-prog.violet{ --afp-edge:rgba(236, 72, 153, .95);  --afp-glow:rgba(236, 72, 153, .4); }
.afp-school.pink,   .afp-prog.pink  { --afp-edge:rgba(236, 72, 153, .95);  --afp-glow:rgba(236, 72, 153, .45); }
.afp-prog.cert{ --afp-edge:rgba(16, 42, 92, .95); --afp-glow:rgba(16, 42, 92, .45); }

/* chamfered HUD frame + neon edge + outer glow (glow follows the clip shape) */
.afp-card{
    --afp-chamfer:polygon(15px 0, 100% 0, 100% calc(100% - 15px), calc(100% - 15px) 100%, 0 100%, 0 15px);
    clip-path:var(--afp-chamfer);
    border:none !important;
    box-shadow:none !important;
    filter:drop-shadow(0 22px 34px rgba(16, 42, 92, .14)) drop-shadow(0 0 8px var(--afp-glow));
    transition:transform .45s cubic-bezier(.25,.8,.25,1), filter .45s ease;
}
/* bright neon edge tracing the chamfer (always on) */
.afp-card::after{
    content:""; position:absolute; inset:0; z-index:5; pointer-events:none;
    clip-path:var(--afp-chamfer); padding:1.6px;
    background:linear-gradient(135deg, var(--afp-edge), rgba(255, 255, 255, .4) 45%, var(--afp-edge));
    -webkit-mask:linear-gradient(#102A5C 0 0) content-box, linear-gradient(#102A5C 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude;
    opacity:.85;
}
/* hover: lift 8px + intensified neon glow */
.afp-card:hover{
    transform:translateY(-8px);
    filter:drop-shadow(0 34px 56px rgba(16, 42, 92, .22)) drop-shadow(0 0 18px var(--afp-glow));
}
.afp-card:hover::after{ opacity:1; }
/* keep the travelling conic trace on hover, clipped to the chamfer */
.afp-card::before{ clip-path:var(--afp-chamfer); z-index:6; }

/* programme image — neon inner frame + glow on hover */
.afp-prog-img{ box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--afp-edge) 55%, transparent), inset 0 0 18px rgba(255, 255, 255, .15); }
.afp-prog:hover .afp-prog-img{ box-shadow:inset 0 0 0 2px var(--afp-edge), inset 0 0 26px var(--afp-glow); }
.afp-prog:hover .afp-prog-img img{ filter:brightness(1.06) saturate(1.08); }

/* school thumbnail — accent inner edge */
.afp-school-img{ box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--afp-edge) 45%, transparent); }

/* hexagon icon — soft neon glow */
.afp-hex{ box-shadow:0 0 16px color-mix(in srgb, var(--afp-edge) 30%, transparent); }

/* ---------- stronger ambient glows ---------- */
.afp .afp-aurora{
    background:
        radial-gradient(closest-side, rgba(236, 72, 153, .28), transparent 70%),
        radial-gradient(closest-side, rgba(16, 42, 92, .22), transparent 72%);
    filter:blur(34px);
}

/* ---------- moving circuit pulses + shimmer ---------- */
.afp .afp-circuit{ animation:afpCircuit 24s linear infinite; }
@keyframes afpCircuit{
    0%{ background-position:0 0; opacity:.4; }
    50%{ opacity:.6; }
    100%{ background-position:60px 30px; opacity:.4; }
}
.afp .afp-reflect{ background-size:300% 100%; animation:afpShimmer 9s ease-in-out infinite; }
@keyframes afpShimmer{ 0%{ background-position:120% 0; } 100%{ background-position:-40% 0; } }

/* extra micro particles */
.afp .afp-particle:nth-child(6){ left:12%; top:52%; width:3px; height:3px; background:radial-gradient(circle, rgba(16, 42, 92, .9), transparent 70%); animation:afpFloat 8s ease-in-out infinite; animation-delay:2.2s; }
.afp .afp-particle:nth-child(7){ left:62%; top:44%; width:4px; height:4px; animation:afpFloat 10s ease-in-out infinite; animation-delay:5.5s; }
.afp .afp-particle:nth-child(8){ left:78%; top:82%; width:3px; height:3px; background:radial-gradient(circle, rgba(236, 72, 153, .85), transparent 70%); animation:afpFloat 9s ease-in-out infinite; animation-delay:7s; }

/* ---------- CTA button: travelling highlight every 3s + blue pulse ---------- */
.afp-btn{ animation:afpBtnPulse 3s ease-in-out infinite; }
.afp-btn::after{ animation:afpShine 3s ease-in-out infinite; }
@keyframes afpBtnPulse{
    0%,100%{ box-shadow:0 14px 30px rgba(16, 42, 92, .35), 0 0 0 0 rgba(236, 72, 153, .45); }
    50%{ box-shadow:0 16px 34px rgba(16, 42, 92, .45), 0 0 0 8px rgba(236, 72, 153, 0); }
}

/* parallax layers get a smooth transform transition (JS drives --afp-px/--afp-py) */
.afp .afp-aurora,
.afp .afp-circuit{ will-change:transform; }

@media (prefers-reduced-motion: reduce){
    .afp .afp-circuit, .afp .afp-reflect, .afp-btn, .afp-btn::after{ animation:none !important; }
}

/*==================================================
    COMPACTION LAYER
    Tightens the Academic Programmes block: shorter
    section padding, compact horizontal school rows
    and slimmer programme cards. Appended last so it
    overrides the sizing above without touching the
    structure, glass styling or travelling borders.
==================================================*/

/* section + panel spacing */
.afp{ padding:2.5rem 0 3rem; }
.afp-panel{ padding:20px; gap:22px; }
.afp-coltitle{ margin-bottom:1rem; font-size:.76rem; }
.afp-colhead{ margin-bottom:1rem; }

/* ---------- OUR SCHOOLS — compact horizontal rows ---------- */
.afp-schools{ gap:.75rem; }
.afp-school{ min-height:75px; border-radius:12px; }
.afp-school-img{ width:52px; height:auto; align-self:stretch; border-radius:12px 0 0 12px; }
.afp-school-body{ gap:10px; padding:10px 14px; }
.afp-hex{ width:34px; height:34px; font-size:.86rem; }
.afp-school-text h3{ font-size:.95rem; line-height:1.2; margin:0; }
.afp-school-text span{ font-size:.75rem; margin-top:.2rem; display:block; opacity:.8; }
.afp-school-go{ font-size:.82rem; }

/* the "Explore All Programmes" capstone keeps its extra height */
.afp-school-all{ min-height:0; }
.afp-school-all .afp-school-body{ padding:12px 14px; gap:6px; }
.afp-school-all .afp-school-text span{ font-size:.74rem; line-height:1.4; }

/* ---------- MOST IN-DEMAND PROGRAMMES — slimmer cards ---------- */
.afp-prog-grid{ gap:.75rem; }
.afp-prog{ border-radius:12px; }
.afp-prog-img{ height:105px; }
.afp-prog-body{ padding:10px 12px 12px; }
.afp-prog-body h4{ font-size:.9rem; line-height:1.25; margin:0 0 .3rem; }
.afp-prog-dur{ font-size:.75rem; margin-bottom:.5rem; }
.afp-prog-explore{ font-size:.78rem; }
.afp-tag{ top:9px; left:9px; padding:4px 10px; font-size:.6rem; }

@media(max-width:900px){
    .afp{ padding:2rem 0 2.25rem; }
    .afp-panel{ padding:16px; }
}

/*==================================================
    COMPACTION LAYER 2
    Programme-count text removed from each school row;
    shrinks the row further (~25-30%) now that it only
    carries a title, and scales icon/type down to match.
    Same glass card, border, hover-lift and travelling
    border light — sizing only.
==================================================*/
.afp-school{ min-height:56px; }
.afp-school-img{ width:40px; }
.afp-school-body{ gap:8px; padding:7px 10px; }
.afp-hex{ width:26px; height:26px; font-size:.72rem; }
.afp-school-text h3{ font-size:.84rem; }
.afp-school-go{ font-size:.74rem; }
.afp-schools{ gap:.55rem; }

.afp-school-all{ min-height:0; }
.afp-school-all .afp-school-body{ padding:11px 13px; gap:5px; }
