.service-main { padding-block: 56px; }
.service-layout { display:grid; grid-template-columns:1.15fr 1fr; gap:72px; align-items:start; }
.service-intro h1 { font:800 clamp(30px,3.4vw,46px)/1.18 var(--font-heading); color:var(--primary-dark); margin:22px 0; }
.service-intro p { max-width:58ch; color:var(--grey-700); line-height:1.6; }
.service-steps { padding:0; list-style:none; counter-reset:steps; margin:34px 0; }
.service-steps li { counter-increment:steps; position:relative; padding:0 0 26px 48px; }
.service-steps li::before { content:counter(steps); position:absolute; left:0; top:0; width:30px; height:30px; display:grid; place-items:center; background:var(--primary); color:white; border-radius:50%; font-weight:700; }
.service-steps strong,.service-steps span { display:block; }
.service-steps span { color:var(--grey-700); margin-top:5px; }
.service-detail { font-size:15px; border-left:3px solid var(--peach); padding-left:16px; }
.service-panel { padding:32px; border:1px solid var(--grey-200); background:var(--white); border-radius:var(--radius-lg); }
.service-panel h2 { font-size:25px; margin:0 0 14px; }
.service-panel p { color:var(--grey-700); }
.service-panel .service-price { font-size:22px; color:var(--primary); font-weight:700; }
.service-panel form { display:grid; gap:20px; margin-top:24px; }
.service-panel label,.order-review label { display:grid; gap:6px; font-weight:600; }
.service-panel input:not([type=checkbox]),.order-review input,.order-review textarea { min-width:0; width:100%; border:1px solid var(--grey-400); border-radius:8px; padding:12px; background:white; color:var(--ink); font:inherit; }
.service-date-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.service-panel .service-check,.order-payment-check { display:flex; align-items:flex-start; gap:10px; font-weight:400; font-size:14px; line-height:1.5; }
.service-check input,.order-payment-check input { margin-top:4px; flex:none; width:18px; height:18px; accent-color:var(--primary); }
.orders-section { margin-top:64px; }
.orders-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; }
.orders-heading h2 { margin:0; }
.service-main [hidden] { display:none !important; }
.order-item { border-top:1px solid var(--grey-200); padding:24px 0; }
.order-item h3 { font-size:21px; margin:0 0 8px; }
.order-meta { color:var(--grey-700); overflow-wrap:anywhere; }
.order-status { font-weight:700; color:var(--primary); margin:12px 0; }
.order-note { white-space:pre-wrap; padding:14px 18px; background:var(--grey-100); border-radius:8px; margin:14px 0; }
.order-review { display:grid; max-width:720px; gap:14px; margin-top:18px; }
.order-actions { display:flex; flex-wrap:wrap; gap:12px; }
.order-payment-check { margin:16px 0; max-width:70ch; }
.payment-message { padding:18px; border-left:4px solid var(--peach); background:var(--grey-100); margin:28px 0; }
.service-main button:disabled { opacity:.6; cursor:wait; }
.service-main a { text-underline-offset:3px; }
.service-main input:focus-visible,.service-main textarea:focus-visible { outline:2px solid var(--primary); outline-offset:3px; }
.service-footer { display:flex; flex-wrap:wrap; gap:22px; padding-block:24px; border-top:1px solid var(--grey-200); font-size:14px; }
@media(max-width:900px) { .service-layout { grid-template-columns:1fr; gap:32px; } .service-main { padding-block:32px; } }
@media(max-width:460px) { .service-date-row { grid-template-columns:1fr; } .service-panel { padding:22px; } .orders-heading { align-items:flex-start; flex-direction:column; } }

/* Attestation: dossier et commande dans la palette Logement Étudiant International France. */
.attestation-page { background:var(--grey-50); }
.attestation-page .account-header { background:var(--white); }
.attestation-page .service-main { max-width:1180px; padding:36px 28px 64px; }
.service-back { display:inline-block; color:var(--grey-700); text-decoration:none; margin-bottom:36px; }
.attestation-page .service-layout { grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:64px; }
.service-heading-icon { display:flex; align-items:center; gap:12px; color:var(--primary); font-weight:600; }
.attestation-page .service-intro h1 { font-size:clamp(32px,3.7vw,48px); letter-spacing:-.04em; margin:20px 0; }
.attestation-preview { display:flex; align-items:center; gap:8px; background:var(--grey-100); border-radius:20px; margin:28px 0; padding:12px 24px 12px 0; }
.attestation-preview img { width:155px; height:155px; object-fit:contain; flex:none; }
.attestation-preview strong { font:700 18px/1.4 var(--font-heading); }
.attestation-preview p { font-size:16px; margin:8px 0; }
.attestation-preview span { font-size:13px; color:var(--grey-700); }
.attestation-page .service-steps { margin:28px 0 10px; }
.attestation-page .service-steps li { padding-bottom:22px; }
.attestation-page .service-steps li::before { background:var(--white); border:1px solid var(--grey-400); color:var(--primary); }
.attestation-page .service-panel { padding:32px; border-top:5px solid var(--yellow); box-shadow:var(--shadow-card); }
.service-panel-intro { margin:0 0 24px; }
.attestation-page .service-price { font:800 32px/1.3 var(--font-heading); letter-spacing:-.04em; padding-top:22px; border-top:1px solid var(--grey-200); margin:0 0 14px; }
.service-refund { font-size:15px; line-height:1.5; }
.service-availability { font-size:14px; line-height:1.5; padding:12px 14px; border-radius:8px; background:var(--grey-100); }
.service-availability.is-ready { color:var(--green); }
.service-secure { text-align:center; font-size:13px; margin:0; }
.attestation-page .service-panel input:not([type=checkbox]) { min-height:50px; background:var(--grey-50); }
.attestation-page .service-panel button[type=submit] { width:100%; min-height:52px; }
@media(max-width:900px) { .attestation-page .service-layout { grid-template-columns:1fr; gap:32px; } .attestation-page .service-main { max-width:680px; padding:24px 20px 40px; } .service-back { margin-bottom:24px; } }
@media(max-width:460px) { .attestation-page .service-panel { padding:24px 20px; } .attestation-preview { padding-right:16px; } .attestation-preview img { width:110px; height:140px; } .attestation-preview strong { font-size:16px; } .attestation-page .service-price { font-size:26px; } }

/* Gestion : suivi des paiements. */
.payments-summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr)); gap:16px; margin:28px 0 32px; }
.payments-summary__tile { padding:20px 22px; border:1px solid var(--grey-200); border-radius:var(--radius-md); background:var(--white); }
.payments-summary__tile p { margin:0; }
.payments-summary__label { font-size:14px; font-weight:600; color:var(--grey-700); }
.payments-summary__value { font:800 30px/1.25 var(--font-heading); color:var(--primary-dark); letter-spacing:-.03em; margin:6px 0 4px !important; font-variant-numeric:tabular-nums; }
.payments-summary__detail { font-size:14px; color:var(--grey-700); }
.orders-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-bottom:12px; }
.orders-filters { display:flex; flex-wrap:wrap; gap:8px; flex:1 1 100%; }
.orders-filter { border:1px solid var(--grey-400); background:var(--white); color:var(--ink); border-radius:999px; padding:7px 14px; font:inherit; font-size:14px; cursor:pointer; }
.orders-filter:hover { border-color:var(--primary); }
.orders-filter[aria-pressed=true] { background:var(--primary); border-color:var(--primary); color:var(--white); }
.orders-filter:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }
.orders-search { flex:1 1 260px; }
.orders-search input { width:100%; min-width:0; border:1px solid var(--grey-400); border-radius:8px; padding:11px 12px; background:white; color:var(--ink); font:inherit; }
@media(max-width:460px) { .orders-toolbar .btn { width:100%; text-align:center; } }