@import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap');

/* 
    UALibraries Type Palette --2025--
*/
:root {
    --ua-sans: "Public Sans", system, -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif;
    --ua-serif: "Source Serif 4", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
    --ua-headings: "Public Sans",  system, -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif;
    --ua-standout: "Find Something!", serif ;
    --ua-mono: "Andale mono", mono;
    --ua-reading: "Courier";

    /* Utopia TypeScale */
    /* generated 4/8/25 --aap */

    /* @link https://utopia.fyi/type/calculator?c=320,18,1.25,1400,16,1.25,5,1,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
    /* @link https://utopia.fyi/type/calculator?c=320,18,1.25,1400,16,1.2,5,1,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
    /* @link https://utopia.fyi/type/calculator?c=320,18,1.25,1200,16,1.2,5,1,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

    /* 4th time's the charm! ;) */
    /* @link https://utopia.fyi/type/calculator?c=320,18,1.25,1200,16,1.25,5,1,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

    /* Step -1: 14.4px → 12.8px */
    --ua-type-size--1: clamp(0.8rem, 0.9364rem + -0.1818vw, 0.9rem);
    /* Step 0: 18px → 16px */
    --ua-type-size-0: clamp(1rem, 1.1705rem + -0.2273vw, 1.125rem);
    /* Step 1: 22.5px → 20px */
    --ua-type-size-1: clamp(1.25rem, 1.4631rem + -0.2841vw, 1.4063rem);
    /* Step 2: 28.125px → 25px */
    --ua-type-size-2: clamp(1.5625rem, 1.8288rem + -0.3551vw, 1.7578rem);
    /* Step 3: 35.1563px → 31.25px */
    --ua-type-size-3: clamp(1.9531rem, 2.286rem + -0.4439vw, 2.1973rem);
    /* Step 4: 43.9453px → 39.0625px */
    --ua-type-size-4: clamp(2.4414rem, 2.8576rem + -0.5549vw, 2.7466rem);
    /* Step 5: 54.9316px → 48.8281px */
    --ua-type-size-5: clamp(3.0518rem, 3.5719rem + -0.6936vw, 3.4332rem);

    /* ideally 18px on large screens, which isn't included in scale - so calc it -- use for sans -- serif works with ua-type-size-1 */
    --ua-type-size-reading: calc(1.075*var(--ua-type-size-0));

    --ua-line-height-ui: 1.5em; /* same as bootstrap default */
    --ua-line-height-reading: 1.66em; 
    
    --ua-type-weight-normal: 350; /* was 400, like 350 better */
    --ua-type-weight-strong: 550;
    --ua-type-weight-thin: 200;
    --ua-type-weight-heading: 700;
    --ua-home-heading-weight: 600;      
}

/* these are pretty low in the cascade, so easily overridden... avoid */
.sans, .sans p, .sans a {
  font-family: var(--ua-sans);
  font-optical-sizing: auto;
  font-weight: var(--ua-type-weight-normal); 
  font-style: normal;
}

.serif, .serif p, .serif a {
  font-family: var(--ua-serif);
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

/* setting the base font size */

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
  font-size: var(--ua-type-size-0); /* 16 @ 16 base desktop -- 18 @ 18 base mobile  */
  font-size: var(--ua-type-size-reading); /* nope -- need the reading size everywhere says polypane... 8-18-25 */
  font-family: var(--ua-sans);
  font-optical-sizing: auto;
  font-weight: var(--ua-type-weight-normal);
  font-style: normal;
}

body p {
    font-size: inherit;
   /*  font-size: var(--ua-type-size-1); */
}

body .node__content {
    font-size: inherit;
    font-size: var(--ua-type-size-reading);
}

body .node__content > p { 
    font-size: inherit;
    line-height: inherit;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-family: var(--ua-headings);
    font-weight: var(--ua-type-weight-heading);
}

h1, .h1 {
    font-size: var(--ua-type-size-4);
}

h2, .h2 {
    font-size: var(--ua-type-size-3);
}

h3, .h3 {
    font-size: var(--ua-type-size-2);
}

h4, .h4 {
    font-size: var(--ua-type-size-1);
}

h5, .h5 {
    font-size: var(--ua-type-size-0);
}

.small-text {
    font-size: var(--ua-type-size--1);
}

strong {
    font-weight: var(--ua-type-weight-strong);
}

@media all and (min-width: 769px) {

}

/* 
*  for long reads, let's use a serif
*
*/

.long-article,
.long-article p,
.node--type-playlist-resource #main.container, 
.node--type-playlist-resource #main.container p, 
.testimonial p {
   /*  font-size: 1.25rem; */
    font-size: var(--ua-type-size-1);
    /* line-height: 1.875;  */
    font-family: var(--ua-serif);
    font-optical-sizing: auto;
    /* font-weight: 400; */
    font-style: normal;
    line-height: var(--ua-line-height-reading);
}

.long-article p {
    margin-bottom: 2rem;
}
  
@media all and (min-width: 769px) {
    
   /*  .long-article,
    .long-article p,
    .node--type-playlist-resource #main.container, .node--type-playlist-resource #main.container p {
        font-size: 18px;
        line-height: 1.85;
        margin-bottom: 20px; 
       } */

}


/* other things that get the header font-stack
//    one declaration to rule them all
*/
/* 
#navbar-top .navbar-nav > li > a,
.slide-copy,
.in-page-menu a,
#page-header .block-menu .nav .nav-link,
.block-entity-fieldnodefield-short-tagline,
.field--name-field-about-text .field--label,
.view-faculty-staff-directory-alphabetical caption,
.view-faculty-staff-directory caption,
.field--name-name,
.node--view-mode-teaser .inline__links .nav-link,
.scroll-down-to-section a,
.card .btn,
#site-search .btn,
#search-form .btn,
#search-form label,
a.btn,
a.btn-outline-primary,
a.btn-outline-light,
footer .navbar-nav > li > a,
.layout__region .nav > li a.nav-link,
.news-item .node__content .node-readmore,
.node--type-playlist-resource .field--name-field-playlist-topic a,
tr.playlist-row .views-field-name a,
tr.playlist-row  .views-field-view-taxonomy-term a,
#weeks-hours-results dl:first-child,
.s-lc-evtd-date, 
.hours-col-loc,
.linktoall, a.more,
a.nav-link,
#s-lg-widget-1569422647259 a:first-of-type,
.region-home-promo .s-la-faq-listing-q a
 { 
    font-family: "Oswald", system, -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif;
    font-weight: 400;
}
 */
/* 
.logotype {
    font-family: 'Gothic A1';
    font-size: 28px;
    font-weight: 800;
    text-transform: uppercase;
    line-height: 1.1em;
    letter-spacing: 0.065em;
}
  
.logotype span {
    font-weight: 400;
    letter-spacing: 0.02em;
} */
 /*  
#navbar-top .navbar-nav > li > a {
    font-size: 0.9em;
    text-transform: uppercase;
    letter-spacing: 0.0em;
}
 
.slide-copy {
    font-size: 1.2em;
    font-weight: 400;
    letter-spacing: 0.05em;
}

.slide-copy h2 {
    font-size: 2.441em;
    text-transform: uppercase;
}

.background-image-text h1 {
    line-height: 1em;
    letter-spacing: 0.01em;
    font-weight: 700;
    font-size: 2.441em;
}

.in-page-menu a {
      font-size: 1.2em;
    letter-spacing: 0.02em;
    font-weight: 600;
}

.breadcrumb {
    font-size: .85em!important;
}


.region-sidebar-first nav h2 {
    text-transform: uppercase;
    font-size: 15px;
}

.landing-page .field--name-field-about-text {
    font-size: 1.2em;
}

.landing-page .menu--special-collections-top-lev a {
    font-weight: 700;
}
  
.block-entity-fieldnodefield-short-tagline {
    font-size: 24px;
    line-height: 1.5em;
    font-weight: 300;
 }
  
.field--name-field-about-text .field--label {
    font-weight: 300;
}

.cta {
    font-size: 1.25em;
    font-weight: normal;
    font-family: 'Bitter', serif;
}


footer a {
    color: #ffffff;
    font-weight: 700;
}
  
footer .region-footer {
    font-size: 14px;
    line-height: 22px;
    font-weight: normal;
}
  

.caps {
    text-transform: uppercase;
}


 */



@media (min-width: 769px) {

/* 
        #navbar-top .navbar-nav > li > a {
            font-size: 1.2em;
            text-transform: uppercase;
            letter-spacing: 0.05em;
        }
 */

}