@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 900;
  font-stretch: 75% 125%;
  font-display: swap;
  src: url(assets/fonts/archivo-latin-variable.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Shared Degree Daddy design language. Loaded after legacy styles.css on every page. */
:root {
    --brand-ice: #e6f0f4;
    --brand-ink: #0a1c26;
    --brand-cold: #176d9d;
    --brand-deep: #102e40;
    --brand-cedar: #24140e;
    --brand-amber: #efb365;
    --brand-strava: #fc5200;
    --brand-paper: #fffdf9;
    --brand-line: #c7d0ce;
    --brand-copy: #344b55;
    --brand-muted: #536168;
    --brand-font: 'Archivo', Arial, sans-serif;
}
.home-container { width: min(100% - 72px, 1220px); margin-inline: auto; }
.skip-link { position: fixed; z-index: 200; top: -80px; left: 12px; padding: 12px 18px; background: #fff; color: var(--brand-ink); }
.skip-link:focus { top: 12px; }
.home-nav { position: absolute; background: var(--brand-ice); box-shadow: none; backdrop-filter: none; padding: 0; }
.home-nav.nav--scrolled { background: rgba(230,240,244,.96); box-shadow: 0 1px 0 rgba(10,28,38,.12); backdrop-filter: blur(12px); position: fixed; }
.home-nav__inner { width: min(100% - 72px, 1320px); min-height: 78px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.home-nav__brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; font-size: 1.15rem; letter-spacing: -.04em; color: var(--brand-ink); }
.home-nav__brand img { border-radius: 8px; }
.home-nav__links { display: flex; align-items: center; gap: 28px; font-size: .91rem; font-weight: 650; color: var(--brand-ink); }
.home-nav__links a:hover { text-decoration: underline; text-underline-offset: 5px; }
.home-nav__download { padding: 10px 17px; background: var(--brand-ink); color: #fff; border-radius: 4px; }
.home-nav__links .home-nav__download:hover { background: var(--brand-deep); text-decoration: none; }
.store-badge { display: inline-flex; align-items: center; gap: 11px; min-width: 174px; min-height: 56px; padding: 8px 17px; border-radius: 9px; color: #fff; background: #101619; }
.store-badge:hover { background: #263840; }
.store-badge span { display: flex; flex-direction: column; line-height: 1.05; }
.store-badge small { font-size: .66rem; letter-spacing: .01em; }
.store-badge strong { font-size: 1.22rem; letter-spacing: -.025em; }
.home-footer { background: #130d0a; color: #e1d7cf; padding: 36px 0; }
.home-footer__inner { display: flex; gap: 30px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.home-footer__brand { font-weight: 900; color: #fff; letter-spacing: -.05em; }
.home-footer__inner div { display: flex; gap: 22px; flex-wrap: wrap; font-size: .88rem; }
.home-footer__inner a:hover { text-decoration: underline; text-underline-offset: 4px; }
.home-footer__inner p { font-size: .82rem; color: #b3a69b; }
@media (max-width: 767px) {
    .home-nav__inner { width: calc(100% - 40px); min-height: 68px; }
    .home-nav__links { gap: 13px; font-size: .84rem; }
    .home-nav__links a[href="/articles"] { display: none; }
    .home-nav__download { padding: 8px 10px; }
    .home-nav__brand { font-size: .98rem; }
    .home-nav__brand img { width: 28px; height: 28px; }
    .home-footer__inner { display: block; }
    .home-footer__inner div { margin: 22px 0; }
}
@media (max-width: 390px) {
    .home-nav__links a[href="/strava"] { display: none; }
}

/* Interior pages */
body.site-page {
    --hero-surface: var(--brand-ice);
    font-family: var(--brand-font);
    background: var(--brand-paper);
    color: var(--brand-ink);
    overflow-x: clip;
}
.site-page.heat-article { --hero-surface: var(--brand-cedar); }
.site-page a:focus-visible, .site-page button:focus-visible { outline: 3px solid var(--brand-cold); outline-offset: 4px; }
.site-page .home-nav { background: var(--brand-ice); }
.site-page .home-nav.nav--scrolled { background: rgba(230,240,244,.96); }
.site-page h1, .site-page h2, .site-page h3 { font-family: var(--brand-font); letter-spacing: -.005em; line-height: 1.12; }
.site-page p, .site-page li { line-height: 1.7; }
.site-page .home-footer { margin-top: 0; }
.site-page .home-footer__inner p { line-height: 1.4; }
.site-page .site-footer__legal { width: 100%; margin-top: -12px; }

/* Long-form articles and search landing pages share the same reading rhythm. */
.site-page .article-page { padding: 0 0 100px; overflow: hidden; }
.site-page .article-page__container { max-width: 1220px; width: min(100% - 72px, 1220px); padding: 0; }
.site-page .article-page__back { color: var(--brand-cold); margin: 115px 0 28px; font-weight: 700; }
.site-page .article-page__back:hover { color: var(--brand-deep); }
.site-page .article-page__header {
    position: relative; isolation: isolate; background: var(--hero-surface);
    box-shadow: 0 0 0 100vmax var(--hero-surface); clip-path: inset(0 -100vmax);
    padding: 54px 0 70px; margin-bottom: 62px;
}
.site-page .article-page__header-copy { max-width: 760px; }
.site-page .article-page__meta { color: var(--brand-muted); font-size: .85rem; font-weight: 650; letter-spacing: .015em; margin: 0 0 17px; }
.site-page .article-page__title { color: var(--brand-ink); max-width: 860px; font-size: clamp(2.8rem, 5.1vw, 5.4rem); font-weight: 900; font-stretch: 92%; letter-spacing: -.005em; line-height: 1.09; }
.site-page.heat-article .article-page__title { color: #fff7ed; }
.site-page.heat-article .article-page__meta { color: #e8c5a1; }
.site-page .article-page__body { width: min(100%, 72ch); margin-inline: auto; font-size: 1.08rem; }
.site-page .article-page__body p, .site-page .article-page__body li { color: var(--brand-copy); font-size: 1.06rem; line-height: 1.75; }
.site-page .article-page__body p { margin-bottom: 22px; }
.site-page .article-page__body h2 { color: var(--brand-ink); font-size: clamp(1.75rem, 2.5vw, 2.35rem); font-weight: 850; line-height: 1.18; margin: 52px 0 19px; }
.site-page .article-page__body h3 { color: var(--brand-deep); font-size: 1.32rem; font-weight: 800; margin: 33px 0 12px; }
.site-page .article-page__body strong { color: var(--brand-ink); font-weight: 750; }
.site-page .article-page__body a { color: var(--brand-cold); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.site-page .article-page__body a:hover { color: var(--brand-deep); }
.site-page .article-page__body ul, .site-page .article-page__body ol { color: var(--brand-copy); padding-left: 1.45em; }
.site-page .article-page__body li { margin-bottom: 9px; }
.site-page .article-page__body table { display: block; max-width: 100%; overflow-x: auto; }
.site-page .article-page__body thead th { color: var(--brand-ink); background: var(--brand-ice); border-color: var(--brand-line); }
.site-page .article-page__body tbody td { color: var(--brand-copy); border-color: var(--brand-line); }
.site-page .article-page__body blockquote { border-color: var(--brand-cold); background: var(--brand-ice); }
.site-page .article-page__body blockquote p { color: var(--brand-deep); }
/* The existing first body on landing pages is the key-takeaways block. */
.site-page.landing-page .article-page__body:first-of-type { background: #edf4f4; padding: 28px 34px 18px; border-left: 4px solid var(--brand-cold); margin-bottom: 44px; }
.site-page.landing-page .article-page__body:first-of-type h2 { margin-top: 0; font-size: 1.45rem; }
.site-page .article-page__related, .site-page .article-page__cta { max-width: 950px; margin-inline: auto; }
.site-page .article-page__related { border-top: 1px solid var(--brand-line); margin-top: 76px; padding-top: 38px; }
.site-page .article-page__related-label, .site-page .articles-page__section-label { color: var(--brand-cold); font-size: .8rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.site-page .article-page__related-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 15px; }
.site-page .article-page__related-card, .site-page .articles-page__card { background: #fff; border: 1px solid var(--brand-line); border-radius: 2px; box-shadow: none; }
.site-page .article-page__related-card { padding: 22px; }
.site-page .article-page__related-card:hover, .site-page .articles-page__card:hover { border-color: var(--brand-cold); box-shadow: 0 9px 22px rgba(10,28,38,.08); }
.site-page .article-page__related-card-title, .site-page .articles-page__card-title { color: var(--brand-ink); font-weight: 800; }
.site-page .article-page__related-card-desc, .site-page .articles-page__card-desc { color: var(--brand-copy); }
.site-page .article-page__cta { background: var(--brand-cedar); border: 0; border-radius: 0; color: #fff7ed; padding: 56px 38px; }
.site-page .article-page__cta-heading { font-size: clamp(2rem, 3vw, 3.3rem); font-weight: 900; }
.site-page .article-page__cta-desc { color: #e7d2bb; font-size: 1rem; }
.site-page .article-page__cta-button { background: #fff7ed; color: var(--brand-ink); border-radius: 4px; font-weight: 800; }
.site-page .article-page__cta-button:hover { background: #f0c68e; box-shadow: none; }

/* The article index keeps the same reading palette and a roomier card grid. */
.site-page .articles-page { padding: 78px 0 90px; } /* = nav height: the ice header sits flush under the ice nav */
.site-page .articles-page__container { max-width: 1100px; width: min(100% - 72px, 1100px); padding: 0; }
.site-page .articles-page__header { background: var(--brand-ice); box-shadow: 0 0 0 100vmax var(--brand-ice); clip-path: inset(0 -100vmax); text-align: left; margin: 0 0 70px; padding: 54px 0 70px; }
.site-page .articles-page__title { font-size: clamp(3.5rem, 6vw, 6rem); font-weight: 900; font-stretch: 92%; letter-spacing: -.005em; line-height: 1.08; color: var(--brand-ink); }
.site-page .articles-page__subtitle { color: var(--brand-copy); max-width: 590px; margin: 22px 0 0; font-size: 1.14rem; }
.site-page .articles-page__grid { gap: 16px; }
.site-page .articles-page__card { padding: 28px; }
.site-page .articles-page__card-date, .site-page .articles-page__card-meta { color: var(--brand-muted); }
.site-page .articles-page__card-category { background: var(--brand-ice); color: var(--brand-cold); }
.site-page .articles-page__page-btn { background: white; color: var(--brand-ink); border-color: var(--brand-line); border-radius: 3px; }
.site-page .articles-page__page-btn--active { color: white; background: var(--brand-cold); border-color: var(--brand-cold); }

/* Search landing hero: the title and an app demonstration share one ice band. */
.site-page.landing-page .article-page__header { display: grid; grid-template-columns: minmax(0,1fr) minmax(190px,330px); align-items: center; gap: clamp(36px,7vw,120px); padding: 55px 0 78px; }
.site-page.landing-page .article-page__header .article-page__meta { margin-top: 20px; }
.site-page .landing-hero__media { margin: 0; justify-self: center; text-align: center; width: 100%; }
.site-page .landing-hero__media video, .site-page .landing-hero__media img { display: block; width: min(100%,265px); height: auto; margin-inline: auto; filter: drop-shadow(0 23px 30px rgba(10,28,38,.2)); }
.site-page .landing-hero__media figcaption { max-width: 320px; margin: 17px auto 0; color: var(--brand-copy); font-size: .84rem; line-height: 1.45; }
.site-page .landing-hero__strava { display: block; width: min(225px,80%); height: auto; margin-bottom: 27px; }

/* Legal and error pages use the same shell with a quiet reading measure. */
.site-page .privacy { padding: 125px 0 95px; }
.site-page .privacy__container { max-width: 72ch; padding: 0 20px; margin-inline: auto; }
.site-page .privacy__back { display: inline-flex; align-items: center; gap: 7px; color: var(--brand-cold); font-weight: 700; }
.site-page .privacy__title { color: var(--brand-ink); font-size: clamp(3rem,6vw,5.5rem); font-weight: 900; margin: 26px 0 8px; }
.site-page .privacy__effective { color: var(--brand-muted); margin-bottom: 54px; }
.site-page .privacy__section { margin-bottom: 43px; }
.site-page .privacy__section h2 { color: var(--brand-ink); font-size: 1.85rem; font-weight: 850; margin-bottom: 16px; }
.site-page .privacy__section p, .site-page .privacy__section li { color: var(--brand-copy); font-size: 1.04rem; line-height: 1.75; }
.site-page .privacy__section a { color: var(--brand-cold); text-decoration: underline; }
.site-page .privacy__section ul { list-style: none; padding: 0; margin-top: 12px; }
.site-page .privacy__section li { position: relative; padding-left: 21px; margin-bottom: 8px; }
.site-page .privacy__section li::before { content: "•"; position: absolute; left: 0; color: var(--brand-cold); }
.site-page .privacy__highlight { background: var(--brand-ice); border: 0; border-left: 4px solid var(--brand-cold); border-radius: 0; padding: 22px 25px; margin-top: 20px; }
.site-page .privacy__highlight p { color: var(--brand-ink); }
.site-page .error-page { min-height: 70vh; background: var(--brand-ice); display: grid; place-items: center; text-align: center; padding: 140px 20px 90px; }
.site-page .error-page h1 { font-size: clamp(6rem,15vw,12rem); font-weight: 900; line-height: 1; }
.site-page .error-page p { color: var(--brand-copy); font-size: 1.2rem; margin-top: 20px; }
.site-page .error-page a { color: var(--brand-cold); font-weight: 800; text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 767px) {
    .site-page .article-page__container, .site-page .articles-page__container { width: min(100% - 40px,600px); }
    .site-page .article-page__back { margin-top: 95px; }
    .site-page .article-page__header { padding: 43px 0 55px; margin-bottom: 42px; }
    .site-page .article-page__title { font-size: clamp(2.8rem,10vw,4rem); }
    .site-page .article-page__related-grid, .site-page .articles-page__grid { grid-template-columns: 1fr; }
    .site-page .article-page__body { font-size: 1rem; }
    .site-page.landing-page .article-page__header { grid-template-columns: 1fr; gap: 30px; }
    .site-page .landing-hero__media video, .site-page .landing-hero__media img { width: min(66vw,260px); }
    .site-page .articles-page { padding-top: 68px; } /* = mobile nav height */
    .site-page .articles-page__header { padding: 40px 0 55px; }
    .site-page .article-page__cta { padding: 44px 25px; }
    .site-page .privacy { padding-top: 100px; }
}

/* The expanded Strava add-photo walkthrough follows its key takeaways. */
.site-page .strava-demo { max-width: 1120px; margin: 14px auto 70px; padding: 64px; background: var(--brand-deep); color: #f4fafb; display: grid; grid-template-columns: minmax(0,1.1fr) minmax(210px,.9fr); gap: 50px; align-items: center; }
.site-page .strava-demo h2 { color: #f4fafb; font-size: clamp(2.2rem,3.8vw,4.1rem); font-weight: 900; margin-bottom: 30px; }
.site-page .strava-demo ol { padding-left: 1.5em; }
.site-page .strava-demo li { color: #d0e0e7; padding-left: 5px; margin-bottom: 15px; font-size: 1rem; line-height: 1.6; }
.site-page .strava-demo li::marker { color: #f0c68e; font-weight: 800; }
.site-page .strava-demo__media { margin: 0; justify-self: center; }
.site-page .strava-demo__media video { display: block; height: auto; width: min(100%,315px); filter: drop-shadow(0 20px 28px rgba(0,0,0,.3)); }
@media (max-width: 767px) {
    .site-page .strava-demo { padding: 45px 22px; display: block; margin-bottom: 50px; }
    .site-page .strava-demo__media { margin-top: 36px; }
    .site-page .strava-demo__media video { width: min(70vw,260px); margin-inline: auto; }
}

/* Article-index closing band uses the same warm call to action as the homepage. */
.site-page .cta { background: var(--brand-cedar); color: #fff7ed; }
.site-page .cta__glow { display: none; }
.site-page .cta__heading { color: #fff7ed; font-family: var(--brand-font); font-size: clamp(2.6rem,4vw,4.4rem); font-weight: 900; }
.site-page .cta__subheading { color: #e7d2bb; }
.site-page .cta__button { background: #fff7ed; color: var(--brand-ink); }
.site-page .cta__button:hover { background: #f0c68e; }
