/*
 * SmartMarudu v0.10.5 — Owner App Typography Standard
 * Purpose: one typography hierarchy for every public Owner App template.
 * Scope: Owner public surfaces (/bisnes profile + /app mode). Admin and platform UI are not changed here.
 *
 * Desktop hierarchy: 64 / 44 / 34 / 26 / 22 / 20 / 18 / 17 / 16px
 * Mobile hierarchy : 44 / 36 / 30 / 24 / 21 / 19 / 17 / 16px
 * Minimum production text: 16px.
 * Applies to both .is-directory and  modes for all Owner templates.
 */

body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
){
  --oa-font-display:var(--sm-font-display);
  --oa-font-page:var(--sm-font-h1);
  --oa-font-section:var(--sm-font-h2);
  --oa-font-h3:var(--sm-font-h3);
  --oa-font-card:var(--sm-font-card);
  --oa-font-lead:var(--sm-font-lead);
  --oa-font-body:var(--sm-font-body);
  --oa-font-card-copy:var(--sm-font-card-copy);
  --oa-font-control:var(--sm-font-control);
  --oa-font-nav:var(--sm-font-nav);
  --oa-font-label:var(--sm-font-label);
  --oa-font-meta:var(--sm-font-meta);
  --oa-font-price:var(--sm-font-price);
  --oa-font-stat:var(--sm-font-stat);
  --oa-lh-display:1.06;
  --oa-lh-heading:1.16;
  --oa-lh-card:1.28;
  --oa-lh-body:1.65;
  --oa-lh-compact:1.45;
  font-size:var(--oa-font-body)!important;
  line-height:var(--oa-lh-body);
}

/* Base readable copy */
body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(p,li,dd,dt,td,th){
  font-size:var(--oa-font-body)!important;
  line-height:var(--oa-lh-body)!important;
}

/* Page / content headings */
body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) h1{
  font-size:var(--oa-font-page)!important;
  line-height:var(--oa-lh-heading)!important;
  letter-spacing:-.035em;
}

body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) h2{
  font-size:var(--oa-font-section)!important;
  line-height:var(--oa-lh-heading)!important;
  letter-spacing:-.03em;
}

body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) h3{
  font-size:var(--oa-font-h3)!important;
  line-height:var(--oa-lh-card)!important;
  letter-spacing:-.02em;
}

/* Hero/display hierarchy — intentionally identical across Owner Apps. */
body:is(.owner-app-body) :is(.sm-owner-hero,.standalone-hero) h1,
body.stay-demo-body .stay-hero h1,
body.property-demo-body .property-hero h1,
body.clinic-demo-body .clinic-hero h1,
body.event-demo-body .event-hero h1,
body.car-demo-body .car-hero h1,
body.fix-demo-body .fix-hero h1,
body.move-demo-body .move-hero h1,
body.insurance-demo-body .si-hero h1,
body.tee-demo-body .tee-hero h1,
body.photography-standard-body .photo-standard-hero h1{
  font-size:var(--oa-font-display)!important;
  line-height:var(--oa-lh-display)!important;
  letter-spacing:-.045em!important;
}

body:is(.owner-app-body) :is(.sm-owner-hero,.standalone-hero) p,
body.stay-demo-body .stay-hero p,
body.property-demo-body .property-hero p,
body.clinic-demo-body .clinic-hero p,
body.event-demo-body .event-hero p,
body.car-demo-body .car-hero p,
body.fix-demo-body .fix-hero p,
body.move-demo-body .move-hero p,
body.insurance-demo-body .si-hero p,
body.tee-demo-body .tee-hero p,
body.photography-standard-body .photo-standard-hero p{
  font-size:var(--oa-font-lead)!important;
  line-height:1.58!important;
}

/* Supporting/lead copy outside hero. */
body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(.lead,.intro,.section-intro,.sm-owner-hero-desc){
  font-size:var(--oa-font-lead)!important;
  line-height:1.6!important;
}

/* Navigation — clear but subordinate to content. */
body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(nav a,.stay-nav a,.property-nav a,.clinic-nav a,.event-nav a,.car-nav a,.fix-nav a,.move-nav a,.si-nav a,.tee-nav a,.profile-demo-nav a){
  font-size:var(--oa-font-nav)!important;
  line-height:var(--oa-lh-compact)!important;
}

/* Buttons and form controls must remain comfortably readable, especially mobile. */
body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(button,.btn,[class*="-btn"]){
  font-size:var(--oa-font-control)!important;
  line-height:1.35!important;
}

body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(label,.contact-info-label,.service-category-label){
  font-size:var(--oa-font-label)!important;
  line-height:1.45!important;
}

body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(input,select,textarea){
  font-size:var(--oa-font-control)!important;
  line-height:1.5!important;
}

/* Owner card/module titles and descriptions use the shared card tier. */
body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(article,[class*="-card"],.card,.module-card,.listing-card,.price-card,.service-card) :is(h2,h3,.card-title){
  font-size:var(--oa-font-card)!important;
  line-height:var(--oa-lh-card)!important;
}

body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(article,[class*="-card"],.card,.module-card,.listing-card,.price-card,.service-card) p{
  font-size:var(--oa-font-card-copy)!important;
  line-height:1.62!important;
}

/* Metadata is the smallest normal UI layer and is fixed at 16px. */
body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(
  small,.eyebrow,.section-kicker,.package-eyebrow,.property-eyebrow,.move-kicker,
  .sm-owner-hero-kicker,.sm-owner-section-kicker,.badge,.tag,.chip,
  .package-meta-row,.profile-meta-row,.property-meta,.tee-product-meta,
  .sm-package-price-note,.field-help,.booking-form-note
){
  font-size:var(--oa-font-meta)!important;
  line-height:var(--oa-lh-compact)!important;
}

/* Package / product pricing gets a consistent visual level. */
body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(
  .package-price-big,.service-price,.sm-package-price,.booking-summary-price,
  .booking-related-price,.owner-mini-price,.owner-service-price
){
  font-size:var(--oa-font-price)!important;
  line-height:1.2!important;
  letter-spacing:-.025em;
}

/* Common stat/number emphasis. */
body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(.stat b,.metric b,.number,.count){
  font-size:var(--oa-font-stat)!important;
  line-height:1.15!important;
}

/* Footer intentionally compact, never smaller than 16px. */
body:is(
  .owner-app-body,
  .stay-demo-body,
  .property-demo-body,
  .clinic-demo-body,
  .event-demo-body,
  .car-demo-body,
  .fix-demo-body,
  .move-demo-body,
  .insurance-demo-body,
  .tee-demo-body,
  .photography-standard-body
) :is(footer,footer p,footer a,footer small,.stay-footer,.property-footer,.clinic-footer,.event-footer,.car-footer,.fix-footer,.move-footer,.si-footer,.tee-footer,.sm-package-footer){
  font-size:var(--oa-font-meta)!important;
  line-height:1.55!important;
}

@media(max-width:760px){
  body:is(
    .owner-app-body,
    .stay-demo-body,
    .property-demo-body,
    .clinic-demo-body,
    .event-demo-body,
    .car-demo-body,
    .fix-demo-body,
    .move-demo-body,
    .insurance-demo-body,
    .tee-demo-body,
    .photography-standard-body
  ){
    --oa-font-display:var(--sm-font-display);
    --oa-font-page:var(--sm-font-h1);
    --oa-font-section:var(--sm-font-h2);
    --oa-font-h3:var(--sm-font-h3);
    --oa-font-card:var(--sm-font-card);
    --oa-font-lead:var(--sm-font-lead);
    --oa-font-card-copy:var(--sm-font-card-copy);
    --oa-font-control:var(--sm-font-control);
    --oa-font-price:var(--sm-font-price);
    --oa-font-stat:var(--sm-font-stat);
  }
}
