/*
 * creART Design System / 1.2.0
 * Golden-ratio-inspired typography.  11 -> 18 -> 29 -> 47 -> 76 px.
 * The mathematical factor is phi = 1.61803398875.  Values are rounded to
 * useful pixel steps, and fluid headings adapt between breakpoints.
 * Components use semantic classes rather than fixing arbitrary sizes.
 */
:root {
  --creart-phi: 1.61803398875;
  --type-micro: 0.6875rem;     /* 10px at the 16px default root */
  --type-body: 1.125rem;    /* 17px: readable paragraphs and navigation */
  --type-lead: 1.8125rem;    /* 27px: editorial lead-in and key statements */
  --type-subtitle: 2.9375rem;  /* 44px: section headings */
  --type-display: 4.75rem; /* 71px: prominent titles */
  --type-display-fluid: clamp(2.9375rem, 5.4vw, var(--type-display));
  --type-subtitle-fluid: clamp(1.8125rem, 3.4vw, var(--type-subtitle));
  --type-lead-fluid: clamp(1.125rem, 2.1vw, var(--type-lead));
}

/* Reusable scale for current and future WordPress page content. */
.creart-site .type-micro { font-size:var(--type-micro); line-height:1.5; }
.creart-site .type-body { font-size:var(--type-body); line-height:1.6; }
.creart-site .type-lead { font-size:var(--type-lead-fluid); line-height:1.38; }
.creart-site .type-subtitle { font-size:var(--type-subtitle-fluid); line-height:1.08; }
.creart-site .type-display { font-size:var(--type-display-fluid); line-height:1.02; }
.creart-site { font-size:var(--type-body); line-height:1.58; }
.creart-site p { line-height:1.6; }
.creart-site h1, .creart-site h2, .creart-site h3 { text-wrap:balance; }
.creart-site h1 { font-size:var(--type-display-fluid); line-height:1.04; }
.creart-site h2 { font-size:var(--type-subtitle-fluid); line-height:1.08; }
.creart-site h3 { font-size:var(--type-lead-fluid); line-height:1.14; }

/* Navigation, actions and metadata: deliberately different scale roles. */
.creart-site .primary-menu a,
.creart-site .primary-menu li a,
.creart-site .btn,
.creart-site .text-link,
.creart-site .contact-direct-link { font-size:var(--type-body); line-height:1.32; }
.creart-site .primary-menu { gap:clamp(0.9rem,2vw,1.75rem); }
.creart-site .btn { padding:0.85rem 1.25rem; min-height:3rem; }
.creart-site .eyebrow,
.creart-site .kicker,
.creart-site .hero-micro,
.creart-site .hero-visual-label > span,
.creart-site .project-num,
.creart-site .service-no,
.creart-site .service-tile .service-index,
.creart-site .services-footnote > span,
.creart-site .intro-strip > .wrap > span,
.creart-site .form-field label,
.creart-site .footer-col h3,
.creart-site .interior-service-text small,
.creart-site .interior-project-info small,
.creart-site .milestone-grid span { font-size:var(--type-micro); line-height:1.6; }
.creart-site .footer-col h3 { letter-spacing:.14em; text-transform:uppercase; }

/* Hero: impact / secondary supporting line, all from the same scale. */
.creart-site .hero-title { line-height:1.01; letter-spacing:-.055em; margin-bottom:1rem; }
.creart-site .hero-line { line-height:1.02; letter-spacing:-.06em; }
.creart-site .hero-line-1,
.creart-site .hero-line-2,
.creart-site .hero-line-3,
.creart-site .hero-line-4,
.creart-site .hero-slide:nth-child(2) .hero-line-2,
.creart-site .hero-slide:nth-child(2) .hero-line-3,
.creart-site .hero-slide:nth-child(2) .hero-line-4,
.creart-site .hero-slide:nth-child(3) .hero-line-2,
.creart-site .hero-slide:nth-child(3) .hero-line-3,
.creart-site .hero-slide:nth-child(3) .hero-line-4 { font-size:var(--type-display-fluid); }
.creart-site .hero-slide:nth-child(2) .hero-line-1,
.creart-site .hero-slide:nth-child(3) .hero-line-1 { font-size:var(--type-subtitle-fluid); }
/* Here the video's 27px body step is used for the hero's key message. */
.creart-site .hero-description { font-size:var(--type-lead-fluid); line-height:1.46; max-width:32rem; }
@media (min-width:981px) {
  .creart-site .hero-layout,
  .creart-site .hero-slides,
  .creart-site .hero-visual { min-height:790px; }
}
.creart-site .hero-visual-label > span { max-width:13rem; }
.creart-site .hero-actions .btn { font-size:var(--type-body); }

/* Page titles, editorial introductions and section headings. */
.creart-site .interior-heading h1,
.creart-site .page-banner h1 { font-size:var(--type-display-fluid); line-height:1.04; letter-spacing:-.06em; }
.creart-site .interior-intro,
.creart-site .interior-service-lead { font-size:var(--type-lead-fluid); line-height:1.42; }
.creart-site .interior-intro p { font-size:inherit; line-height:inherit; }
.creart-site .section-heading h2,
.creart-site .anniversary-message h2,
.creart-site .cta-form-wrap h2,
.creart-site .interior-cta h2,
.creart-site .brand-endcap h2,
.creart-site .contact-information h2,
.creart-site .contact-form-panel h2,
.creart-site .service-detail-grid h2,
.creart-site .brand-journey-detail h3,
.creart-site .service-detail-content h2 { font-size:var(--type-subtitle-fluid); line-height:1.1; }
.creart-site .section-heading > p,
.creart-site .heading-right p,
.creart-site .services-heading > p,
.creart-site .brand-journey-detail p,
.creart-site .anniversary-message p:last-child,
.creart-site .cta-form-wrap > p:not(.kicker),
.creart-site .contact-information > p:not(.kicker),
.creart-site .service-detail-content,
.creart-site .editorial-content,
.creart-site .editorial-content p,
.creart-site .interior-project-info p,
.creart-site .interior-service-text p,
.creart-site .interior-service-card p { font-size:var(--type-body); line-height:1.6; }

/* Cards have a readable but clearly lower hierarchy than section headings. */
.creart-site .service-text strong,
.creart-site .project-meta h2,
.creart-site .project-meta h3,
.creart-site .interior-service-text h2,
.creart-site .interior-service-text h3,
.creart-site .interior-service-card.is-priority .interior-service-text h2,
.creart-site .interior-project-info h3 { font-size:var(--type-lead-fluid); line-height:1.2; }
.creart-site .service-text small,
.creart-site .project-meta p,
.creart-site .content-note,
.creart-site .resource-figure figcaption,
.creart-site .resource-figure figcaption a,
.creart-site .footer-brand p,
.creart-site .footer-col a,
.creart-site .footer-col > span,
.creart-site .footer-menu a { font-size:var(--type-body); line-height:1.55; }
.creart-site .resource-figure figcaption code { font-size:var(--type-micro); }
.creart-site .service-tile strong,
.creart-site .contact-main-grid .contact-direct-link { font-size:var(--type-body); }

/* Iconic numbers and ornaments are not paragraphs: retain their visual scale. */
.creart-site .anniversary-values strong,
.creart-site .brand-wordmark { font-size:var(--type-subtitle-fluid); }
.creart-site .milestone-grid strong { font-size:clamp(var(--type-subtitle),6vw,7.125rem); }
.creart-site .footer-bottom span,
.creart-site .hero-count { font-size:var(--type-micro); }

/* Respect typography choices made explicitly in the WordPress block editor. */
.creart-site .editorial-content .has-micro-font-size,
.creart-site .interior-intro .has-micro-font-size { font-size:var(--type-micro); }
.creart-site .editorial-content .has-secundario-font-size,
.creart-site .interior-intro .has-secundario-font-size { font-size:var(--type-body); }
.creart-site .editorial-content .has-destacado-font-size,
.creart-site .interior-intro .has-destacado-font-size { font-size:var(--type-lead); }
.creart-site .editorial-content .has-subtitulo-font-size,
.creart-site .interior-intro .has-subtitulo-font-size { font-size:var(--type-subtitle); }
.creart-site .editorial-content .has-titulo-font-size,
.creart-site .interior-intro .has-titulo-font-size { font-size:var(--type-display); }

/* Tablet and mobile: step down a tier rather than clipping a 71px headline. */
@media (max-width:980px) {
  :root {
    --type-display-fluid:clamp(2.4375rem,5.1vw,4.75rem);
    --type-subtitle-fluid:clamp(1.8125rem,3.9vw,2.9375rem);
    --type-lead-fluid:clamp(1.125rem,2.5vw,1.8125rem);
  }
  .creart-site .primary-menu a,
  .creart-site .primary-menu li a { font-size:var(--type-body); }
  .creart-site .hero-line { white-space:normal; }
}
@media (max-width:700px) {
  :root {
    --type-display-fluid:clamp(2.375rem,9.5vw,2.9375rem);
    --type-subtitle-fluid:var(--type-lead);
    --type-lead-fluid:var(--type-body);
  }
  .creart-site .hero-line { white-space:normal; overflow-wrap:normal; }
  .creart-site .hero-title { max-width:100%; }
  .creart-site .hero-description { font-size:var(--type-body); line-height:1.5; }
  .creart-site .hero-actions .btn { font-size:var(--type-body); min-height:2.9375rem; padding:.7rem .8rem; }
  .creart-site .primary-menu li a { font-size:var(--type-body); padding:.9rem .75rem; }
  .creart-site .interior-heading h1 { font-size:var(--type-display-fluid); }
  .creart-site .brand-journey-detail h3,
  .creart-site .contact-form-panel h2 { font-size:var(--type-subtitle-fluid); }
  .creart-site .footer-col a,
  .creart-site .footer-menu a,
  .creart-site .resource-figure figcaption { font-size:var(--type-body); }
  .creart-site .milestone-grid span { font-size:var(--type-micro); }
}
@media (max-width:390px) {
  .creart-site .hero-slides,
  .creart-site .hero-layout { min-height:795px; }
  .creart-site .hero-actions { gap:.5rem; }
  .creart-site .hero-actions .btn { font-size:.875rem; }
  .creart-site .eyebrow { white-space:normal; }
}

@media (max-width:360px) {
  /* More vertical room when the two calls-to-action stack. */
  .creart-site .hero-layout,
  .creart-site .hero-slides { min-height:890px; }
}
