/* Spherical Insights France magazine pages.
   Load after common9.css and style5.css; scoped classes avoid changing existing pages. */
.magazine-page {
    --magazine-ink: var(--text-primary-color, #17243a);
    --magazine-muted: var(--text-tertiary-color, #667085);
    --magazine-brand: var(--primary-bg-color, #173e70);
    --magazine-paper: var(--secondary-bg-color, #fff);
    color: var(--magazine-ink);
    min-height: 55vh;
    background: #f6f8fb;
    font-family: inherit;
}
.magazine-page * { box-sizing: border-box; }
.magazine-page a { text-decoration: none; }
.magazine-hero {
    position: relative; min-height: 330px; display: flex; align-items: center;
    padding: 72px max(6vw, 24px); overflow: hidden; color: #fff;
    background: #132c4d url("../assets/images/background.jpg") center/cover no-repeat;
}
.magazine-hero__shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,24,46,.94),rgba(12,47,83,.75),rgba(10,29,50,.35)); }
.magazine-hero__content { position:relative; z-index:1; max-width:850px; }
.magazine-eyebrow { margin:0 0 12px; color:var(--magazine-brand); font-size:.76rem; letter-spacing:.16em; font-weight:800; text-transform:uppercase; }
.magazine-hero .magazine-eyebrow { color:#dbe8f8; }
.magazine-hero h1 { margin:0 0 16px; color:#fff; font-size:clamp(2.2rem,5vw,4rem); line-height:1.08; font-weight:800; }
.magazine-hero__content > p:last-child { max-width:680px; margin:0; color:#f1f5f9; font-size:1.12rem; line-height:1.8; }
.magazine-section { width:min(1240px,92%); margin:0 auto; padding:62px 0 80px; }
.magazine-section__heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:30px; }
.magazine-section__heading h2 { margin:0 0 8px; font-size:clamp(1.7rem,3vw,2.4rem); color:var(--magazine-ink); }
.magazine-muted { margin:0; color:var(--magazine-muted); }
.magazine-count { flex-shrink:0; padding:9px 14px; border:1px solid #dbe3ed; border-radius:4px; color:var(--magazine-ink); background:#fff; font-size:.88rem; }
.magazine-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.magazine-card { overflow:hidden; display:flex; flex-direction:column; background:#fff; border:1px solid #e6ebf1; border-radius:8px; box-shadow:0 8px 28px rgba(20,38,61,.06); transition:transform .2s ease,box-shadow .2s ease; }
.magazine-card:hover { transform:translateY(-4px); box-shadow:0 16px 36px rgba(20,38,61,.12); }
.magazine-card__cover { position:relative; display:block; height:350px; overflow:hidden; background:#e9eef4; }
.magazine-card__cover img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.magazine-card:hover .magazine-card__cover img { transform:scale(1.035); }
.magazine-card__cover-label { position:absolute; left:14px; bottom:14px; padding:7px 10px; background:var(--magazine-brand); color:#fff; font-size:.68rem; font-weight:800; letter-spacing:.1em; }
.magazine-card__placeholder { width:100%; height:100%; min-height:250px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; color:#fff; background:linear-gradient(145deg,#142b49,#32618d); }
.magazine-card__placeholder i { font-size:3.3rem; }
.magazine-card__placeholder span { font-size:.8rem; letter-spacing:.2em; font-weight:800; }
.magazine-card__placeholder--large { min-height:520px; }
.magazine-card__body { display:flex; flex:1; flex-direction:column; padding:22px; }
.magazine-meta { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; margin-bottom:12px; color:var(--magazine-muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; }
.magazine-card__body h3 { margin:0 0 12px; font-size:1.35rem; line-height:1.35; }
.magazine-card__body h3 a { color:var(--magazine-ink); }
.magazine-card__body h3 a:hover { color:var(--magazine-brand); }
.magazine-card__body > p { margin:0 0 22px; color:var(--magazine-muted); line-height:1.7; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.magazine-link { display:inline-flex; align-items:center; gap:10px; margin-top:auto; color:var(--magazine-brand); font-weight:800; }
.magazine-link i { transition:transform .2s ease; }
.magazine-link:hover i { transform:translateX(4px); }
.magazine-empty { padding:65px 20px; text-align:center; border:1px dashed #cbd5e1; background:#fff; border-radius:8px; }
.magazine-empty > i { font-size:2.5rem; color:var(--magazine-brand); }
.magazine-empty h3 { margin:18px 0 8px; }
.magazine-empty p { margin:0; color:var(--magazine-muted); }
.magazine-breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:26px 0; color:var(--magazine-muted); font-size:.88rem; }
.magazine-breadcrumb a { color:var(--magazine-brand); font-weight:700; }
.magazine-breadcrumb i { font-size:.7rem; color:#9aa6b2; }
.magazine-detail { width:min(1160px,92%); margin:0 auto; padding:10px 0 80px; display:grid; grid-template-columns:minmax(280px, .82fr) minmax(0,1.18fr); align-items:start; gap:clamp(32px,6vw,76px); }
.magazine-detail__cover { overflow:hidden; background:#e9eef4; border-radius:6px; box-shadow:0 18px 45px rgba(20,38,61,.16); }
.magazine-detail__cover > img { display:block; width:100%; max-height:650px; object-fit:cover; }
.magazine-detail__content { padding:12px 0; }
.magazine-detail__content h1 { margin:0 0 20px; font-size:clamp(2rem,4vw,3.4rem); line-height:1.12; }
.magazine-detail__meta { display:flex; flex-wrap:wrap; gap:10px 18px; padding:0 0 22px; margin-bottom:22px; border-bottom:1px solid #dfe5ec; color:var(--magazine-muted); font-size:.9rem; }
.magazine-detail__meta span { display:inline-flex; gap:7px; align-items:center; }
.magazine-detail__content h2 { margin:0 0 12px; font-size:1.35rem; }
.magazine-detail__description,.magazine-feature p { color:var(--magazine-muted); line-height:1.85; }
.magazine-feature { margin:25px 0; padding:20px 22px; border-left:4px solid var(--magazine-brand); background:#fff; }
.magazine-feature h3 { margin:0 0 8px; font-size:1.2rem; }
.magazine-feature p:last-child { margin-bottom:0; }
.magazine-button { display:inline-flex; align-items:center; justify-content:center; gap:10px; margin:12px 12px 12px 0; padding:14px 22px; background:var(--magazine-brand); color:#fff !important; border:1px solid var(--magazine-brand); border-radius:4px; font-weight:800; transition:filter .2s ease; }
.magazine-button:hover { filter:brightness(1.12); }
.magazine-button--disabled { opacity:.65; cursor:not-allowed; }
.magazine-secondary-link { display:inline-flex; align-items:center; gap:8px; color:var(--magazine-brand); font-weight:700; }
.magazine-reader-page { padding:0 max(4%,24px) 70px; }
.magazine-reader-heading { display:flex; align-items:end; justify-content:space-between; gap:0px; padding-bottom:0px; }
.magazine-reader-heading .magazine-breadcrumb { padding-top:0px; }
.magazine-reader-heading h1 { margin:0; font-size:clamp(1.7rem,3vw,2.5rem); }
.magazine-pdf-shell { background:#e5eaf0; border:1px solid #d6dee8; border-radius:6px; overflow:hidden; }
.magazine-pdf-toolbar { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:14px 18px; background:#fff; border-bottom:1px solid #d6dee8; }
.magazine-pdf-toolbar span { font-weight:800; }
.magazine-pdf-toolbar a { color:var(--magazine-brand); font-weight:700; }
.magazine-pdf-frame { display:block; width:100%; height:min(82vh,1100px); min-height:620px; border:0; background:#fff; }
.magazine-pdf-note { margin:0; padding:12px 18px; color:var(--magazine-muted); font-size:.84rem; }
@media (max-width: 900px) {
  .magazine-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
  .magazine-card__cover { height:310px; }
  .magazine-detail { grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr); gap:30px; }
}
@media (max-width: 640px) {
  .magazine-hero { min-height:280px; padding:52px 22px; }
  .magazine-section { padding:42px 0 56px; }
  .magazine-section__heading { align-items:start; flex-direction:column; }
  .magazine-grid { grid-template-columns:1fr; }
  .magazine-card__cover { height:390px; }
  .magazine-detail { display:flex; flex-direction:column; width:90%; gap:26px; padding-bottom:50px; }
  .magazine-detail__cover { width:min(100%,420px); align-self:center; }
  .magazine-card__placeholder--large { min-height:420px; }
  .magazine-reader-heading { align-items:start; flex-direction:column; }
  .magazine-pdf-toolbar { align-items:flex-start; flex-direction:column; }
  .magazine-pdf-frame { min-height:500px; height:72vh; }
}



/* =========================================
   COVER-ONLY MAGAZINE GRID
   Match decisionsadvisors.com/magazine
   ========================================= */

.magazine-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 20px;
    align-items: start;
    width: 100%;
}

.magazine-card {
    display: block;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: none;
    border-radius: 7px;
    background: transparent;
    box-shadow: none;
}

.magazine-card__cover {
    display: block;
    position: relative;
    width: 100%;
    aspect-ratio: 2 / 3;
    overflow: hidden;
    border-radius: 7px;
    margin: 0;
    padding: 0;
    text-decoration: none;
    background: #f1f3f5;
}

.magazine-card__cover img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: inherit;
}

/* Remove all extra card information */
.magazine-card__cover-label,
.magazine-card__body {
    display: none !important;
}

/* Placeholder when no cover is available */
.magazine-card__placeholder {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: #f1f3f5;
    color: #6b7280;
}

.magazine-card__placeholder i {
    font-size: 36px;
}

.magazine-card__placeholder span {
    font-size: 12px;
    letter-spacing: 1px;
}

/* Four covers on smaller desktops */
@media (max-width: 1200px) {
    .magazine-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 18px;
    }
}

/* Three covers on tablets */
@media (max-width: 900px) {
    .magazine-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 16px;
    }
}

/* Two covers on mobile */
@media (max-width: 600px) {
    .magazine-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }
}








/* ==========================================
   MAGAZINE DETAIL PAGE - FRANCE DESIGN
   Compact layout, consistent typography
   ========================================== */

.magazine-page {
    width: 100%;
}

/* Breadcrumb */
.magazine-breadcrumb {
    max-width: 1480px;
    margin: 0 auto;
    padding: 18px 28px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 14px;
    line-height: 1.6;
    color: #475569;
}

.magazine-breadcrumb a {
    color: #8000a0;
    text-decoration: none;
    font-weight: 600;
}

.magazine-breadcrumb a:hover {
    text-decoration: underline;
}

.magazine-breadcrumb i {
    font-size: 11px;
    color: #94a3b8;
}

/* Main two-column layout */
.magazine-detail {
    width: calc(100% - 56px);
    max-width: 1320px;
    margin: 20px auto 60px;
    display: grid;
    grid-template-columns: minmax(280px, 420px) minmax(0, 1fr);
    align-items: start;
    gap: 64px;
}

/* Cover */
.magazine-detail__cover {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 35px rgba(15, 23, 42, 0.10);
}

.magazine-detail__cover img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 640px;
    object-fit: contain;
    object-position: top center;
    margin: 0;
    border-radius: 8px;
}

/* Right-side content */
.magazine-detail__content {
    width: 100%;
    min-width: 0;
    padding: 8px 0 0;
    color: #172033;
}

.magazine-detail__content .magazine-eyebrow {
    margin: 0 0 14px;
    color: #8000a0;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.5;
    letter-spacing: 2px;
    text-transform: uppercase;
}

/* Prevent the huge heading from the current page */
.magazine-detail__content h1 {
    margin: 0 0 20px;
    color: #8000a0;
    font-size: clamp(28px, 3vw, 42px);
    font-weight: 800;
    line-height: 1.16;
    letter-spacing: -0.8px;
    overflow-wrap: anywhere;
}

/* Date, issue number and type */
.magazine-detail__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 24px;
    margin: 0 0 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e2e8f0;
    color: #334155;
    font-size: 15px;
    line-height: 1.6;
}

.magazine-detail__meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.magazine-detail__meta i {
    color: #8000a0;
}

/* Section heading */
.magazine-detail__content h2 {
    margin: 0 0 12px;
    color: #8000a0;
    font-size: 25px;
    font-weight: 750;
    line-height: 1.3;
}

/* Description */
.magazine-detail__description {
    margin: 0 0 22px;
    color: #475569;
    font-size: 16px;
    line-height: 1.8;
}

/* Featured story */
.magazine-feature {
    margin: 24px 0;
    padding: 20px 22px;
    border: 1px solid #e2e8f0;
    border-left: 4px solid #8000a0;
    border-radius: 6px;
    background: #fff;
}

.magazine-feature .magazine-eyebrow {
    margin-bottom: 8px;
    font-size: 11px;
    letter-spacing: 1.5px;
}

.magazine-feature h3 {
    margin: 0 0 8px;
    color: #172033;
    font-size: 21px;
    line-height: 1.4;
}

.magazine-feature p:last-child {
    margin-bottom: 0;
    color: #475569;
    font-size: 15px;
    line-height: 1.7;
}

/* Buttons */
.magazine-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    margin: 8px 12px 8px 0;
    padding: 12px 22px;
    border: 1px solid #8000a0;
    border-radius: 5px;
    background: #8000a0;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    transition: background 0.2s ease, transform 0.2s ease;
}

.magazine-button:hover {
    background: #650080;
    color: #fff;
    transform: translateY(-1px);
}

.magazine-button--disabled {
    opacity: 0.65;
    cursor: not-allowed;
}

.magazine-secondary-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 46px;
    margin: 8px 0;
    padding: 11px 18px;
    border: 1px solid #cbd5e1;
    border-radius: 5px;
    color: #334155;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.2s ease;
}

.magazine-secondary-link:hover {
    background: #f1f5f9;
}

/* Tablet */
@media (max-width: 900px) {
    .magazine-detail {
        grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
        gap: 32px;
    }

    .magazine-detail__content h1 {
        font-size: 30px;
    }

    .magazine-detail__content h2 {
        font-size: 22px;
    }
}

/* Mobile */
@media (max-width: 650px) {
    .magazine-breadcrumb {
        padding: 14px 18px;
        font-size: 12px;
    }

    .magazine-detail {
        width: calc(100% - 36px);
        margin: 12px auto 36px;
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
    }

    .magazine-detail__cover {
        width: 100%;
        max-width: 340px;
    }

    .magazine-detail__cover img {
        max-height: none;
    }

    .magazine-detail__content {
        padding-top: 0;
    }

    .magazine-detail__content h1 {
        font-size: 29px;
        line-height: 1.2;
        letter-spacing: -0.4px;
    }

    .magazine-detail__content h2 {
        font-size: 22px;
    }

    .magazine-detail__description {
        font-size: 15px;
        line-height: 1.75;
    }

    .magazine-detail__meta {
        gap: 10px 16px;
        font-size: 14px;
    }

    .magazine-button,
    .magazine-secondary-link {
        width: 100%;
        margin: 7px 0;
        box-sizing: border-box;
    }
}