.magazine-authors {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: clamp(1.25rem, 2.4vw, 2rem);
    margin: clamp(3rem, 6vw, 5.5rem) 0;
}

.magazine-author-tile {
    display: grid;
    grid-template-columns: clamp(8rem, 10vw, 10.5rem) minmax(0, 1fr);
    align-items: start;
    gap: clamp(1.25rem, 2.2vw, 1.8rem);
    height: 100%;
    border: 1px solid rgb(255 255 255 / .16);
    border-radius: .55rem;
    background: linear-gradient(145deg, rgb(28 25 23 / .9), rgb(15 14 13 / .86));
    padding: clamp(1.25rem, 2.5vw, 1.8rem);
    box-shadow: 0 .9rem 2.4rem rgb(0 0 0 / .18);
    transition: border-color .2s, transform .2s, box-shadow .2s;
}

.magazine-author-tile:hover {
    border-color: rgb(255 34 34 / .65);
    box-shadow: 0 1.2rem 3rem rgb(0 0 0 / .32);
    transform: translateY(-2px);
}

.magazine-author-tile-photo {
    display: block;
    width: 100%;
    min-width: 0;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    border: 1px solid rgb(232 201 111 / .42);
    border-radius: .4rem;
    background: #0c0a09;
    box-shadow: 0 .65rem 1.6rem rgb(0 0 0 / .34);
    transition: border-color .2s, transform .2s;
}

.magazine-author-tile-photo:hover,
.magazine-author-tile-photo:focus-visible {
    border-color: #f22;
    outline: none;
    transform: scale(1.015);
}

.magazine-author-tile-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

.magazine-author-tile-photo > span {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    background: radial-gradient(circle at 50% 35%, #392f21, #0c0a09 72%);
    color: #e8c96f;
    font-family: var(--font-display);
    font-size: clamp(2rem, 4vw, 3.4rem);
}

.magazine-author-tile-copy {
    display: flex;
    min-width: 0;
    height: 100%;
    flex-direction: column;
}

.magazine-author-tile-copy h3 {
    margin: 0;
    color: #f5f5f4;
    font-family: var(--font-display);
    font-size: clamp(1.2rem, 1.7vw, 1.55rem);
    font-weight: 400;
    letter-spacing: .025em;
    line-height: 1.22;
    text-transform: uppercase;
}

.magazine-author-tile-copy h3 a {
    color: inherit;
    transition: color .2s;
}

.magazine-author-tile-copy h3 a:hover,
.magazine-author-tile-copy h3 a:focus-visible {
    color: #f22;
    outline: none;
}

.magazine-author-tile-copy > p {
    margin: 1rem 0 0;
    color: #c8c3bd;
    font-size: clamp(.92rem, 1vw, 1rem);
    line-height: 1.62;
}

.magazine-author-tile-link {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: .5rem;
    margin-top: auto;
    padding-top: 1.2rem;
    color: #e8c96f;
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    transition: color .2s;
}

.magazine-author-tile-link:hover,
.magazine-author-tile-link:focus-visible {
    color: #f22;
    outline: none;
}

.magazine-author-tile-link span {
    font-size: 1.05rem;
    line-height: 1;
}

.magazine-authors-empty {
    grid-column: 1 / -1;
    margin: 0;
    border-block: 1px solid rgb(255 255 255 / .15);
    padding: 1.5rem 0;
    color: #a8a29e;
}

@media (max-width: 560px) {
    .magazine-author-tile {
        grid-template-columns: 5.5rem minmax(0, 1fr);
        gap: 1rem;
        padding: 1rem;
    }

    .magazine-author-tile-copy h3 { font-size: 1.05rem; }
    .magazine-author-tile-copy > p { font-size: .9rem; }
}

.page-function__matrix-map {
    width: min(100%, 56rem);
    margin: clamp(1.5rem, 4vw, 3rem) auto;
    border: 1px solid rgb(232 201 111 / .3);
    border-radius: .65rem;
    padding: clamp(.5rem, 2vw, 1.5rem);
    background: radial-gradient(circle at 50% 45%, rgb(232 201 111 / .08), rgb(15 14 13 / .72) 66%);
}

.page-function__matrix-map svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}

.matrix-map__outer,
.matrix-map__shape,
.matrix-map__axis,
.matrix-map__male,
.matrix-map__female {
    fill: none;
    stroke-width: 1.4;
}

.matrix-map__outer { stroke: rgb(232 201 111 / .8); }
.matrix-map__shape,
.matrix-map__axis { stroke: rgb(245 245 244 / .28); }
.matrix-map__male { stroke: rgb(74 144 226 / .72); }
.matrix-map__female { stroke: rgb(220 74 74 / .72); }

.matrix-map__point circle {
    fill: #151311;
    stroke: #e8c96f;
    stroke-width: 1.7;
}

.matrix-map__point.is-major circle { stroke-width: 2.5; }
.matrix-map__point.is-center circle { fill: #b88716; stroke: #f7df91; }

.matrix-map__point text,
.matrix-map__age {
    fill: #f5f5f4;
    text-anchor: middle;
    dominant-baseline: middle;
    font-family: var(--font-body, sans-serif);
}

.matrix-map__point text { font-size: 16px; font-weight: 700; }
.matrix-map__point.is-major text { font-size: 18px; }
.matrix-map__age { fill: #c8c3bd; font-size: 13px; letter-spacing: .04em; }

@media (max-width: 560px) {
    .page-function__matrix-map { margin-inline: -.25rem; width: calc(100% + .5rem); }
    .matrix-map__age { font-size: 11px; }
}

@media print {
    .page-function__matrix-map {
        width: 126mm;
        margin: 3mm auto 5mm;
        border-color: #b7a063;
        padding: 2mm;
        background: #fff;
        break-inside: avoid;
    }

    .matrix-map__shape,
    .matrix-map__axis { stroke: #aaa; }
    .matrix-map__outer { stroke: #8b6e24; }
    .matrix-map__point circle { fill: #fff; stroke: #8b6e24; }
    .matrix-map__point.is-center circle { fill: #c39a2c; }
    .matrix-map__point text,
    .matrix-map__age { fill: #111; }
    .matrix-map__point.is-center text { fill: #fff; }
}

.page-function__natal-layout {
    display: grid;
    place-items: center;
    margin: clamp(1.5rem, 4vw, 3rem) auto;
}

.page-function__natal-chart {
    width: min(100%, 48rem);
    border: 1px solid rgb(232 201 111 / .3);
    border-radius: .65rem;
    padding: clamp(.75rem, 2.5vw, 2rem);
    background: radial-gradient(circle at 50% 50%, rgb(232 201 111 / .08), rgb(15 14 13 / .75) 68%);
}

.page-function__natal-chart svg {
    display: block;
    width: 100%;
    height: auto;
}

.natal-chart__outer,
.natal-chart__inner,
.natal-chart__core {
    fill: rgb(0 0 0 / .2);
    stroke: rgb(255 255 255 / .72);
    stroke-width: 2;
}

.natal-chart__inner { fill: rgb(255 255 255 / .035); }
.natal-chart__core { fill: rgb(0 0 0 / .36); stroke: rgb(232 201 111 / .7); }

.natal-chart__sign-line,
.natal-chart__house-line,
.natal-chart__planet-ray {
    stroke: rgb(255 255 255 / .45);
    stroke-width: 1.5;
}

.natal-chart__house-line { stroke: rgb(232 201 111 / .75); }
.natal-chart__planet-ray { stroke: rgb(255 34 34 / .8); }

.natal-chart__sign-label,
.natal-chart__house-label {
    fill: #f5f5f4;
    font-family: var(--font-body, sans-serif);
    font-size: 19px;
    font-weight: 700;
    text-anchor: middle;
    dominant-baseline: middle;
}

.natal-chart__house-label { fill: #e8c96f; font-size: 12px; }
.natal-chart__planet circle { fill: #e22; stroke: rgb(255 255 255 / .8); stroke-width: 1.5; }
.natal-chart__planet text { fill: #fff; font-family: var(--font-body, sans-serif); font-size: 9px; font-weight: 800; text-anchor: middle; }

@media print {
    .page-function__natal-layout {
        width: 126mm;
        margin: 3mm auto 5mm;
        break-inside: avoid;
    }

    .page-function__natal-chart {
        border-color: #b7a063;
        padding: 2mm;
        background: #fff;
    }

    .natal-chart__outer,
    .natal-chart__inner,
    .natal-chart__core { fill: #fff; stroke: #555; }
    .natal-chart__core { stroke: #8b6e24; }
    .natal-chart__sign-line { stroke: #999; }
    .natal-chart__house-line { stroke: #8b6e24; }
    .natal-chart__planet-ray { stroke: #b52222; }
    .natal-chart__sign-label { fill: #111; }
    .natal-chart__house-label { fill: #705817; }
}

/* Arcano personale: composizione editoriale del risultato, solo a schermo. */
@media screen {
    .page-function--dominant-arcana .page-function__result-header {
        display: grid;
        grid-template-columns: clamp(10.5rem, 20vw, 15rem) minmax(0, 1fr);
        grid-template-rows: auto auto;
        align-items: center;
        gap: .65rem clamp(1.75rem, 4vw, 3.75rem);
        max-width: none;
        margin: 0;
        border: 1px solid rgb(255 255 255 / .2);
        border-radius: .55rem;
        padding: clamp(1.4rem, 3.6vw, 3.5rem);
        background: #020202;
        box-shadow: 0 1.2rem 3rem rgb(0 0 0 / .2);
        text-align: left;
    }

    .page-function--dominant-arcana .page-function__result-header > p:first-child {
        display: none;
    }

    .page-function--dominant-arcana .page-function__result-header .page-function__number {
        display: grid;
        grid-column: 1;
        grid-row: 1 / span 2;
        width: 100%;
        aspect-ratio: 1;
        place-items: center;
        margin: 0;
        border: 4px solid #e8c96f;
        border-radius: 50%;
        background: #f10d0d;
        color: #fff;
        font-family: var(--font-display, serif);
        font-size: clamp(4.5rem, 8vw, 7rem);
        font-weight: 600;
        line-height: 1;
        box-shadow: inset 0 0 0 1px rgb(255 255 255 / .12), 0 .75rem 2rem rgb(0 0 0 / .3);
        text-shadow: 0 .18rem .45rem rgb(0 0 0 / .28);
    }

    .page-function--dominant-arcana .page-function__result-header h2 {
        grid-column: 2;
        grid-row: 1;
        align-self: end;
        margin: 0;
        color: #fff;
        font-family: var(--font-display, serif);
        font-size: clamp(2.35rem, 5vw, 4.5rem);
        font-weight: 400;
        letter-spacing: .01em;
        line-height: 1.08;
        text-align: left;
        text-transform: uppercase;
    }

    .page-function--dominant-arcana .page-function__result-header > p:last-child {
        grid-column: 2;
        grid-row: 2;
        align-self: start;
        margin: .6rem 0 0;
        color: #d6d3d1;
        font-size: clamp(1.05rem, 1.7vw, 1.45rem);
        line-height: 1.55;
        text-align: left;
    }

    .page-function--dominant-arcana .page-function__cards {
        gap: clamp(1rem, 2vw, 1.4rem);
        margin-top: clamp(1.6rem, 3vw, 2.4rem);
    }

    .page-function--dominant-arcana .page-function__cards article {
        border: 1px solid rgb(255 255 255 / .2);
        border-radius: .5rem;
        padding: clamp(1.15rem, 2vw, 1.75rem);
        background: #020202;
    }

    .page-function--dominant-arcana .page-function__cards h3 {
        margin: 0 0 .65rem;
        color: #e8c96f;
        font-family: var(--font-body, sans-serif);
        font-size: clamp(1rem, 1.35vw, 1.25rem);
        font-weight: 700;
        letter-spacing: .02em;
        text-transform: none;
    }

    .page-function--dominant-arcana .page-function__cards p {
        margin: 0;
        color: #f5f5f4;
        font-size: clamp(1rem, 1.3vw, 1.18rem);
        line-height: 1.5;
    }

    .page-function--dominant-arcana .page-function__method {
        margin: clamp(1.8rem, 3.6vw, 3rem) 0;
        color: #e7e5e4;
        font-size: clamp(1.05rem, 1.55vw, 1.35rem);
        line-height: 1.75;
        text-align: left;
    }

    .page-function--dominant-arcana .page-function__section {
        margin-top: 0;
        border: 1px solid rgb(255 255 255 / .2);
        border-radius: .5rem;
        padding: clamp(1.4rem, 3vw, 2.6rem);
        background: #020202;
    }

    .page-function--dominant-arcana .page-function__section > h2 {
        margin-top: 0;
        color: #fff;
        font-family: var(--font-display, serif);
        font-size: clamp(1.4rem, 2.5vw, 2rem);
        font-weight: 400;
        letter-spacing: .015em;
        line-height: 1.25;
        text-transform: uppercase;
    }

    .page-function--dominant-arcana .page-function__section p {
        color: #d6d3d1;
        font-size: clamp(1rem, 1.4vw, 1.2rem);
        line-height: 1.75;
    }
}

@media screen and (max-width: 760px) {
    .page-function--dominant-arcana .page-function__result-header {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto auto;
        gap: 1.25rem;
        padding: 1.35rem;
        text-align: center;
    }

    .page-function--dominant-arcana .page-function__result-header .page-function__number {
        grid-column: 1;
        grid-row: 1;
        width: min(10rem, 58vw);
        justify-self: center;
        font-size: 4.5rem;
    }

    .page-function--dominant-arcana .page-function__result-header h2 {
        grid-column: 1;
        grid-row: 2;
        align-self: auto;
        font-size: clamp(2rem, 10vw, 3rem);
        text-align: center;
    }

    .page-function--dominant-arcana .page-function__result-header > p:last-child {
        grid-column: 1;
        grid-row: 3;
        margin: 0;
        font-size: 1rem;
        text-align: center;
    }
}

/* Calendario lunare: icone vettoriali e composizione del riepilogo astronomico. */
@media screen {
    .page-function--lunar-calendar .page-function__result {
        border: 1px solid rgb(232 201 111 / .22);
        border-radius: .7rem;
        background: radial-gradient(circle at 16% 8%, rgb(71 61 43 / .34), transparent 34%), #050505;
    }

    .lunar-calendar {
        display: grid;
        gap: clamp(1.4rem, 3vw, 2.5rem);
    }

    .lunar-calendar__current {
        display: grid;
        grid-template-columns: clamp(10rem, 20vw, 14rem) minmax(0, 1fr);
        align-items: center;
        gap: clamp(1.5rem, 4vw, 3.5rem);
        border-bottom: 1px solid rgb(232 201 111 / .3);
        padding: clamp(.4rem, 1vw, 1rem) clamp(.25rem, 2vw, 1.5rem) clamp(1.8rem, 4vw, 3rem);
    }

    .lunar-calendar__current-copy > p:first-child,
    .lunar-calendar__month-heading > p,
    .lunar-calendar__upcoming article p {
        margin: 0;
        color: #e8c96f;
        font-size: .75rem;
        font-weight: 750;
        letter-spacing: .13em;
        text-transform: uppercase;
    }

    .lunar-calendar__current-copy h2 {
        margin: .35rem 0 .75rem;
        color: #fff;
        font-family: var(--font-display, "Cinzel", Georgia, serif);
        font-size: clamp(2.35rem, 5vw, 4.6rem);
        font-weight: 400;
        line-height: 1.05;
        text-transform: uppercase;
    }

    .lunar-calendar__current-copy > p:last-child {
        max-width: 50rem;
        margin: 1rem 0 0;
        color: #c8c3bd;
        font-size: clamp(.98rem, 1.25vw, 1.1rem);
        line-height: 1.65;
    }

    .lunar-calendar__facts {
        display: flex;
        flex-wrap: wrap;
        gap: .55rem;
    }

    .lunar-calendar__facts span {
        border: 1px solid rgb(232 201 111 / .38);
        border-radius: 999px;
        padding: .38rem .72rem;
        color: #eee9dd;
        font-size: .78rem;
        line-height: 1.2;
    }

    .lunar-phase-icon {
        position: relative;
        display: block;
        flex: 0 0 auto;
        width: 4.25rem;
        aspect-ratio: 1;
        overflow: hidden;
        border: 2px solid #d8ba63;
        border-radius: 50%;
        background: radial-gradient(circle at 38% 32%, #fff9db, #e7ce79 58%, #aa8131);
        box-shadow: 0 0 1.5rem rgb(232 201 111 / .18), inset -.3rem -.35rem .8rem rgb(80 55 10 / .2);
    }

    .lunar-phase-icon--hero {
        width: 100%;
        border-width: 3px;
        box-shadow: 0 0 3.5rem rgb(232 201 111 / .24), inset -.5rem -.6rem 1.2rem rgb(80 55 10 / .22);
    }

    .lunar-phase-icon > span {
        position: absolute;
        inset: 0;
        display: none;
        border-radius: 50%;
    }

    .lunar-phase-icon--new-moon {
        background: radial-gradient(circle at 38% 32%, #262421, #0b0b0b 70%);
        box-shadow: 0 0 1.4rem rgb(232 201 111 / .08), inset -.25rem -.3rem .7rem rgb(255 255 255 / .04);
    }

    .lunar-phase-icon--full-moon {
        background: radial-gradient(circle at 38% 32%, #fffceb, #f0dc96 58%, #b68b35);
    }

    .lunar-phase-icon--first-quarter {
        background: linear-gradient(90deg, #10100f 0 49.5%, #f1dc96 50.5% 100%);
    }

    .lunar-phase-icon--last-quarter {
        background: linear-gradient(90deg, #f1dc96 0 49.5%, #10100f 50.5% 100%);
    }

    .lunar-phase-icon--waxing-crescent,
    .lunar-phase-icon--waning-crescent {
        background: #10100f;
    }

    .lunar-phase-icon--waxing-crescent > span,
    .lunar-phase-icon--waning-crescent > span {
        display: block;
        background: radial-gradient(circle at 38% 32%, #fff9db, #e7ce79 62%, #aa8131);
    }

    .lunar-phase-icon--waxing-crescent > span { transform: translateX(67%); }
    .lunar-phase-icon--waning-crescent > span { transform: translateX(-67%); }

    .lunar-phase-icon--waxing-gibbous > span,
    .lunar-phase-icon--waning-gibbous > span {
        display: block;
        background: #10100f;
    }

    .lunar-phase-icon--waxing-gibbous > span { transform: translateX(-67%); }
    .lunar-phase-icon--waning-gibbous > span { transform: translateX(67%); }

    .lunar-calendar__upcoming {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1rem;
    }

    .lunar-calendar__upcoming article {
        display: flex;
        align-items: center;
        gap: 1.15rem;
        border: 1px solid rgb(255 255 255 / .16);
        border-radius: .55rem;
        padding: clamp(1rem, 2vw, 1.4rem);
        background: rgb(255 255 255 / .035);
    }

    .lunar-calendar__upcoming h3 {
        margin: .3rem 0 .15rem;
        color: #fff;
        font-family: var(--font-display, "Cinzel", Georgia, serif);
        font-size: clamp(1.1rem, 2vw, 1.45rem);
        font-weight: 400;
        line-height: 1.25;
    }

    .lunar-calendar__upcoming time {
        color: #aaa49d;
        font-size: .85rem;
    }

    .lunar-calendar__month {
        border: 1px solid rgb(255 255 255 / .16);
        border-radius: .55rem;
        padding: clamp(1.15rem, 3vw, 2rem);
        background: #020202;
    }

    .lunar-calendar__month-heading {
        margin-bottom: 1.35rem;
        text-align: center;
    }

    .lunar-calendar__month-heading h2 {
        margin: .35rem 0 0;
        color: #fff;
        font-family: var(--font-display, "Cinzel", Georgia, serif);
        font-size: clamp(1.45rem, 3vw, 2.15rem);
        font-weight: 400;
        text-transform: uppercase;
    }

    .lunar-calendar__phases {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
        gap: .85rem;
    }

    .lunar-calendar__phases article {
        display: grid;
        justify-items: center;
        gap: .65rem;
        border: 1px solid rgb(255 255 255 / .12);
        border-radius: .45rem;
        padding: 1.15rem .75rem;
        background: rgb(255 255 255 / .025);
        text-align: center;
    }

    .lunar-calendar__phases article.is-today {
        border-color: #e8c96f;
        background: rgb(232 201 111 / .08);
    }

    .lunar-calendar__phases h3 {
        margin: 0;
        color: #f5f5f4;
        font-family: var(--font-display, "Cinzel", Georgia, serif);
        font-size: .98rem;
        font-weight: 400;
        line-height: 1.3;
    }

    .lunar-calendar__phases time {
        display: grid;
        gap: .2rem;
        color: #aaa49d;
        font-size: .78rem;
    }

    .lunar-calendar__phases time strong {
        color: #e8c96f;
        font-size: 1.05rem;
    }

    .lunar-calendar__reference {
        margin: 0;
        color: #8f8a84;
        font-size: .78rem;
        line-height: 1.55;
        text-align: center;
    }
}

@media screen and (max-width: 760px) {
    .lunar-calendar__current {
        grid-template-columns: 1fr;
        justify-items: center;
        padding-inline: 0;
        text-align: center;
    }

    .lunar-phase-icon--hero { width: min(10rem, 52vw); }
    .lunar-calendar__facts { justify-content: center; }
    .lunar-calendar__current-copy > p:last-child { text-align: center; }
    .lunar-calendar__upcoming { grid-template-columns: 1fr; }
    .lunar-calendar__phases { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media screen and (max-width: 420px) {
    .lunar-calendar__phases { grid-template-columns: 1fr; }
}
