/* --- CSS Variables & Base Setup --- */
:root {
  --color-navy: #1C2B45;
  --color-cream: #FBF6EE;
  --color-sand: #F3E8D8;
  --color-orange: #F28C38;
  --color-orange-deep: #B24A0C;
  --color-orange-hover: #F28C38;
  --color-yellow: #F6C445;
  
  --heading-color: var(--color-navy);
  --heading-color-on-dark: var(--color-cream);

  --font-serif: Georgia, "Times New Roman", serif;
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-swirly: 'Caveat', 'Brush Script MT', cursive;

  --header-height: 72px;
  --max-width: 1100px;
}

@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  background-color: var(--color-cream);
  color: var(--color-navy);
  font-family: var(--font-sans);
  font-size: 1.125rem;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: var(--color-orange-deep);
  text-decoration: underline;
}

a:hover, a:focus-visible {
  color: var(--color-navy);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: absolute;
  top: -100px;
  left: 1rem;
  background: var(--color-orange);
  color: var(--color-navy);
  padding: 0.75rem 1.25rem;
  z-index: 9999;
  font-weight: 700;
  text-decoration: none;
  border-radius: 4px;
  transition: top 0.2s ease;
}

.skip-link:focus {
  top: 1rem;
}

:focus-visible {
  outline: 3px solid var(--color-orange);
  outline-offset: 3px;
}

.container {
  width: 100%;
  max-width: var(--max-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

@media (max-width: 600px) {
  .container {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}


section {
  scroll-margin-top: var(--header-height);
}

.section-eyebrow {
  display: inline-block;
  font-size: 1.1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-orange-deep);
  margin-bottom: 0.5rem;
}

.section-title {
  font-family: var(--font-serif);
  font-size: clamp(1.4rem, 1.1rem + 1.2vw, 1.85rem);
  line-height: 1.35;
  font-weight: 700;
  color: var(--heading-color);
  margin-bottom: 1.5rem;
}

.section-title.on-dark {
  color: var(--heading-color-on-dark);
}

/* SVG Icon styles */
.icon-ext {
  display: inline-block;
  width: 0.85em;
  height: 0.85em;
  margin-left: 0.25em;
  vertical-align: baseline;
  fill: currentColor;
}

/* --- Buttons --- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1.5rem;
  min-height: 48px;
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
  border-radius: 9999px;
  border: 2px solid transparent;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
  text-align: center;
}

.btn-primary {
  background-color: var(--color-orange);
  color: var(--color-cream);
  border-color: var(--color-orange);
}

.btn-primary:hover, .btn-primary:focus-visible {
  background-color: var(--color-orange-hover);
  border-color: var(--color-orange-hover);
  color: var(--color-navy);
}

.btn-secondary {
  background-color: transparent;
  color: var(--color-cream);
  border-color: var(--color-cream);
}

.btn-secondary:hover, .btn-secondary:focus-visible {
  background-color: rgba(251, 246, 238, 0.15);
  color: var(--color-cream);
}

.btn-secondary-dark {
  background-color: transparent;
  color: var(--color-navy);
  border-color: var(--color-navy);
}

.btn-secondary-dark:hover, .btn-secondary-dark:focus-visible {
  background-color: rgba(28, 43, 69, 0.1);
  color: var(--color-navy);
}

.btn-outline-dark {
  background-color: transparent;
  color: var(--color-navy);
  border-color: var(--color-navy);
}

.btn-outline-dark:hover, .btn-outline-dark:focus-visible {
  background-color: var(--color-navy);
  color: var(--color-cream);
}

/* --- Nav --- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  height: var(--header-height);
  background-color: var(--color-navy);
  color: var(--color-cream);
  display: flex;
  align-items: center;
}

.nav-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.brand-link {
  font-family: var(--font-serif);
  text-decoration: none;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.1;
}

.brand-main {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--color-cream);
  display: inline-flex;
  align-items: center;
  gap: 0.15em;
}

.brand-byline {
  font-family: var(--font-sans);
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--color-sand);
  opacity: 0.85;
  margin-top: 0.15rem;
  letter-spacing: 0.02em;
}

.brand-link:hover .brand-main, .brand-link:focus-visible .brand-main {
  color: var(--color-orange);
}

.brand-link:hover .brand-soft, .brand-link:focus-visible .brand-soft {
  color: var(--color-orange);
}

.brand-soft {
  font-family: var(--font-swirly);
  font-size: 1.85rem;
  font-weight: 600;
  color: var(--color-cream);
  letter-spacing: 0.02em;
  transform: rotate(-3deg);
  display: inline-block;
}

.brand-link:hover, .brand-link:focus-visible {
  color: var(--color-orange);
}

.brand-link:hover .brand-soft, .brand-link:focus-visible .brand-soft {
  color: var(--color-orange);
}

.nav-toggle {
  display: none;
  background: none;
  border: none;
  color: var(--color-cream);
  padding: 0.5rem;
  cursor: pointer;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
}

.nav-toggle svg {
  width: 28px;
  height: 28px;
  fill: currentColor;
}

.nav-list {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  list-style: none;
}

.nav-link {
  color: var(--color-cream);
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: 500;
  transition: color 0.2s ease;
}

.nav-link:hover, .nav-link:focus-visible {
  color: var(--color-orange);
}

.nav-pill {
  background-color: var(--color-orange);
  color: white;
  padding: 0.5rem 1.25rem;
  border-radius: 9999px;
  font-weight: 700;
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.nav-pill:hover, .nav-pill:focus-visible {
  background-color: var(--color-orange-hover);
  color: var(--color-navy);
}

@media (max-width: 900px) {
  .nav-toggle {
    display: flex;
  }

  .nav-menu {
    position: absolute;
    top: var(--header-height);
    left: 0;
    right: 0;
    background-color: var(--color-navy);
    padding: 1.5rem;
    border-top: 1px solid rgba(251, 246, 238, 0.1);
    display: none;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
  }

  .nav-menu.is-open {
    display: block;
  }

  .nav-list {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
  }

  .nav-link {
    font-size: 1.1rem;
    display: block;
    padding: 0.25rem 0;
  }

  .nav-pill {
    display: inline-block;
    margin-top: 0.5rem;
  }
}

/* --- Hero --- */
.hero-section {
  position: relative;
  min-height: 90svh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background-color: var(--color-navy);
  color: #ffffff;
}

.hero-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
  z-index: 1;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: rgba(28,43,69,0.35)
}

.hero-container {
  position: relative;
  z-index: 3;
  width: 100%;
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.hero-content {
  text-align: left;
}

@media (min-width: 901px) {
  .hero-content {
    margin-left: 35%;
    max-width: 720px;
  }
}

@media (max-width: 900px) {
  .hero-content {
    margin-left: 0;
    width: 100%;
  }
}

.hero-name {
  font-family: var(--font-sans);
  font-size: clamp(1.6rem, 2.5vw, 1.85rem);
  font-weight: 700;
  letter-spacing: 0.03em;
  color: #ffffff;
  margin-bottom: 0.5rem;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}

.hero-role {
  display: block;
  font-size: clamp(1.05rem, 1.8vw, 1.25rem);
  font-weight: 500;
  font-style: italic;
  text-transform: none;
  letter-spacing: normal;
  opacity: 0.95;
  margin-top: 0.35rem;
  color: var(--color-sand);
}

.hero-divider {
  width: 48px;
  height: 3px;
  background-color: var(--color-orange);
  border: none;
  margin: 1rem 0 1.5rem 0;
}

.hero-headline {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 3.8vw, 3.25rem);
  line-height: 1.2;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1.5rem;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);
}

.hero-subhead {
  font-size: clamp(1.05rem, 2vw, 1.25rem);
  line-height: 1.6;
  color: var(--color-cream);
  opacity: 0.95;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
  margin-bottom: 1.75rem;
}

.hero-cta {
  display: flex;
  align-items: flex-start;
}

/* --- Who I Work With Strip --- */
.who-strip-section {
  background-color: var(--color-navy);
  padding: 1.5rem 0;
  border-top: 1px solid rgba(251, 246, 238, 0.15);
  border-bottom: 1px solid rgba(251, 246, 238, 0.15);
}

.who-strip-container {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: flex-start;
}

@media (min-width: 900px) {
  .who-strip-container {
    flex-direction: row;
    align-items: center;
    gap: 1.5rem;
  }
}

.who-strip-label {
  font-size: 0.85rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-orange);
  white-space: nowrap;
}

.who-tags-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.who-tag {
  background-color: rgba(251, 246, 238, 0.1);
  color: var(--color-cream);
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0.3rem 0.8rem;
  border-radius: 9999px;
  border: 1px solid rgba(251, 246, 238, 0.2);
  white-space: nowrap;
}

/* --- About Me --- */
.about-section {
  padding-top: 5rem;
  padding-bottom: 3rem;
  background-color: var(--color-cream);
}

.about-wrapper {
  display: block;
}

.about-wrapper::after {
  content: "";
  display: table;
  clear: both;
}

.about-photo-wrapper {
  width: 100%;
  max-width: 300px; /* Smaller size on mobile screens */
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.5rem;
}

@media (min-width: 900px) {
  .about-photo-wrapper {
    float: right;
    max-width: 360px; /* Restores your original, full size on desktop */
    margin-left: 2.5rem;
    margin-bottom: 0.5rem;
  }
}

.about-photo {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center top;
  border-radius: 8px;
  box-shadow: 0 10px 25px -5px rgba(28, 43, 69, 0.7);
}

.about-photo-caption {
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--color-navy);
  opacity: 0.7;
  text-align: center;
  margin-top: 0.5rem;
  letter-spacing: 0.02em;
}

.about-text p {
  margin-bottom: 1.25rem;
}

.about-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 2rem;
  align-items: center;
}

@media (max-width: 600px) {
  .about-cta-row {
    flex-direction: column;
    align-items: stretch;
  }

  .about-cta-row .btn {
    width: 100%;
  }
}

.about-divider {
  width: 100%;
  border: none;
  border-top: 1px solid rgba(28, 43, 69, 0.2);
  margin: 3.5rem 0 2.5rem 0;
}

/* Featured In Strip - All Logos on Single Line */
.featured-in-strip {
  width: 100%;
  text-align: center;
}

.featured-in-label {
  display: block;
  font-size: 0.95rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-navy);
  opacity: 0.75;
  margin-bottom: 1.5rem;
}

.featured-logos-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3rem;
  flex-wrap: nowrap;
}

.featured-logo {
  width: auto;
  object-fit: contain;
}

.logo-ldf {
  max-height: 80px; 
}

.logo-jhu {
  max-height: 75px; 
}

.logo-streetsblog {
  max-height: 80px; 
}

@media (max-width: 768px) {
  .featured-logos-row {
    gap: 1.25rem;
  }

  .logo-ldf {
    max-height: 48px;
  }

  .logo-jhu {
    max-height: 45px;
  }

  .logo-streetsblog {
    max-height: 40px;
  }

}

/* --- Offerings --- */
.offerings-section {
  padding: 5rem 0;
  background-color: var(--color-sand);
}

.offerings-title {
  color: var(--color-orange-deep);
}

.offerings-intro {
  font-size: 1.2rem;
  max-width: 800px;
  margin-bottom: 3rem;
}

.offerings-list {
  list-style: none;
  margin-bottom: 4rem;
}

.offering-item {
  padding: 2.5rem 0;
  border-top: 1px solid rgba(28, 43, 69, 0.2);
}

.offering-item:last-child {
  border-bottom: 1px solid rgba(28, 43, 69, 0.2);
}

.offering-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

@media (min-width: 900px) {
  .offering-grid {
    grid-template-columns: 320px 1fr;
    gap: 2rem;
  }
}

.offering-item h3 {
  font-family: var(--font-serif);
  font-size: 1.5rem;
  line-height: 1.3;
  color: var(--color-navy);
}

.offering-content p {
  font-size: 1.05rem;
  margin-bottom: 1rem;
}

.offering-content .offering-lead {
  font-size: 1.3rem;
  line-height: 1.45;
  margin-bottom: 0.75rem;
}

.offering-lead strong {
  color: var(--color-navy);
  font-weight: 700;
}

@media (max-width: 600px) {
  .offering-lead {
    font-size: 1.3rem;
  }
}

.offering-btn {
  display: inline-flex;
  align-items: center;
  margin-top: 0.5rem;
  padding: 0.45rem 1.15rem;
  color: #ffffff;
  font-weight: 700;
  font-size: 0.9rem;
  text-decoration: none;
  border: 1px solid var(--color-orange);
  border-radius: 9999px;
  background-color: var(--color-orange);
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.offering-btn:hover, 
.offering-btn:focus-visible {
  color: #ffffff;
  background-color: var(--color-orange-hover);
  border-color: var(--color-orange-hover);
}

.offering-btn-arrow {
  width: 0.9em;
  height: 0.9em;
  margin-right: 0.35em;
  fill: #ffffff;
  flex-shrink: 0;
}

/* --- Ways to Start Subsection --- */
.ways-to-start-block {
  margin-bottom: 4rem;
}

.ways-to-start-title {
  font-family: var(--font-serif);
  font-size: 1.65rem;
  color: var(--color-navy);
  margin-bottom: 1.5rem;
}

.ways-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 768px) {
  .ways-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.way-card {
  background-color: var(--color-cream);
  border: 1px solid rgba(28, 43, 69, 0.15);
  border-radius: 8px;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.way-card h4 {
  font-family: var(--font-serif);
  font-size: 1.2rem;
  color: var(--color-navy);
  margin-bottom: 0.75rem;
}

.way-desc {
  font-size: 0.95rem;
  color: var(--color-navy);
  line-height: 1.5;
  margin-bottom: 1.25rem;
}

.way-meta {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: flex-start;
}

.way-timeline {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--color-orange-deep);
}

.way-btn {
  padding: 0.4rem 1rem;
  min-height: 38px;
  font-size: 0.875rem;
}

/* Working across the Atlantic Block */
.atlantic-block {
  background-color: var(--color-cream);
  border-radius: 8px;
  padding: 2.5rem;
  border-left: 6px solid var(--color-orange-deep);
  box-shadow: 0 4px 12px rgba(28, 43, 69, 0.05);
}

.atlantic-block h3 {
  font-family: var(--font-serif);
  font-size: 1.5rem;
  color: var(--color-navy);
  margin-bottom: 1.5rem;
}

.atlantic-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 900px) {
  .atlantic-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.atlantic-col h4 {
  font-family: var(--font-sans);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--color-orange-deep);
  margin-bottom: 0.75rem;
}

.atlantic-col p {
  font-size: 1rem;
}

/* --- Publications --- */
.publications-section {
  position: relative;
  padding: 5rem 0;
  background-color: var(--color-navy);
  color: var(--color-cream);
  overflow: hidden;
}

.publications-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 1;
}

.publications-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background-color: rgba(28, 43, 69, 0.2);
}

.publications-container {
  position: relative;
  z-index: 3;
}

.publications-list {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}

.pub-card {
  background-color: rgba(28, 43, 69, 0.65);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(251, 246, 238, 0.25);
  border-radius: 8px;
  padding: 1.5rem;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.pub-card:hover {
  background-color: rgba(28, 43, 69, 0.85);
  border-color: rgba(242, 140, 56, 0.8);
}

.pub-meta {
  display: inline-block;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-orange);
  margin-bottom: 0.5rem;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
}

.pub-title-link {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  line-height: 1.4;
  color: #ffffff;
  text-decoration: none;
  display: inline-block;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
}

.pub-title-link:hover, .pub-title-link:focus-visible {
  color: var(--color-orange);
  text-decoration: underline;
}

/* --- Blog Section Formatting --- */
.blog-section {
  padding: 5rem 0;
  background-color: var(--color-cream);
}

.blog-empty {
  font-style: italic;
  color: var(--color-navy);
  opacity: 0.8;
  margin-bottom: 2rem;
}

.blog-posts-container {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  margin-bottom: 2rem;
}

.post {
  background-color: var(--color-sand);
  border-radius: 8px;
  padding: 2.25rem;
  border: 1px solid rgba(28, 43, 69, 0.08);
}

.post h3 {
  font-family: var(--font-serif);
  font-size: 1.65rem;
  color: var(--color-navy);
  margin-bottom: 0.35rem;
}

.post h4 {
  font-family: var(--font-serif);
  font-size: 1.3rem;
  color: var(--color-navy);
  margin-top: 1.75rem;
  margin-bottom: 0.75rem;
}

@media (max-width: 600px) { 
  .post h3 {
    font-size: 1.45rem;
  }

  .post h4 {
    font-size: 1.2rem;
  }

  .post p, .post li {
    font-size: 1.05rem;
  }
}

.post-date {
  font-size: 0.9rem;
  color: var(--color-orange-deep);
  font-weight: 700;
  margin-bottom: 0.75rem;
  display: inline-block;
}

.post-subtitle {
  font-size: 1.05rem;
  margin-bottom: 1rem;
  color: var(--color-navy);
  opacity: 0.9;
}

.post-author-note {
  font-size: 1rem;
  margin-bottom: 1.25rem;
  padding: 0.85rem 1rem;
  background-color: rgba(251, 246, 238, 0.6);
  border-left: 4px solid var(--color-orange);
  border-radius: 0 6px 6px 0;
}

.post-preview-text p {
  margin-bottom: 1rem;
}

.post-full-content {
  margin-top: 1rem;
}

.post-full-content p {
  margin-bottom: 1.25rem;
}

.blog-bullet-list {
  margin-left: 1.5rem;
  margin-bottom: 1.5rem;
  list-style-type: disc;
}

.blog-bullet-list li {
  margin-bottom: 0.75rem;
  line-height: 1.6;
}

/* Image centered wrapper & caption styling */
.blog-image-wrapper {
  margin: 2rem auto;
  text-align: center;
  max-width: 650px;
}

.blog-inline-img {
  width: 100%;
  max-width: 600px;
  height: auto;
  border-radius: 6px;
  margin: 0 auto;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.blog-img-caption {
  font-size: 0.9rem;
  line-height: 1.45;
  color: var(--color-navy);
  opacity: 0.88;
  margin-top: 0.75rem;
  padding: 0 0.5rem;
  text-align: center;
}

.blog-read-more-wrapper {
  margin-top: 1.5rem;
}

.blog-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.5rem;
  margin-top: 2rem;
}

.newsletter-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.newsletter-descriptor {
  font-size: 0.95rem;
  font-style: italic;
  color: var(--color-navy);
  margin-bottom: 0.5rem;
  max-width: 450px;
  line-height: 1.4;
}

/* --- Get in Touch --- */
.contact-section {
  position: relative;
  padding: 5rem 0;
  background-color: var(--color-navy);
  color: var(--color-cream);
  text-align: center;
  min-height: 50vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.contact-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 1;
}

.contact-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background-color: rgba(28, 43, 69, 0.4);
}

.contact-container {
  position: relative;
  z-index: 3;
  max-width: 800px;
}

.contact-title {
  font-size: clamp(1.75rem, 3vw, 2.35rem);
  margin-bottom: 1.25rem;
}

.contact-text {
  font-size: clamp(1.15rem, 1.8vw, 1.35rem);
  line-height: 1.5;
  margin-bottom: 2.25rem;
  color: var(--color-cream);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
}

.contact-buttons {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 1.25rem;
  flex-wrap: wrap;
}

.contact-btn {
  font-size: 1.05rem;
  padding: 0.75rem 1.75rem;
  min-height: 48px;
}

.contact-social-link {
  margin-top: 1.5rem;
}

.contact-linkedin-link {
  color: var(--color-cream);
  font-size: 1.05rem;
  font-weight: 600;
  text-decoration: underline;
  transition: color 0.2s ease;
}

.contact-linkedin-link:hover,
.contact-linkedin-link:focus-visible {
  color: var(--color-orange);
}

@media (max-width: 600px) {
  .contact-buttons {
    flex-direction: column;
    width: 100%;
  }

  .contact-buttons .btn {
    width: 100%;
  }
}
.contact-copyright {
  margin-top: 1.5rem;
  font-size: 0.9rem;
  color: var(--color-cream);
  opacity: 0.8;
  letter-spacing: 0.02em;
}
@media (max-width: 600px) {
  .atlantic-block {
    padding: 1.5rem; /* Makes the inner padding of the box more compact on mobile */
  }
  
  .atlantic-block h3 {
    font-size: 1.25rem; /* Reduces the heading size slightly */
  }

  .atlantic-col p {
    font-size: 0.95rem; /* Makes the paragraph text smaller and easier to read on small screens */
  }
@media (max-width: 600px) {
  .about-text p {
    font-size: 1.07rem; /* Makes the paragraph text smaller on mobile screens */
  }
@media (max-width: 600px) {
  .who-strip-section {
    padding: 1rem 0; /* Shrinks the top and bottom padding of the section */
  }

  .who-tags-row {
    gap: 0.35rem; /* Reduces the spacing between tags */
  }

  .who-tag {
    font-size: 0.75rem; /* Makes the text slightly smaller on mobile */
    padding: 0.2rem 0.5rem; /* Reduces inner padding around each tag */
  }
@media (max-width: 600px) {
  .pub-title-link {
    font-size: 1.09rem; /* Makes publication titles smaller on mobile screens */
  }
@media (max-width: 600px) {
  .post {
    padding: 1.25rem;
  }

  .post p, .post li {
    font-size: 0.97rem;
    line-height: 1.5;
  }
@media (max-width: 600px) {
  .post {
    padding: 1.25rem; /* Reduces the inner padding of the blog box so text sits closer to the edges */
  }

  .post p, .post li {
    font-size: 0.95rem; /* Makes blog body text and bullet lists smaller and easier to read on mobile */
    line-height: 1.5;   /* Adjusts line spacing slightly for the smaller text */
  }
}