body.freecreat-xr-page .xr-page { max-width: 1240px; margin: 0 auto; padding: 34px 34px 56px; }
.xr-hero { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr); gap:24px; padding:34px; border:1px solid #d9e1ed; border-radius:8px; background:linear-gradient(145deg,#f7fafc,#e8f2ff); }
.xr-kicker { margin:0 0 10px; color:#2563eb; font-size:12px; font-weight:800; letter-spacing:0; text-transform:uppercase; }
.xr-hero h1 { margin:0; color:#101828; font-size:38px; line-height:1.14; letter-spacing:0; }
.xr-hero p { max-width:720px; margin:17px 0 0; color:#475467; font-size:16px; line-height:1.75; }
.xr-hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.xr-hero-actions a,.xr-device-link { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:0 15px; border:1px solid #1d4ed8; border-radius:6px; background:#1d4ed8; color:#fff; font-size:14px; font-weight:700; text-decoration:none; }
.xr-hero-actions a:last-child { border-color:#cbd5e1; background:#fff; color:#1e293b; }
.xr-device-panel { display:grid; align-content:center; gap:10px; padding:24px; border-radius:6px; background:#132238; color:#fff; }
.xr-device-panel strong { font-size:19px; line-height:1.25; }.xr-device-panel span { color:#cbd5e1; line-height:1.6; }
.xr-section { margin-top:34px; }.xr-section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:15px; }.xr-section h2 { margin:0; color:#172033; font-size:23px; }.xr-section-heading p { margin:0; color:#667085; font-size:14px; }
.xr-model-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }.xr-model-card { overflow:hidden; border:1px solid #e1e7ef; border-radius:7px; background:#fff; color:#172033; text-decoration:none; box-shadow:0 6px 18px rgba(15,23,42,.05); }.xr-model-card:hover { border-color:#93c5fd; box-shadow:0 12px 26px rgba(15,23,42,.10); }.xr-model-image { display:block; width:100%; aspect-ratio:1/1; object-fit:contain; background:#f5f7fa; }.xr-model-copy { padding:12px; }.xr-model-copy strong { display:block; overflow:hidden; font-size:14px; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }.xr-model-copy span { display:block; margin-top:6px; color:#2563eb; font-size:12px; font-weight:700; }
.xr-topic-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }.xr-topic-card { min-height:126px; padding:19px; border:1px solid #e1e7ef; border-radius:7px; background:#fff; color:#172033; text-decoration:none; }.xr-topic-card:hover { border-color:#60a5fa; }.xr-topic-card strong { display:block; font-size:17px; }.xr-topic-card span { display:block; margin-top:9px; color:#667085; font-size:13px; line-height:1.55; }
.xr-faq { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.xr-faq article { padding:18px; border-left:3px solid #2563eb; background:#f8fafc; }.xr-faq h3 { margin:0; color:#172033; font-size:15px; }.xr-faq p { margin:8px 0 0; color:#667085; font-size:14px; line-height:1.65; }
@media (max-width: 767px) { body.freecreat-xr-page .xr-page { padding:84px 14px 34px; } .xr-hero { grid-template-columns:1fr; padding:22px 18px; } .xr-hero h1 { font-size:29px; } .xr-hero p { font-size:15px; } .xr-device-panel { padding:18px; } .xr-model-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .xr-topic-grid,.xr-faq { grid-template-columns:1fr; } .xr-section { margin-top:27px; } .xr-section-heading { display:block; } .xr-section-heading p { margin-top:6px; } }