/* Inner pages (services, service, contact, news, legal, 404) built on the
   same tokens and type scale as the home page, so every page reads alike. */
.page-section { padding: 3.2rem 0 4.8rem; }
@media screen and (min-width: 750px) { .page-section { padding: 3.2rem 0 5.6rem; } }
.page-section--tight { padding-top: 1.6rem; }
.page-section--dark { background: rgb(var(--color-background)); }

.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin: 0 0 2rem; padding: 0; list-style: none; color: rgb(var(--color-foreground-secondary)); }
.breadcrumbs a { color: inherit; text-decoration: none; }
.breadcrumbs a:hover { color: rgb(var(--color-foreground)); }
.breadcrumbs li[aria-current] { color: rgb(var(--color-foreground)); }

.page-intro { max-width: 78rem; margin: 0 auto; text-align: center; }
.page-intro .description { margin-top: 1.6rem; }
.page-intro .subtitle { justify-content: center; }
.muted { color: rgb(var(--color-foreground-secondary)); }
.text-link { color: rgb(var(--color-accent)); }

/* Service catalogue cards */
.service-grid { display: grid; gap: 2.4rem 2rem; margin: 3.2rem 0 0; padding: 0; list-style: none; }
@media screen and (min-width: 750px) { .service-grid { grid-template-columns: repeat(2, 1fr); gap: 4rem 2.4rem; } }
@media screen and (min-width: 990px) { .service-grid--3 { grid-template-columns: repeat(3, 1fr); } }
.service-card__image { position: relative; overflow: hidden; border-radius: 1.2rem; background: rgb(var(--color-border)); aspect-ratio: 5 / 4; }
.service-card__image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-long) ease; }
.service-card:hover .service-card__image img { transform: scale(1.03); }
.service-card__badge { position: absolute; top: 1.6rem; right: 1.6rem; padding: .6rem 1.2rem; border-radius: 10rem; background: rgb(var(--color-background-secondary)); font-weight: 700; box-shadow: 0 .2rem 1rem rgba(1, 22, 36, .14); }
.service-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.6rem; margin-top: 1.6rem; }
.service-card__head a { text-decoration: none; color: inherit; }
.service-card__head a:hover { color: rgb(var(--color-accent)); }
.service-card__more { flex-shrink: 0; white-space: nowrap; font-weight: 700; color: rgb(var(--color-accent)); }
.service-card__price { margin-top: .8rem; font-weight: 700; }
.service-card__price s { margin-left: .6rem; font-weight: 500; color: rgb(var(--color-foreground-secondary)); }
.service-card__excerpt { margin-top: 1.2rem; color: rgb(var(--color-foreground-secondary)); }
.service-card__overlay { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding: 2.4rem; text-align: center; color: #fff; text-shadow: 0 .2rem 1.6rem rgba(0, 0, 0, .45); pointer-events: none; }
.service-card__overlay .h4 { color: #fff; }
.service-card__overlay-tag { display: inline-block; margin-top: 1.2rem; padding: .8rem 1.6rem; border: 1px solid rgba(255, 255, 255, .7); font-weight: 700; }

/* Service detail */
.service-detail { display: grid; gap: 3.2rem; }
@media screen and (min-width: 990px) { .service-detail { grid-template-columns: 1fr 1fr; gap: 4.8rem; align-items: start; } }
.service-detail__image { position: relative; overflow: hidden; border-radius: 1.2rem; background: rgb(var(--color-border)); aspect-ratio: 1 / 1; }
.service-detail__image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.service-detail__panel > * + * { margin-top: 2rem; }
.service-stats { display: flex; justify-content: center; margin: 0; padding: 0; list-style: none; text-align: center; }
.service-stats li { padding: 0 2.4rem; }
.service-stats li + li { border-left: 1px solid rgb(var(--color-border)); }
.service-stats__value { font-weight: 700; color: rgb(var(--color-accent)); }
.service-stats__label { margin-top: .2rem; font-weight: 700; }
.service-detail .button--full-width { display: flex; justify-content: center; width: 100%; }
.service-detail .ap-protection-grid { margin-top: 1.6rem; }
.terms-box--left { justify-content: center; }

/* Accordion (What's included, FAQs) */
.faq { border-bottom: 1px solid rgb(var(--color-border)); }
.faq summary { display: flex; align-items: center; justify-content: space-between; gap: 1.6rem; padding: 1.8rem 0; cursor: pointer; list-style: none; font-weight: 700; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ''; flex-shrink: 0; width: 1.2rem; height: 1.2rem; border-right: .2rem solid currentColor; border-bottom: .2rem solid currentColor; transform: rotate(45deg); transition: transform var(--duration-default); }
.faq[open] summary::after { transform: rotate(-135deg); }
.faq__body { padding: 0 0 2rem; color: rgb(var(--color-foreground-secondary)); }
.faq__body ul { margin: 0; padding-left: 2rem; }
.faq__body li + li { margin-top: .8rem; }
.faq--card { margin-bottom: 1.2rem; padding: 0 2.4rem; border: 0; border-radius: 1.2rem; background: rgb(var(--color-background-secondary)); box-shadow: 0 .4rem 2rem rgba(1, 22, 36, .06); }
.faq--card summary { padding: 2.2rem 0; }

/* Contact page */
.contact-card { max-width: 62rem; margin: 3.2rem auto 0; padding: 3.2rem; border-radius: 1.6rem; background: rgb(var(--color-background-secondary)); box-shadow: 0 2rem 6rem rgba(1, 22, 36, .08); }
@media screen and (min-width: 750px) { .contact-card { padding: 4.8rem; } }
.contact-card .contact-form { margin-top: 2.4rem; }
.contact-form .field { margin-bottom: 1.6rem; }
.contact-form .field__input { width: 100%; }
.form-status { margin-top: 1.2rem; font-weight: 700; }

/* News */
.article-grid { display: grid; gap: 2.4rem; margin: 3.2rem 0 0; padding: 0; list-style: none; }
@media screen and (min-width: 750px) { .article-grid { grid-template-columns: repeat(2, 1fr); } }
@media screen and (min-width: 990px) { .article-grid { grid-template-columns: repeat(3, 1fr); } }
.article-card { display: flex; flex-direction: column; padding: 3.2rem; border-radius: 1.6rem; background: rgb(var(--color-background-secondary)); box-shadow: 0 .4rem 2.4rem rgba(1, 22, 36, .06); transition: transform var(--duration-default), box-shadow var(--duration-default); }
.article-card:hover { transform: translateY(-.4rem); box-shadow: 0 1.8rem 4.4rem rgba(1, 22, 36, .10); }
.article-card a { color: inherit; text-decoration: none; }
.article-card a:hover { color: rgb(var(--color-accent)); }
.article-card__excerpt { margin-top: 1.6rem; color: rgb(var(--color-foreground-secondary)); }
.article-card__date { margin-top: auto; padding-top: 2.4rem; color: rgb(var(--color-foreground-secondary)); }
.article { max-width: 86rem; margin: 0 auto; }
.article__image { margin-top: 3.2rem; overflow: hidden; border-radius: 1.2rem; background: rgb(var(--color-border)); }
.article__image img { display: block; width: 100%; aspect-ratio: 12 / 7; object-fit: cover; }
.article__body { margin-top: 3.2rem; color: rgb(var(--color-foreground-secondary)); }
.article__body p + p, .legal__body > * + * { margin-top: 1.6rem; }
.legal { max-width: 86rem; margin: 0 auto; }
.legal__body { margin-top: 3.2rem; }
.legal__body h2 { margin-top: 3.2rem; }
.legal__body p { color: rgb(var(--color-foreground-secondary)); }
.legal__note { margin-top: 4rem; padding: 2.4rem; border: 1px solid rgb(var(--color-border)); border-radius: 1.2rem; background: rgb(var(--color-background-secondary)); }

/* 404 */
.notfound { max-width: 70rem; margin: 0 auto; padding: 6rem 0; text-align: center; }
.notfound__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.2rem; margin-top: 3.2rem; }

/* Team */
.contact-people { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.2rem 3.2rem; margin-top: 1.6rem; }
.team-grid { display: grid; gap: 2.4rem; margin: 3.2rem 0 0; padding: 0; list-style: none; }
@media screen and (min-width: 750px) { .team-grid { grid-template-columns: repeat(2, 1fr); } }
@media screen and (min-width: 990px) { .team-grid { grid-template-columns: repeat(3, 1fr); } }
.team-card { display: flex; flex-direction: column; overflow: hidden; border-radius: 1.6rem; background: rgb(var(--color-background-secondary)); box-shadow: 0 .4rem 2.4rem rgba(1, 22, 36, .06); }
.team-card__photo { aspect-ratio: 1 / 1; background: rgb(var(--color-border)); }
.team-card__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.team-card__photo--empty { display: grid; place-items: center; font-size: 6rem; font-weight: 700; color: rgb(var(--color-accent)); background: rgba(var(--color-accent), .08); }
.team-card__body { padding: 2.4rem; }
.team-card__role { margin-top: .4rem; color: rgb(var(--color-accent)); font-weight: 700; }
.team-card__bio { margin-top: 1.2rem; color: rgb(var(--color-foreground-secondary)); }
.team-card__links { display: flex; flex-wrap: wrap; gap: .8rem 1.6rem; margin-top: 1.6rem; }
.team-card__links a { color: rgb(var(--color-foreground)); text-decoration: none; font-weight: 700; }
.team-card__links a:hover { color: rgb(var(--color-accent)); }
.team-cta { margin-top: 4rem; text-align: center; }
