/* Meraki 365 Lab — inner pages (Resources, Done-For-You). Scoped to .m365-inner */
.m365-inner {--deep-navy:#082565; --royal-blue:#0C3691; --cobalt-blue:#1152A8; --sky-blue:#2C8CD8;
    --violet:#6E58CC; --lavender:#AA9BE6; --soft-orchid:#E0A6E9; --soft-pearl:#E7D4E7;
    --cream:#FBF8FD; --text:#101D43; --subtext:#5d6682; --white:#fff;
    --shadow:0 20px 50px rgba(8,37,101,.12);}
.m365-inner * {box-sizing:border-box; margin:0; padding:0;}
.m365-inner {font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background:var(--cream); color:var(--text); line-height:1.6;}
.m365-inner img {max-width:100%; display:block;}
.m365-inner a {color:inherit; text-decoration:none;}
.m365-inner .page {min-height:100vh; background:radial-gradient(circle at 12% 4%, rgba(224,166,233,.3), transparent 28%), radial-gradient(circle at 92% 18%, rgba(44,140,216,.2), transparent 28%), linear-gradient(180deg, #fff, var(--cream));}
.m365-inner .hero {max-width:1180px; margin:0 auto; padding:72px 5% 44px;}
.m365-inner .eyebrow {display:inline-flex; border-radius:999px; background:rgba(110,88,204,.1); color:var(--violet); font-weight:900; letter-spacing:.08em; text-transform:uppercase; font-size:.75rem; padding:.45rem .8rem; margin-bottom:1.1rem;}
.m365-inner h1 {font-size:clamp(2.4rem, 5vw, 4.4rem); line-height:1.03; color:var(--deep-navy); max-width:760px; letter-spacing:-.02em;}
.m365-inner .hero p {color:var(--subtext); font-size:1.08rem; max-width:660px; margin-top:1.1rem;}
.m365-inner .grid-wrap {max-width:1180px; margin:0 auto; padding:0 5% 80px;}
.m365-inner .resource-grid {display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:1rem;}
.m365-inner .resource-card {min-height:100%; display:flex; flex-direction:column; background:rgba(255,255,255,.86); border:1px solid rgba(17,82,168,.1); border-radius:22px; padding:1.25rem; box-shadow:0 16px 38px rgba(8,37,101,.08); transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;}
.m365-inner .resource-card:hover {transform:translateY(-5px); box-shadow:0 24px 54px rgba(8,37,101,.14); border-color:rgba(110,88,204,.28);}
.m365-inner .resource-logo {width:74px; height:74px; display:grid; place-items:center; border-radius:20px; background:linear-gradient(135deg, rgba(44,140,216,.1), rgba(224,166,233,.18)); margin-bottom:1.1rem;}
.m365-inner .resource-logo img {width:54px; height:54px; object-fit:contain;}
.m365-inner .resource-body {flex:1;}
.m365-inner .resource-card h2 {font-size:1.05rem; line-height:1.25; color:var(--deep-navy); margin-bottom:.55rem;}
.m365-inner .resource-card p {color:var(--subtext); font-size:.9rem;}
.m365-inner .resource-link {margin-top:1.2rem; display:inline-flex; justify-content:space-between; align-items:center; gap:.6rem; color:var(--white); background:linear-gradient(135deg, var(--violet), var(--soft-orchid)); border-radius:999px; padding:.72rem .95rem; font-weight:800; font-size:.88rem;}
@media (max-width: 980px){
.m365-inner .resource-grid {grid-template-columns:repeat(2, minmax(0,1fr));}
}
@media (max-width: 620px){
.m365-inner .hero {padding-top:48px;}
.m365-inner .resource-grid {grid-template-columns:1fr;}
}

/* Done-for-you */
.m365-inner .m365-dfy {--navy: #082565;
    --navy-2: #123a8a;
    --gold: #d99e2b;
    --gold-soft: #f4e3bd;
    --ink: #0e1a38;
    --muted: #5b6478;
    --line: #e6e9f0;
    --bg: #f7f8fb;
    --card: #ffffff;
    font-family: 'Poppins', 'Inter', system-ui, -apple-system, "Segoe UI", sans-serif;
    
    color: var(--ink);
    padding: 88px 24px;
    box-sizing: border-box;}
.m365-inner .m365-dfy *,
.m365-inner .m365-dfy *::before,
.m365-inner .m365-dfy *::after {box-sizing: border-box;}
.m365-inner .m365-dfy__inner {max-width: 1180px; margin: 0 auto;}
.m365-inner .m365-dfy__eyebrow {display: inline-block;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--gold);
    margin: 0 0 16px;}
.m365-inner .m365-dfy__title {font-size: clamp(28px, 4.4vw, 44px);
    line-height: 1.12;
    font-weight: 700;
    color: var(--navy);
    margin: 0 0 16px;
    max-width: 15ch;}
.m365-inner .m365-dfy__lead {font-size: clamp(16px, 1.6vw, 18px);
    line-height: 1.6;
    color: var(--muted);
    margin: 0 0 52px;
    max-width: 60ch;}
.m365-inner .m365-dfy__lead strong {color: var(--ink); font-weight: 600;}
.m365-inner .m365-dfy__grid {display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
    align-items: stretch;}
.m365-inner .m365-dfy__card {position: relative;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 30px 26px 32px;
    display: flex;
    flex-direction: column;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;}
.m365-inner .m365-dfy__card:hover {transform: translateY(-6px);
    box-shadow: 0 18px 40px -18px rgba(8, 37, 101, .35);
    border-color: #cdd5e6;}
.m365-inner .m365-dfy__card--featured {background: linear-gradient(160deg, var(--navy) 0%, var(--navy-2) 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 22px 46px -20px rgba(8, 37, 101, .6);}
.m365-inner .m365-dfy__card--featured:hover {box-shadow: 0 30px 56px -20px rgba(8, 37, 101, .7);}
.m365-inner .m365-dfy__badge {font-size: 11px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--muted);
    margin: 0 0 18px;}
.m365-inner .m365-dfy__card--featured .m365-dfy__badge {color: var(--gold-soft);}
.m365-inner .m365-dfy__ribbon {position: absolute;
    top: 18px;
    right: 18px;
    background: var(--gold);
    color: #3a2a05;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: 999px;}
.m365-inner .m365-dfy__name {font-size: 20px;
    font-weight: 700;
    margin: 0 0 12px;
    color: var(--navy);}
.m365-inner .m365-dfy__card--featured .m365-dfy__name {color: #fff;}
.m365-inner .m365-dfy__price {font-size: 38px;
    font-weight: 700;
    line-height: 1;
    color: var(--navy);
    margin: 0 0 6px;}
.m365-inner .m365-dfy__card--featured .m365-dfy__price {color: #fff;}
.m365-inner .m365-dfy__price span {font-size: 15px;
    font-weight: 500;
    color: var(--muted);}
.m365-inner .m365-dfy__card--featured .m365-dfy__price span {color: #b9c4e0;}
.m365-inner .m365-dfy__desc {font-size: 14.5px;
    line-height: 1.55;
    color: var(--muted);
    margin: 14px 0 22px;}
.m365-inner .m365-dfy__card--featured .m365-dfy__desc {color: #cdd6ec;}
.m365-inner .m365-dfy__list {list-style: none;
    margin: 0 0 28px;
    padding: 0;
    display: grid;
    gap: 12px;
    flex-grow: 1;}
.m365-inner .m365-dfy__list li {position: relative;
    padding-left: 28px;
    font-size: 14.5px;
    line-height: 1.5;
    color: var(--ink);}
.m365-inner .m365-dfy__card--featured .m365-dfy__list li {color: #e7ecf8;}
.m365-inner .m365-dfy__list li::before {content: "";
    position: absolute;
    left: 0;
    top: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--gold-soft);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23082565' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;}
.m365-inner .m365-dfy__list li strong {font-weight: 600;}
.m365-inner .m365-dfy__cta {display: block;
    text-align: center;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    padding: 14px 18px;
    border-radius: 12px;
    background: var(--navy);
    color: #fff;
    border: 1px solid var(--navy);
    transition: background .2s ease, color .2s ease, transform .15s ease;}
.m365-inner .m365-dfy__cta:hover {background: #061c4d; transform: translateY(-2px);}
.m365-inner .m365-dfy__card--featured .m365-dfy__cta {background: var(--gold);
    border-color: var(--gold);
    color: #3a2a05;}
.m365-inner .m365-dfy__card--featured .m365-dfy__cta:hover {background: #c98d1f;}
.m365-inner .m365-dfy__cta:focus-visible {outline: 3px solid var(--gold); outline-offset: 3px;}
.m365-inner .m365-dfy__note {margin: 40px auto 0;
    max-width: 760px;
    text-align: center;
    background: #fff;
    border: 1px dashed #c9d2e6;
    border-radius: 14px;
    padding: 22px 26px;
    font-size: 15px;
    line-height: 1.6;
    color: var(--muted);}
.m365-inner .m365-dfy__note strong {color: var(--navy);}
@media (max-width: 980px){
.m365-inner .m365-dfy__grid {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 560px){
.m365-inner .m365-dfy {padding: 64px 18px;}
.m365-inner .m365-dfy__grid {grid-template-columns: 1fr;}
}
@media (prefers-reduced-motion: reduce){
.m365-inner .m365-dfy__card,
.m365-inner .m365-dfy__cta {transition: none;}
.m365-inner .m365-dfy__card:hover,
.m365-inner .m365-dfy__cta:hover {transform: none;}
}