/* ========================================
   CSS Variables & Root
   ======================================== */
:root {
  --beige-0: #fdf9f4;
  --beige-1: #F5F0EB;
  --beige-2: #8C7D6E;
  --beige-3: #473C31;
  --beige-4: #473C31;
  --green: #9FBE56;
  --green-dark: #6c9445;
  --pink: #D9B19A;

  font-size: 16px;
}

/* ========================================
   CSS Reset
   ======================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
figure,
figcaption,
blockquote,
dl,
dd {
  padding: 0;
  margin: 0;
}

ul,
ol {
  list-style: none;
}

/* ========================================
   Base Styles
   ======================================== */
body {
  overflow-x: hidden;
  font-family: 'Zen Kaku Gothic New', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
  font-weight: 500;
  line-height: 170%;
  color: var(--beige-3);
}

p {
  line-height: 170%;
}

a {
  text-decoration: none;
}

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

/* ========================================
   Layout Components
   ======================================== */
.container {
  max-width: 960px;
  margin: 0 auto;
}

main section {
  max-width: 960px;
  padding: 100px 0;
  margin: 0 auto;
}

.sectionHeader {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0;
  text-align: center;
}


.sectionHeader h2 {
  margin-top: 12px;
  font-size: 25px;
  color: var(--green);
}

/* ========================================
   Common Components
   ======================================== */
.secondaryCta {
  display: inline-flex;
  gap: 0.5rem;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
  color: var(--beige-3);
  background: transparent;
  border-radius: 999px;
}

.secondaryCta:hover {
  color: #fff;
  background: var(--green);
}

.bannerBreak {
  display: none;
}

/* ========================================
   Hero Section
   ======================================== */
.hero {
  position: relative;
  display: flex;
  align-items: center;
  height: 0;
  padding: 0;
  padding-bottom: calc(100% * (1476 / 2880));
  overflow: hidden;
  background-image: url('/torelunavision-1minute1napkin/img/pc-toreluna-bg.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.heroInner {
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  max-width: 1400px;
  padding: 0 2rem;
  margin: 0 auto;
  transform: translateY(-50%);
}

.heroContent {
  position: relative;
  z-index: 1;
  max-width: 960px;
  margin: 0 0 0 auto;
  text-align: center;
}

.heroContent h1 {
  margin: 0;
  font-size: 30px;
  line-height: 1.4;
  color: var(--beige-2);
}

.heroContent h1 img {
  margin: 0 auto;
  margin-bottom: 20px;
}

.heroContent img {
  display: block;
}

.heroSubtitle {
  font-size: 50px;
  font-weight: 600;
  color: var(--beige-2);
}

.heroTagline {
  margin: 0 auto;
  margin-top: 48px;
}

.heroFloatingCta {
  position: fixed;
  right: 0;
  bottom: 40px;
  z-index: 1000;
  padding: 16px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  color: #fff;
  background: #F27888;
  border-radius: 999px 0 0 999px;
  transform: translateY(-50%);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.heroFloatingCta:hover {
  background: #E06171;
}

.heroVisual {
  display: flex;
  justify-content: center;
}

.heroVisual img {
  display: block;
  width: min(520px, 80vw);
  height: auto;
  object-fit: contain;
  border-radius: 40px;
}

/* ========================================
   Voices Section
   ======================================== */
.voices{
  padding: 64px 0 74px;
}

.voices h2 {
  margin: 0 0 20px;
  font-size: 25px;
  color: var(--beige-4);
  text-align: center;
}

.voiceList {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  justify-content: center;
  padding: 0;
  margin-bottom: 20px;
  list-style: none;
}

.voiceCard {
  display: flex;
  flex: 1;
  gap: 8px;
  align-items: center;
  min-width: 240px;
  padding: 12px;
  font-size: 14px;
  background: var(--beige-1);
  border-radius: 12px;
}

.voiceCard img{
  max-width: 50px;
}

.voiceCard p {
  margin: 0;
}

.voiceWave {
  width: 269px;
  height: 30px;
  margin: 0 auto;
  background: #F5F0EB;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}

/* ========================================
   Concept Section
   ======================================== */
.conceptSection {
  position: relative;
  width: 100vw;
  max-width: none;
  padding: 100px 0;
  margin-left: calc(-50vw + 50%);
  background: var(--beige-1);
}

.concept {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  align-items: center;
  font-size: 14px;
}

.conceptCopy {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.conceptCopy p {
  margin: 0;
}

.conceptLead {
  font-size: 25px;
  font-weight: 600;
  line-height: 150%;
}

.conceptHighlight {
  background: linear-gradient(transparent 70%, #FADBC9 50%);
}

.conceptNote {
  margin: 0;
  font-size: 14px;
}

.conceptPhoto {
  display: flex;
  justify-content: center;
}

.conceptBanner {
  position: absolute;
  top: -50px;
  left: 50%;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 960px;
  padding: 16px 160px 16px 120px;
  color: #fff;
  background: var(--green);
  border-radius: 12px;
  transform: translateX(-50%);
}

.conceptBanner p {
  margin: 0;
  font-size: 25px;
  font-weight: 600;
  line-height: 1.5;
}

.conceptBannerFigure {
  position: absolute;
  right: 40px;
  bottom: 0;
  flex: 0 0 auto;
  width: 115px;

}

.conceptBannerFigure img {
  display: block;
  width: 100%;
  height: auto;
}

/* ========================================
   Strengths Section
   ======================================== */
.strengths {
  width: 100vw;
  max-width: none;
  padding: 100px 0;
  margin-left: calc(-50vw + 50%);
  background: #fff;
}

.strengthsList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 40px;
}

.strengthsCard{
  width: 100%;
  max-width: 225px;
  padding: 0 20px 20px;
  background: var(--beige-1);
  border-radius: 12px;
}

.strengthsCard p{
  font-size: 14px;
}

.strengthsCard .checkItem {
  margin-top: 12px;
}

.strengthsCard .check{
  position: relative;
  padding-left: 28px;
  margin: 0;
  font-weight: 600;
  line-height: 1.6;
  color: #D9A283;
}

.strengthsCard .description {
  font-weight: 400;
  color: var(--beige-4);
}

.strengthsCard .check::before{
  position: absolute;
  top: 0.2em;
  left: 0;
  width: 20px;
  height: calc(20px * 40 / 43);
  content: '';
  background-image: url("/torelunavision-1minute1napkin/img/strengths-check.png");
  background-repeat: no-repeat;
  background-size: contain;
}

.strengthsCard img{
  width: 100%;
  max-width: 120px;
  margin: 0 auto;
  margin-top: 16px;
}

.strengthsCard h3{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 30px;
  margin: 0 auto;
  font-size: 14px;
  line-height: 120%;
  color: #fff;
  text-align: center;
  background: var(--pink);
  border-radius: 0 0 4px 4px;
}

.strengthsCard h3 span{
  margin-left: 4px;
  font-size: 25px;
  line-height: 100%;
}

/* ========================================
   Achievements Section
   ======================================== */
.achievements {
  width: 100vw;
  max-width: none;
  padding: 100px 0;
  margin-left: calc(-50vw + 50%);
  background: var(--beige-1);
}

.achievementBox{
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: center;
  margin-top: 40px;
}

.achievementBoxItem{
  width: 100%;
  max-width: 304px;
  padding: 24px 15px;
  background: #fff;
  border-radius: 12px;
  text-align: center;
}

.achievementBoxItem h3{
  text-align: center;
}

.achievementBoxItem p{
  margin-top: 4px;
  text-align: center;
  line-height: 1.2;
  font-weight: 600;
  font-size: 20px;
}

.achievementBoxItem .withAnnotation{
  position: relative;
  display: inline-block;
}

.achievementBoxItem .withAnnotation::after{
  position: absolute;
  content: "※1";
  font-size: 12px;
  top: 4px;
  right: 0;
  color: var(--beige-2);
}

.achievementBoxItem span{
  color: var(--green);
  font-size: 35px;
  letter-spacing: 1px;
}

.achievements .annotation{
  font-size: 12px;
  color: var(--beige-2);
  text-align: center;
  display: flex;
  justify-content: center;
  margin-top: 24px;
  gap: 20px;
}


/* ========================================
   Structure Section
   ======================================== */
.structure {
  width: 100vw;
  max-width: none;
  padding: 100px 0;
  margin-left: calc(-50vw + 50%);
  background: #FDFAF7;
}

.structureBox{
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  justify-content: center;
  margin-top: 40px;
}

.structureBoxItem {
  text-align: center;
}

.structureBoxItem h3{
  display: inline-block;
  padding: 4px 12px;
  margin: 0;
  font-size: 20px;
  color: #fff;
  background: var(--green);
  border-radius: 6px;
}

.structureBoxItem p{
  margin-top: 16px;
  font-size: 18px;
}

.structureBoxItem img{
  margin: 0 auto;
  margin-top: 24px;
}

.structureBoxItem .systemDiagram{
  width: 100%;
  max-width: 627px;
}

.structureBoxItem .votingDiagram{
  width: 100%;
  max-width: 596px;
}

/* ========================================
   Users Section
   ======================================== */
.users {
  width: 100vw;
  max-width: none;
  padding: 100px 0;
  margin-left: calc(-50vw + 50%);
  background: #fff;
}

.users .container .annotation {
  margin-top: 24px;
  font-size: 12px;
  color: var(--beige-2);
  text-align: center;
}

.charts {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  margin-top: 40px;
}

.chartCard {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 16px;
  min-width: 220px;
  padding: 24px;
  text-align: center;
  background: var(--beige-1);
  border-radius: 12px;
}

.chartCard h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  color: var(--beige-4);
  text-align: center;
}

.chartCard .pie {
  width: 100%;
}

.chartLabel {
  padding: 0 45px;
  font-size: 14px;
  text-align: left;
}

/* ========================================
   Video Modal
   ======================================== */
.videoModal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  display: none;
  width: 100%;
  height: 100%;
}

.videoModalOverlay {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: color-mix(in srgb, var(--beige-2) 80%, transparent);
}

.videoModalContent {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: auto;
  border-radius: 12px;
}

.videoModalClose {
  position: absolute;
  top: -54px;
  right: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 24px;
  cursor: pointer;
  background: none;
  border: none;
  transition: opacity 0.2s ease;
}

.videoModalClose:hover {
  opacity: 0.7;
}


.videoContainer {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  overflow: hidden;
  background: #000;
  border-radius: 8px;
}

.videoContainer video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* ========================================
   Partners Section
   ======================================== */
.partners {
  width: 100vw;
  max-width: none;
  padding: 100px 0;
  margin-left: calc(-50vw + 50%);
  text-align: center;
  background: #FDFAF7;
}

.partnersDesc {
  margin-top: 20px;
}

.partners .secondaryCta {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 240px;
  height: 60px;
  padding: 10px 20px;
  margin: 64px auto 0;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  background: var(--beige-2);
  border: none;
  border-radius: 100px;
}

.partners .secondaryCta:hover {
  color: #fff;
  background: var(--green);
  border-color: var(--green);
}

.partnersGrid {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  justify-content: center;
  margin-top: 64px;
}


/* microCMS用のpartners-listスタイル */
.partnerVideoBtn {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 12px;
  transition: opacity 0.2s ease;
}

.partnerVideoBtn:hover {
  opacity: 0.6;
}

.partnerVideoPlayIcon {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 60px;
  height: 60px;
  margin: auto;
  pointer-events: none;
  transform: translate(-50%, -50%);
}

.partnersGrid ul {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  justify-content: center;
  padding: 0;
  margin: 0;
  list-style: none;
}

.partnersGrid li {
  display: block;
  width: 100%;
  max-width: 293px;
  color: var(--beige-3);
  text-align: left;
}

.partnersGrid button {
  width: 100%;
  border: none;
}

.partnersGrid img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.partnersGrid .name{
  margin-top: 16px;
  font-size: 14px;
  font-weight: 600;
}

.partnersGrid .description{
  margin-top: 4px;
  font-size: 16px;
}

.partnersGrid a{
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  margin-top: 16px;
  font-size: 14px;
  font-weight: 600;
  color: var(--beige-3);
}

.partnersGrid a::after {
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cg clip-path='url(%23clip0_450_5765)'%3E%3Cpath d='M10.5756 7.82063V8.93105C10.5756 9.26231 10.6407 9.68688 10.5338 10.0088C10.3014 10.718 9.53457 10.606 8.94898 10.606H3.26036C2.74913 10.606 2.00087 10.7367 1.63372 10.3027C1.29909 9.91084 1.42458 9.169 1.42458 8.68844V2.97771C1.42458 2.2732 1.3874 1.46604 2.3262 1.41006C3.17206 1.35874 4.04115 1.41006 4.88701 1.41006C5.78399 1.41006 5.78399 0.0103681 4.88701 0.0103681C4.03651 0.0103681 3.186 -0.0129601 2.34015 0.0103681C1.0063 0.0523587 0.0442514 1.04147 0.0256611 2.37584C0.00242333 4.31208 0.0256611 6.25298 0.0256611 8.19388C0.0256611 8.83774 -0.057995 9.56091 0.0767843 10.2001C0.3324 11.4412 1.42922 12.001 2.59576 12.001H8.66083C9.68329 12.001 10.6965 12.0664 11.4354 11.1846C12.1744 10.3027 11.9652 8.91706 11.9652 7.82063C11.9652 6.92017 10.571 6.92017 10.571 7.82063H10.5756Z' fill='%23473C31'/%3E%3Cpath d='M7.94002 1.39969H11.3002L10.6031 0.699844V4.29238C10.6031 4.6563 10.9238 5.01089 11.3002 4.99222C11.6767 4.97356 11.9973 4.68429 11.9973 4.29238V0.699844C11.9973 0.321928 11.6767 0 11.3002 0H7.94002C7.57751 0 7.2243 0.321928 7.24289 0.699844C7.26148 1.07776 7.54963 1.39969 7.94002 1.39969Z' fill='%23473C31'/%3E%3Cpath d='M10.5607 0.359673L6.96346 3.97087L6.45223 4.48409C6.19197 4.74537 6.17338 5.21659 6.45223 5.4732C6.73108 5.72981 7.16331 5.74848 7.43751 5.4732L11.0347 1.86201L11.546 1.34879C11.8062 1.08751 11.8248 0.616283 11.546 0.359673C11.2671 0.103064 10.8349 0.0844011 10.5607 0.359673Z' fill='%23473C31'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_450_5765'%3E%3Crect width='12' height='12' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
}

/* ========================================
   Statement Section
   ======================================== */
.statement {
  width: 100vw;
  max-width: none;
  padding: 100px 0;
  margin-left: calc(-50vw + 50%);
  background: var(--beige-1);
}

.statementBody {
  display: grid;
  gap: 40px;
  margin-top: 40px;
}

.statementLead {
  font-size: 25px;
  font-weight: 600;
  text-align: center;
}

.statementBody p:not(.statementLead) {
  font-size: 20px;
}

.statementHighlight {
  font-weight: 600;
  background: linear-gradient(transparent 70%, #FADBC9 50%);
}

/* ========================================
   Spot Section
   ======================================== */
.spot {
  position: relative;
  width: 100vw;
  max-width: none;
  padding: 100px 0;
  margin-left: calc(-50vw + 50%);
  background: var(--beige-1);
  background-image: url('/torelunavision-1minute1napkin/img/spot-map.png');
  background-repeat: no-repeat;
  background-position: calc(50% + 240px) center;
  background-size: 400px auto;
}

.spot .sectionHeader {
  align-items: flex-start;
  text-align: left;
}

.spot .sectionHeader h2 {
  margin-top: 0;
}

.spotDescription {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 20px;
}

.spotDescription p {
  margin: 0;
  font-size: 18px;
}

.spotDescription p span {
  font-size: 56px;
  font-weight: 600;
}

.spotDescription a {
  z-index: 100;
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 240px;
  height: 60px;
  padding: 10px 20px;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  background: var(--beige-2);
  border-radius: 100px;
}

/* ========================================
   Footer
   ======================================== */
.siteFooter {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 0 32px;
  color: #fff;
  text-align: center;
  background: #3a2b1c;
}

.siteFooter .footerActions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 20px;
}

.footerActions a{
  font-size: 12px;
  font-weight: 400;
  color: #fff;
}


.copyright {
  margin-top: 40px;
  font-size: 12px;
}

/* ========================================
   Media Queries
   ======================================== */
@media (width <= 1000px) {
  .container {
    padding: 0 20px;
  }

  .heroFloating {
    position: fixed;
    inset: auto 0 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 24px;
    margin: 0 auto;
    background: #F27888;
  }

  .heroFloatingCta {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    padding: 12px 40px;
    margin: 0 auto;
    color: #F27888;
    background: #fff;
    border-radius: 999px;
    transform: none;
  }

  .heroFloatingCta:hover {
    transform: none;
  }

  .heroTagline {
    margin-top: 48px;
  }

  .heroContent h1 {
    font-size: 20px;
  }

  .heroSubtitle {
    font-size: 40px;
  }

  .conceptBanner {
    flex-direction: column;
    width: calc(100% - 40px);
    padding: 16px 100px 16px 20px;
    text-align: left;
  }

  .conceptBanner p {
    font-size: 14px;
  }

  .conceptBannerFigure {
    right: 10px;
    width: 90px;
  }

  .chartLabel {
    padding: 0;
  }

  .strengthsList {
    gap: 20px;
    justify-content: center;
  }

  .strengthsCard {
    max-width: 380px;
  }

  .siteFooter {
    padding-bottom: 80px;
  }
}

@media screen and (width <= 798px) {
  .voiceList {
    flex-direction: column;
    gap: 1rem;
  }

  .voiceCard {
    width: 100%;
    min-width: unset;
  }
}

@media screen and (width <= 768px) {
  .container {
    padding: 0 20px;
  }

  .concept {
    grid-template-columns: 1fr;
  }

  .chartCard {
    padding: 20px;
  }


  main section,
  .conceptSection,
  .strengths,
  .users,
  .statement,
  .spot {
    padding: 64px 0;
  }

  .strengthsList,
  .structureBox,
  .charts,
  .statementBody {
    margin-top: 24px;
  }

  .chartLabel {
    padding: 0;
  }

  .statementBody {
    gap: 24px;
  }

  .statementLead {
    font-size: 18px;
    text-align: left;
  }

  .statementBody p:not(.statementLead) {
    font-size: 14px;
  }

  .bannerBreak{
    display: none;
  }

  .spotDescription {
    flex-direction: column;
    gap: 20px;
    align-items: center;
  }

  .spotDescription p {
    font-size: 16px;
  }

  .spot {
    background-position: right top;
    background-size: 250px auto;
  }

  .structure{
    padding: 64px 0;
  }

  .structureBoxItem h3 {
    font-size: 18px;
  }

  .strengthsCard {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    max-width: none;
  }

  .strengthsList {
    gap: 20px;
  }

  .strengthsCard .contentWrapper {
    display: flex;
    flex-direction: row-reverse;
    gap: 16px;
    align-items: flex-start;
  }

  .strengthsCard img {
    flex-shrink: 0;
    width: 80px;
    height: auto;
  }

  .strengthsCard .check {
    margin-top: 0;
  }

  .conceptLead {
    font-size: 18px;
  }

  .conceptBanner {
    width: calc(100% - 40px);
    padding: 16px 100px 16px 20px;
  }

  .conceptBanner p {
    font-size: 14px;
  }

  .conceptBannerFigure {
    right: 10px;
  }

  .partners{
    padding: 64px 0;
  }

  #partners-list li:nth-child(n+4){
    display: none;
  }

  .achievements {
    padding: 64px 0;
  }

  .achievementBox{
    margin-top: 24px;
  }

  .achievementBoxItem{
    max-width: none;
    width: 100%;
  }
  .achievementBoxItem h3{
    font-size: 18px;
  }
  .achievementBoxItem p{
    font-size: 18px;
  }

  .hero {
    height: 0;
    min-height: unset;
    padding: 0;
    padding-bottom: calc(100% * (1206 / 750));
    background-image: url('/torelunavision-1minute1napkin/img/sp-toreluna-bg.png');
  }

  .hero h1 {
    font-size: 19px;
  }

  .heroSubtitle {
    font-size: 32px;
  }

  .heroInner {
    top: 40px;
    margin: 0;
    transform: none;
  }

  .heroContent {
    margin: 0 auto;
  }

  .heroTagline {
    margin-top: 28px;
  }

  .heroContent h1 img {
    margin-bottom: 16px;
  }

  .voices h2 {
    font-size: 18px;
  }

  .sectionHeader h2 {
    font-size: 20px;
  }

  .strengths .sectionHeader img {
    max-width: 151px;
  }

  .achievements .sectionHeader img {
    max-width: 227px;
  }

  .structure .sectionHeader img {
    max-width: 150px;
  }

  .spot .sectionHeader img {
    max-width: 75px;
  }

  .users .sectionHeader img {
    max-width: 199px;
  }

  .partners .sectionHeader img {
    max-width: 203px;
  }

  .statement .sectionHeader img {
    max-width: 164px;
  }

  .heroFloating {
    position: fixed;
    inset: auto 0 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 24px;
    margin: 0 auto;
    background: #F27888;
  }

  .heroFloatingCta {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    padding: 12px 40px;
    margin: 0 auto;
    color: #F27888;
    background: #fff;
    border-radius: 999px;
    transform: none;
  }

  .partnersDesc{
    text-align: left;
  }

  .partnersGrid{
    margin-top: 40px;
  }

  .partnersGrid ul {
    gap: 40px;
  }

  .partnersGrid li {
    width: 100%;
    max-width: none;
  }

  .partners .secondaryCta {
    margin: 24px auto 0;
  }

  /* Video Modal - Mobile */
  .videoModalContent {
    max-width: calc(100% - 40px);
  }

  .videoModalClose {
    top: -50px;
    right: 0;
    width: 48px;
    height: 20px;
  }

  .siteFooter {
    padding-bottom: 80px;
  }
}

@media (width <= 640px) {
  .siteFooter {
    align-items: center;
    padding-bottom: 80px;
    text-align: center;
  }

  .structureBoxItem p {
    font-size: 14px;
    text-align: left;
  }

  .structureBoxItem img[src="/torelunavision-1minute1napkin/img/pc-structure01.png"] {
    content: url("/torelunavision-1minute1napkin/img/sp-structure01.png");
    padding: 0 27.5px;
  }
}

@media (width <= 380px) {
  .heroInner {
    top: 30px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition: none !important;
  }
}