/* ==========================================================================
   Enyty – pagine interne nello stile della home (Come funziona, Per le agenzie,
   Aiuto e contatti, pagina della persona). Si appoggia a css/enyty-home.css
   (variabili .hm, pulsanti, capitoli, comparse) e si carica dopo.
   ========================================================================== */

/* ---------- Apertura notturna, piu' bassa della home ---------------------- */
.pg-hero__in {
    position: relative; z-index: 1; min-height: 66vh; min-height: 66svh;
    display: flex; align-items: center; justify-content: center;
    padding: 9.5rem 1.25rem 4.5rem !important; text-align: center;
}
.pg-hero--small .pg-hero__in { min-height: 52vh; min-height: 52svh; }
.pg-hero__inner { max-width: 54rem; }
.pg-hero__kicker {
    display: inline-flex; align-items: center; gap: .7rem; margin: 0 0 1.3rem;
    font-family: Larsseit-Bold, sans-serif; font-size: .8rem; letter-spacing: .24em; text-transform: uppercase; color: var(--hm-sky);
    animation: pg-up .9s var(--hm-ease) .15s both;
}
.pg-hero__dot {
    width: 8px; height: 8px; border-radius: 50%; background: var(--hm-candle);
    box-shadow: 0 0 0 4px rgba(255, 243, 214, .12), 0 0 16px 4px rgba(255, 214, 150, .55);
    animation: pg-candle 3.2s ease-in-out 1.2s infinite;
}
@keyframes pg-candle { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }
.pg-hero__title {
    margin: 0 auto; max-width: 18ch;
    font-family: "DM Serif Display", serif; font-weight: 400; color: var(--hm-ivory);
    font-size: clamp(2.4rem, 1.4rem + 3.6vw, 4.6rem) !important; line-height: 1.04 !important; letter-spacing: -.02em;
    animation: pg-up 1.1s var(--hm-ease) .3s both;
}
.pg-hero__lead {
    max-width: 38rem; margin: 1.5rem auto 0; font-size: clamp(1.05rem, 1rem + .35vw, 1.25rem); line-height: 1.6; color: var(--hm-light);
    animation: pg-up 1.1s var(--hm-ease) .5s both;
}
.pg-hero__actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 1rem 1.8rem; margin-top: 2.2rem; animation: pg-up 1.1s var(--hm-ease) .7s both; }
@keyframes pg-up { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.pg-hero .hm-dawn { height: clamp(6rem, 16vh, 10rem); }

/* ---------- Apertura chiara (pagine interne): un mattino ad acquerello ------
   La notte resta solo alla home. Qui: cielo chiaro, luce calda dall'alto, i fiori blu del sito
   ad acquerello ai lati, petali che scendono (js/enyty-motion.js, attributo data-day). */
.hm-opening.pg-hero--day {
    color: var(--hm-ink);
    background:
        radial-gradient(55% 46% at 50% 0%, rgba(255, 233, 200, .62), rgba(255, 233, 200, 0) 70%),
        radial-gradient(70% 60% at 50% 40%, rgba(179, 212, 231, .42), rgba(179, 212, 231, 0) 72%),
        linear-gradient(180deg, #e8f0f8 0, #f1f6fb 48%, #f8fbfd 80%, #fff 100%);
}
.pg-hero--day .hm-intro__nebula { opacity: .62; }
.pg-hero--day .hm-dawn { height: clamp(3rem, 8vh, 5rem); background: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff); }
.pg-hero--day .pg-hero__kicker { color: var(--hm-strong); }
.pg-hero--day .pg-hero__dot { background: var(--hm-strong); box-shadow: 0 0 0 4px rgba(179, 212, 231, .6), 0 0 16px 4px rgba(255, 214, 150, .55); }
.pg-hero--day .pg-hero__title { color: var(--hm-ink); }
.pg-hero--day .pg-hero__lead { color: var(--hm-text); }

/* ---------- Corpo --------------------------------------------------------- */
.pg-ch { position: relative; padding: clamp(3.5rem, 7vw, 6rem) 1.25rem !important; }
.pg-ch--tint { background: linear-gradient(180deg, #fff, #f6f9fc 18%, #f6f9fc 82%, #fff); }
.pg-wrap { max-width: 1140px; margin: 0 auto; }

/* passi numerati, legati da un filo come i capitoli della home */
.pg-steps { list-style: none; margin: clamp(2.5rem, 5vw, 3.5rem) auto 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.4rem; counter-reset: pg; position: relative; }
.pg-steps::before {
    content: ""; position: absolute; left: 12%; right: 12%; top: 27px; height: 1px;
    background: linear-gradient(90deg, rgba(69, 98, 151, 0), rgba(69, 98, 151, .35) 15%, rgba(69, 98, 151, .35) 85%, rgba(69, 98, 151, 0));
}
.pg-step { position: relative; text-align: center; padding: 0 .4rem; }
.pg-step__n {
    position: relative; z-index: 1; display: inline-grid; place-items: center; width: 54px; height: 54px; margin-bottom: 1.1rem; border-radius: 50%;
    background: #fff; color: var(--hm-strong); font-family: "DM Serif Display", serif; font-size: 1.35rem;
    box-shadow: 0 0 0 1px var(--hm-line), 0 0 0 7px rgba(179, 212, 231, .25), 0 14px 26px -16px rgba(28, 36, 52, .5);
}
.pg-step h3 { margin: 0 0 .5rem; font-family: "DM Serif Display", serif; font-weight: 400; font-size: 1.4rem !important; line-height: 1.15 !important; color: var(--hm-ink); }
.pg-step p { margin: 0; color: var(--hm-text); font-size: 1rem; line-height: 1.6; }

/* schede: servizi e prezzi */
.pg-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; margin: clamp(2.5rem, 5vw, 3.5rem) auto 0; }
.pg-card {
    position: relative; display: flex; flex-direction: column; gap: .9rem;
    padding: clamp(1.5rem, 2.6vw, 2.1rem); border-radius: 26px; background: #fff;
    box-shadow: 0 0 0 1px var(--hm-line), 0 30px 60px -44px rgba(28, 36, 52, .55);
    transition: transform .4s var(--hm-ease), box-shadow .4s ease;
}
.pg-card:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px rgba(69, 98, 151, .22), 0 40px 70px -40px rgba(28, 36, 52, .6); }
.pg-card__icon {
    display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 16px;
    background: var(--hm-mist); color: var(--hm-strong);
}
.pg-card h3 { margin: 0; font-family: "DM Serif Display", serif; font-weight: 400; font-size: 1.5rem !important; line-height: 1.15 !important; color: var(--hm-ink); }
.pg-card p { margin: 0; color: var(--hm-text); line-height: 1.6; }
.pg-card--featured { background: linear-gradient(180deg, #1d2840, #172033); color: var(--hm-ivory); box-shadow: 0 40px 80px -40px rgba(23, 32, 51, .8); }
.pg-card--featured h3, .pg-card--featured .pg-price__amount { color: var(--hm-ivory); }
.pg-card--featured p, .pg-card--featured .pg-list li { color: var(--hm-light); }
.pg-card--featured .pg-card__icon { background: rgba(255, 255, 255, .08); color: var(--hm-candle); }
.pg-card__badge {
    position: absolute; top: 1.2rem; right: 1.2rem; padding: .32rem .7rem; border-radius: 999px;
    background: var(--hm-candle); color: #6b4a14; font-family: Larsseit-Bold, sans-serif; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
}
.pg-price { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; margin: .2rem 0 .1rem; }
.pg-price__amount { font-family: "DM Serif Display", serif; font-size: 2.6rem; line-height: 1; color: var(--hm-ink); }
.pg-price__note { font-size: .92rem; color: var(--hm-text); }
.pg-price__amount--word { font-size: 2rem; }
.pg-card--featured .pg-price__note { color: var(--hm-light); }
.pg-list { list-style: none; margin: .2rem 0 0; padding: 0; display: grid; gap: .55rem; }
.pg-list li { position: relative; padding-left: 1.6rem; color: var(--hm-text); line-height: 1.5; }
.pg-list li::before {
    content: ""; position: absolute; left: 2px; top: .52em; width: 8px; height: 8px; border-radius: 50%;
    background: var(--hm-strong); box-shadow: 0 0 0 4px rgba(179, 212, 231, .45);
}
.pg-card--featured .pg-list li::before { background: var(--hm-candle); box-shadow: 0 0 0 4px rgba(255, 243, 214, .12); }
.pg-card__foot { margin-top: auto; padding-top: .6rem; }
.pg-soon {
    display: inline-flex; align-items: center; gap: .5rem; min-height: 46px; padding: 0 1.1rem; border-radius: 999px;
    background: rgba(179, 212, 231, .25); color: var(--hm-blue); font-family: Larsseit-Bold, sans-serif; font-size: .92rem;
}
.pg-card--featured .pg-soon { background: rgba(255, 255, 255, .08); color: var(--hm-sky); }
.pg-fine { max-width: 46rem; margin: 1.8rem auto 0; text-align: center; font-size: .95rem; color: var(--hm-text); }
.pg-fine a { color: var(--hm-strong); font-family: Larsseit-Bold, sans-serif; text-decoration: underline; text-underline-offset: 3px; }

/* margine per l'agenzia: il conto in chiaro */
.pg-sum { display: grid; grid-template-columns: repeat(4, auto); justify-content: center; align-items: center; gap: .8rem 1.4rem; margin: 2.4rem auto 0; text-align: center; }
.pg-sum__item b { display: block; font-family: "DM Serif Display", serif; font-weight: 400; font-size: 2rem; color: var(--hm-ink); line-height: 1.1; }
.pg-sum__item span { font-size: .88rem; color: var(--hm-text); }
.pg-sum__op { font-family: "DM Serif Display", serif; font-size: 1.6rem; color: var(--hm-blue); opacity: .6; }
.pg-sum__item--total b { color: var(--hm-strong); }

/* domande frequenti */
.pg-faq { max-width: 50rem; margin: clamp(2rem, 4vw, 3rem) auto 0; display: grid; gap: .7rem; }
.pg-faq__group { margin: 2.2rem 0 .3rem; font-family: Larsseit-Bold, sans-serif; font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; color: var(--hm-strong); }
.pg-faq__group:first-child { margin-top: 0; }
.pg-faq details { border-radius: 18px; background: #fff; box-shadow: 0 0 0 1px var(--hm-line); transition: box-shadow .3s ease; }
.pg-faq details[open] { box-shadow: 0 0 0 1px rgba(69, 98, 151, .28), 0 24px 40px -32px rgba(28, 36, 52, .5); }
.pg-faq summary {
    position: relative; list-style: none; cursor: pointer; padding: 1.15rem 3.4rem 1.15rem 1.4rem;
    font-family: "DM Serif Display", serif; font-size: 1.22rem; line-height: 1.3; color: var(--hm-ink);
}
.pg-faq summary::-webkit-details-marker { display: none; }
.pg-faq summary::after {
    content: ""; position: absolute; right: 1.4rem; top: 50%; width: 11px; height: 11px; margin-top: -8px;
    border-right: 1.6px solid var(--hm-strong); border-bottom: 1.6px solid var(--hm-strong); transform: rotate(45deg);
    transition: transform .3s var(--hm-ease), margin .3s var(--hm-ease);
}
.pg-faq details[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.pg-faq summary:focus-visible { outline: 2px solid var(--hm-strong); outline-offset: 2px; border-radius: 18px; }
.pg-faq__a { padding: 0 1.4rem 1.3rem; color: var(--hm-text); line-height: 1.65; }
.pg-faq__a p { margin: 0 0 .6rem; }
.pg-faq__a p:last-child { margin: 0; }
.pg-faq__a a { color: var(--hm-strong); text-decoration: underline; text-underline-offset: 3px; }

/* fascia finale di invito: chiara, acquerello azzurro con una luce calda */
.pg-band {
    position: relative; overflow: hidden; max-width: 1140px; margin: 0 auto; padding: clamp(2.2rem, 5vw, 3.6rem);
    border-radius: 32px; text-align: center; color: var(--hm-ink);
    background:
        radial-gradient(50% 90% at 50% 0%, rgba(255, 233, 200, .55), rgba(255, 233, 200, 0) 70%),
        radial-gradient(60% 120% at 10% 100%, rgba(179, 212, 231, .55), rgba(179, 212, 231, 0) 70%),
        radial-gradient(50% 110% at 92% 90%, rgba(205, 190, 236, .32), rgba(205, 190, 236, 0) 70%),
        linear-gradient(180deg, #f5f9fc, #eef4f9);
    box-shadow: 0 0 0 1px var(--hm-line), 0 40px 80px -60px rgba(28, 36, 52, .55);
}
.pg-band h2 { margin: 0 auto .8rem; max-width: 20ch; font-family: "DM Serif Display", serif; font-weight: 400; font-size: clamp(1.9rem, 1.3rem + 2vw, 2.8rem) !important; line-height: 1.08 !important; color: var(--hm-ink); }
.pg-band p { max-width: 36rem; margin: 0 auto 1.8rem; color: var(--hm-text); line-height: 1.6; }
.pg-band .hm-actions { justify-content: center; }

/* contatto in evidenza (Aiuto) */
.pg-contact { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem 1.6rem; margin-top: 2rem; }

@media (max-width: 991px) {
    .pg-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 2.4rem; }
    .pg-steps::before { display: none; }
    .pg-cards { grid-template-columns: minmax(0, 1fr); max-width: 30rem; }
    .pg-sum { grid-template-columns: repeat(2, auto); }
    .pg-sum__op { display: none; }
}
@media (max-width: 575px) {
    .pg-hero__in { padding: 7.5rem 1.1rem 3.5rem !important; min-height: 58svh; }
    .pg-steps { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
    .pg-hero__kicker, .pg-hero__title, .pg-hero__lead, .pg-hero__actions, .pg-hero__dot { animation: none !important; }
    .pg-card { transition: none; }
}