/* Model guides: shared by the crawlable directory and individual service pages. */
.model-directory { margin-top: 28px; }
.model-directory h3 { margin: 0 0 14px; font-size: 19px; }
.model-directory__links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.model-directory__links a { display: grid; gap: 6px; padding: 20px; border: 1px solid #dcdde0; border-radius: 10px; color: #202123; background: #fff; text-decoration: none; transition: border-color .18s; }
.model-directory__links a:hover { border-color: #df1026; }
.model-directory__links strong { font-size: 17px; }
.model-directory__links span { color: #555960; font-size: 14px; overflow-wrap: anywhere; }
.model-page { color: #202123; background: #fff; }
.model-main { max-width: 1340px; margin: auto; padding: 44px clamp(20px, 4vw, 64px) 64px; }
.model-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.model-hero h1 { margin: 0; font-size: clamp(34px, 4.2vw, 58px); line-height: 1.08; letter-spacing: -.035em; }
.model-hero .seo-eyebrow { color: #b9091c; letter-spacing: .12em; font-size: 12px; }
.model-code { display: inline-block; margin: 20px 0 0; padding: 10px 14px; background: #f3f3f4; border-radius: 6px; font: 700 clamp(16px, 2vw, 22px)/1.3 ui-monospace, monospace; overflow-wrap: anywhere; }
.model-lede { margin: 20px 0 24px; color: #50545b; font-size: 18px; line-height: 1.6; }
.model-contacts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.model-contacts .hero-contact { min-width: 0; padding: 14px; background: #f4f4f5; border-color: #dcdde0; color: #202123; }
.model-contacts .hero-contact:hover { background: #ededee; border-color: #b9bbc0; }
.model-contacts .hero-contact small { color: #555960; }
.model-contacts .hero-contact--whatsapp .hero-contact-icon { color: #008d43; }
.model-contacts .hero-contact-icon { flex: 0 0 25px; width: 25px; height: 25px; }
.model-phone { display: inline-block; padding: 16px 0; font-size: 15px; color: #373a40; text-decoration: none; }
.model-photo { margin: 0; min-width: 0; border: 1px solid #dcdde0; border-radius: 14px; overflow: hidden; background: #f5f5f6; }
.model-photo img { display: block; width: 100%; height: auto; }
.model-photo figcaption { padding: 12px 16px; font-size: 13px; color: #50545b; }
.model-code-panel { min-height: 330px; display: flex; flex-direction: column; justify-content: center; gap: 22px; padding: clamp(24px, 4vw, 48px); background: #222426; color: #fff; border-radius: 14px; }
.model-code-panel > span { color: #d4d5d8; font-size: 13px; text-transform: uppercase; letter-spacing: .1em; }
.model-code-panel strong { font: 700 clamp(29px, 4vw, 56px)/1.2 ui-monospace, monospace; overflow-wrap: anywhere; }
.model-code-panel em { color: #ff5365; font-style: normal; }
.model-code-panel p { margin: 0; color: #d4d5d8; line-height: 1.6; }
.model-body { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr); align-items: start; gap: clamp(24px, 5vw, 72px); margin-top: 48px; padding-top: 38px; border-top: 1px solid #dcdde0; }
.model-content { min-width: 0; }
.model-content section { padding: 0; margin: 0 0 32px; }
.model-content h2 { margin: 0 0 16px; font-size: clamp(24px, 2.2vw, 30px); line-height: 1.2; }
.model-content h2::after { display: none; }
.model-content p, .model-content li { color: #50545b; line-height: 1.7; font-size: 16px; }
.model-content p { margin: 0 0 12px; }
.model-content a, .model-links a { color: #292c31; text-decoration: underline; text-underline-offset: 3px; }
.model-side { padding: 24px; background: #f4f4f5; border-radius: 12px; }
.model-side h2 { margin: 0 0 16px; font-size: 21px; }
.model-side h2::after { display: none; }
.model-side p, .model-side li { color: #50545b; font-size: 15px; line-height: 1.7; }
.model-side ul { padding-left: 19px; }
.model-side .button { margin-top: 12px; width: 100%; }
.model-links { display: grid; gap: 14px; margin-top: 24px; }
.model-faq details { padding: 17px 0; border-top: 1px solid #dcdde0; }
.model-faq summary { cursor: pointer; font-weight: 700; line-height: 1.5; }
.model-faq details p { margin-top: 12px; }
.model-footer { border-top: 1px solid #dcdde0; padding: 28px clamp(20px, 4vw, 64px); color: #50545b; font-size: 14px; line-height: 1.7; }
.model-footer p { max-width: 1212px; margin: 0 auto; }
.model-footer__links { max-width: 1212px; margin: 12px auto 0; display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: center; }
.model-footer__links a, .model-footer__links button { color: inherit; font: inherit; text-decoration: underline; text-underline-offset: 3px; }
.model-footer__links button { min-height: 44px; padding: 8px 0; border: 0; background: transparent; cursor: pointer; }
.model-page a:focus-visible, .model-page summary:focus-visible, .model-directory a:focus-visible { outline: 3px solid #df1026; outline-offset: 4px; }
@media (max-width: 800px) {
  .model-hero, .model-body { grid-template-columns: minmax(0, 1fr); }
  .model-main { padding-top: 28px; }
  .model-hero { gap: 22px; }
  .model-body { margin-top: 32px; padding-top: 28px; }
  .model-code-panel { min-height: 230px; }
}
@media (max-width: 640px) {
  .model-directory__links { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .model-directory__links a { padding: 16px; }
  .model-contacts .hero-contact { gap: 8px; padding: 12px 9px; }
  .model-contacts .hero-contact strong { font-size: 14px; }
  .model-contacts .hero-contact small { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .model-directory__links a { transition: none; } }