/* ===== RESET ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:100%}
body{font-family:'Inter',system-ui,sans-serif;color:#1D1D1B;background:#F0F2F5;line-height:1.65}

/* ===== SKIP LINK ===== */
.sk{position:absolute;top:-100%;left:1rem;background:#1D1D1B;color:#FFCC29;padding:.7rem 1.2rem;z-index:9999;font-weight:700;border-radius:0 0 8px 8px;text-decoration:none;font-size:.95rem}
.sk:focus{top:0;outline:3px solid #FFCC29;outline-offset:2px}

/* ===== FOCUS ===== */
:focus-visible{outline:3px solid #1D1D1B;outline-offset:3px;border-radius:4px}

/* ===== HERO ===== */
.hero{background:linear-gradient(135deg,#4A1942 0%,#6B2D6D 40%,#8E3A8E 100%);color:#fff;padding:3rem 1.5rem 2.5rem;text-align:center;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:-60px;right:-60px;width:280px;height:280px;background:rgba(255,255,255,.04);border-radius:50%}
.hero::after{content:'';position:absolute;bottom:-40px;left:-40px;width:200px;height:200px;background:rgba(245,197,24,.06);border-radius:50%}
.hero-inner{position:relative;z-index:1;max-width:800px;margin:0 auto}
.hero svg.hero-deco{display:block;margin:0 auto 1.2rem;opacity:.9}
.hero h1{font-size:clamp(1.4rem,4vw,2.2rem);font-weight:900;line-height:1.25;margin-bottom:.7rem}
.hero h1 span{color:#F5C518;display:inline}
.hero .sub{font-size:clamp(.88rem,2vw,1.05rem);color:rgba(255,255,255,.88);max-width:680px;margin:0 auto 1.8rem;font-weight:400}
.kpi-row{display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem 2.5rem}
.kpi{text-align:center}
.kpi strong{display:block;font-size:clamp(1.8rem,4vw,2.6rem);font-weight:900;color:#F5C518;line-height:1.1}
.kpi span{font-size:.82rem;color:rgba(255,255,255,.75);font-weight:600;text-transform:uppercase;letter-spacing:.06em}

/* ===== NAV ===== */
.nav{background:#fff;padding:.55rem 1.5rem;position:sticky;top:0;z-index:100;box-shadow:0 2px 12px rgba(0,0,0,.08);border-bottom:3px solid #F5C518}
.nav ul{display:flex;flex-wrap:wrap;gap:.35rem .9rem;list-style:none;justify-content:center}
.nav a{color:#1D1D1B;text-decoration:none;font-weight:700;font-size:.85rem;padding:.35rem .55rem;border-radius:6px;transition:background .2s,color .2s}
.nav a:hover,.nav a:focus-visible{background:#6B2D6D;color:#fff}

/* ===== OVERVIEW STRIP ===== */
.ov{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin:2rem auto;max-width:1140px;padding:0 1.25rem}
.ov-card{background:#fff;border-radius:14px;padding:1.1rem 1.2rem;display:flex;align-items:center;gap:1rem;box-shadow:0 2px 8px rgba(0,0,0,.05);border-top:4px solid #ccc;transition:transform .2s,box-shadow .2s}
.ov-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.1)}
.ov-card.c1{border-top-color:#F5C518} .ov-card.c2{border-top-color:#003DA5} .ov-card.c3{border-top-color:#2196F3} .ov-card.c4{border-top-color:#7B1FA2}
.ov-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ov-icon.c1{background:rgba(245,197,24,.12)} .ov-icon.c2{background:rgba(0,61,165,.1)} .ov-icon.c3{background:rgba(33,150,243,.1)} .ov-icon.c4{background:rgba(123,31,162,.1)}
.ov-txt{display:flex;flex-direction:column}
.ov-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#777}
.ov-val{font-size:1.15rem;font-weight:800;color:#1D1D1B}

/* ===== ACCORDION ===== */
.acc-wrap{max-width:1140px;margin:0 auto 1rem;padding:0 1.25rem}
details{background:#fff;border:2px solid #E5E7EB;border-radius:12px;margin-bottom:.65rem;transition:border-color .2s}
details[open]{border-color:#F5C518}
summary{cursor:pointer;padding:.85rem 1.1rem;font-weight:700;font-size:.95rem;color:#1D1D1B;list-style:none;display:flex;align-items:center;gap:.55rem;border-radius:12px;transition:background .2s}
summary::-webkit-details-marker{display:none}
summary::before{content:"▶";font-size:.65rem;transition:transform .25s;flex-shrink:0;color:#6B2D6D}
details[open]>summary::before{transform:rotate(90deg)}
summary:hover,summary:focus-visible{background:#FAF5FF}
.acc-body{padding:.5rem 1.1rem 1.1rem}
.acc-body p{margin-bottom:.35rem;font-size:.92rem;color:#444}

/* ===== PHASE SECTION ===== */
.ph{margin:2.5rem auto 0;max-width:1140px;padding:0 1.25rem}
.ph-hd{display:flex;align-items:center;gap:.75rem;margin-bottom:.25rem}
.phb{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.95rem;color:#fff;flex-shrink:0}
.p1 .phb{background:#F5C518;color:#1D1D1B} .p2 .phb{background:#003DA5} .p3 .phb{background:#2196F3} .p4 .phb{background:#7B1FA2}
.ph h2{font-size:clamp(1.1rem,2.5vw,1.4rem);font-weight:800;color:#1D1D1B}
.ph .ph-sub{font-size:.85rem;color:#777;margin-bottom:1.1rem;padding-left:calc(36px + .75rem)}
.ph-line{height:2px;border:0;margin-bottom:1.3rem}
.p1 .ph-line{background:linear-gradient(90deg,#F5C518 0%,transparent 100%)}
.p2 .ph-line{background:linear-gradient(90deg,#003DA5 0%,#FFD100 50%,transparent 100%)}
.p3 .ph-line{background:linear-gradient(90deg,#2196F3 0%,transparent 100%)}
.p4 .ph-line{background:linear-gradient(90deg,#7B1FA2 0%,transparent 100%)}

/* ===== CARDS GRID ===== */
.cg{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:1.15rem;margin-bottom:1.5rem}

/* ===== CARD ===== */
.cd{background:#fff;border-radius:16px;padding:1.4rem 1.3rem 1.2rem;display:flex;flex-direction:column;position:relative;overflow:hidden;border-left:6px solid #ccc;box-shadow:0 2px 10px rgba(0,0,0,.05);transition:transform .25s,box-shadow .25s}
.cd:hover{transform:translateY(-4px);box-shadow:0 8px 28px rgba(0,0,0,.1)}
.p1 .cd{border-left-color:#F5C518} .p2 .cd{border-left-color:#003DA5} .p3 .cd{border-left-color:#2196F3} .p4 .cd{border-left-color:#7B1FA2}
.cd-num{position:absolute;top:-.2rem;right:.6rem;font-size:4.5rem;font-weight:900;opacity:.055;line-height:1;pointer-events:none;user-select:none}
.p1 .cd-num{color:#F5C518} .p2 .cd-num{color:#003DA5} .p3 .cd-num{color:#2196F3} .p4 .cd-num{color:#7B1FA2}

.cd-top{display:flex;align-items:flex-start;gap:1rem;margin-bottom:.7rem}
.cd-ill{width:70px;height:70px;flex-shrink:0;border-radius:14px;display:flex;align-items:center;justify-content:center}
.p1 .cd-ill{background:rgba(245,197,24,.1)} .p2 .cd-ill{background:rgba(0,61,165,.08)} .p3 .cd-ill{background:rgba(33,150,243,.08)} .p4 .cd-ill{background:rgba(123,31,162,.08)}
.cd-ill svg{width:40px;height:40px}
.cd h3{font-size:1rem;font-weight:700;color:#1D1D1B;line-height:1.35}

.cd-meta{display:flex;flex-wrap:wrap;gap:.4rem .9rem;margin-bottom:.55rem;font-size:.8rem;color:#666}
.cd-meta span{display:inline-flex;align-items:center;gap:.25rem}
.cd-desc{font-size:.85rem;color:#555;line-height:1.55;margin-bottom:.1rem}
.cd-note{font-size:.78rem;color:#888;font-style:italic;margin-top:.25rem}
.cd-spacer{flex:1}

/* ===== CARD BUTTON ===== */
.cd-btn{display:inline-flex;align-items:center;gap:.4rem;margin-top:.85rem;padding:.55rem 1.15rem;font-size:.85rem;font-weight:700;border-radius:10px;text-decoration:none;transition:transform .15s,background .2s,color .2s;align-self:flex-start;border:none;cursor:pointer}
.p1 .cd-btn{background:#F5C518;color:#1D1D1B} .p1 .cd-btn:hover{background:#1D1D1B;color:#F5C518}
.p2 .cd-btn{background:#003DA5;color:#fff} .p2 .cd-btn:hover{background:#002080}
.p3 .cd-btn{background:#2196F3;color:#fff} .p3 .cd-btn:hover{background:#1565C0}
.p4 .cd-btn{background:#7B1FA2;color:#fff} .p4 .cd-btn:hover{background:#6A1B9A}
.cd-btn:hover{transform:scale(1.04)}
.cd-btn:focus-visible{outline:3px solid #1D1D1B;outline-offset:3px}

.cd-dis{background:#E8E8E8 !important;color:#999 !important;cursor:not-allowed;pointer-events:none}
.cd.disabled{opacity:.72;border-left-color:#BDBDBD}
.cd.disabled .cd-ill{background:rgba(0,0,0,.04)}
.cd.disabled .cd-num{color:#BDBDBD}

/* ===== FOOTER ===== */
.ft{background:linear-gradient(135deg,#1D1D1B 0%,#2E2E2C 100%);color:rgba(255,255,255,.7);text-align:center;padding:2rem 1.25rem;margin-top:3rem;font-size:.85rem;line-height:1.8}
.ft strong{color:#F5C518}
.ft .ft-msg{font-size:.92rem;color:rgba(255,255,255,.55);margin-top:.3rem;font-style:italic}

/* ===== PRINT ===== */
@media print{.sk,.nav{display:none}body{background:#fff}.cd{break-inside:avoid;border:1px solid #ccc;box-shadow:none}.hero{background:#fff;color:#000;border-bottom:3px solid #000}.hero h1 span{color:#6B2D6D}.hero .sub{color:#333}.kpi strong{color:#6B2D6D}.ft{background:#fff;color:#333}}

/* ===== RESPONSIVE ===== */
@media(max-width:680px){.cg{grid-template-columns:1fr}.ov{grid-template-columns:repeat(2,1fr)}.nav ul{flex-direction:column;align-items:center}.kpi-row{gap:1rem 1.5rem}.hero{padding:2rem 1rem 1.8rem}}
@media(max-width:400px){.ov{grid-template-columns:1fr}}