.home-hero { min-height: 100svh; display: flex; align-items: center; }
.home-hero__content { padding-block: 160px 140px; }
.home-hero__heading { font-size: clamp(54px,5.55vw,94px); line-height: .98; font-weight: 900; letter-spacing: -.055em; margin-bottom: 22px; max-width: 900px; }
.home-hero__heading > span { display: block; }
.home-hero__description { font-size: 20px; line-height: 1.35; max-width: 650px; }
.scroll-cue { position: absolute; bottom: 35px; left: var(--gutter); display: flex; flex-direction: column-reverse; gap: 8px; font-size: 12px; letter-spacing: .15em; font-weight: 700; }
.scroll-cue span { font-size: 36px; font-weight: 400; }
.services-overview { background: linear-gradient(110deg,#fff8f8,#f3f8fa); }
.overview-figure { position: relative; min-width: 0; margin-right: 15px; }
.overview-figure__main { height: 330px; width: 100%; object-fit: cover; border-radius: 26px; }
.overview-figure__inset { position: absolute; width: 44%; right: -15px; bottom: -35px; border: 6px solid white; border-radius: 22px; overflow: hidden; box-shadow: var(--shadow); background: white; }
.overview-figure__inset img { aspect-ratio: 1.3; object-fit: cover; }
.overview-figure__inset button { position: absolute; top: 28%; left: 38%; border: 0; border-radius: 50%; width: 46px; height: 46px; background: var(--brand); color: white; }
.overview-figure__inset p { padding: 12px; font-weight: 700; font-size: 13px; }
.overview-figure__inset p span { display: block; font-weight: 400; }
.compact-services { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); margin-top: 65px; gap: 15px; }
.compact-service { position: relative; display: grid; grid-template-columns: minmax(0,1fr) 55px; gap: 10px; border-radius: 18px; border: 1px solid #eee; background: #ffffffdf; padding: 20px 17px; min-width: 0; }
.compact-service .card-number { grid-column: 1/-1; color: var(--brand); font-size: 15px; }
.compact-service h3 { font-size: 17px; line-height: 1.12; margin-bottom: 8px; }
.compact-service p { font-size: 12px; color: var(--muted); }
.compact-service img { width: 55px; height: 90px; border-radius: 10px; object-fit: cover; }
.compact-service > a { position: absolute; bottom: 12px; right: 16px; color: var(--brand); font-size: 22px; }
.services-detail { background: radial-gradient(at 100% 100%,#ffe3e8,transparent 40%),radial-gradient(at 0% 0%,#eef7fc,transparent 50%),#fff; }
.scene-intro { position: relative; padding: 0 0 30px; min-height: 215px; background: linear-gradient(90deg,#fffffff2 46%,transparent),url('../images/background.png') right center/contain no-repeat; }
.scene-intro .intro-copy { max-width: 760px; }
.scene-intro .sound-badge { position: absolute; top: 0; right: 25%; }
.scene-intro .handwritten { position: absolute; right: 31%; bottom: 15px; }
.service-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 16px; }
.feature-card { border-radius: 20px; background: #ffffffef; box-shadow: var(--shadow); overflow: hidden; min-width: 0; border: 1px solid white; transition: transform .3s var(--ease),box-shadow .3s; }
.feature-card:hover,.project-tile:hover,.platform-tile:hover { transform: translateY(-5px); box-shadow: 0 25px 55px #00000015; }
.feature-card__image { position: relative; padding: 5px; }
.feature-card__image img { width: 100%; height: 165px; object-fit: cover; border-radius: 16px; }
.feature-card__image .card-number { position: absolute; top: 16px; left: 20px; color: white; text-shadow: 0 1px 8px #000; }
.feature-card__image .circle-link { position: absolute; top: 13px; right: 13px; width: 34px; height: 34px; }
.feature-card__body { padding: 0 20px 18px; }
.feature-card__body .card-symbol { position: relative; margin-top: -34px; margin-bottom: 10px; }
.feature-card h3 { font-size: 19px; letter-spacing: -.03em; line-height: 1.2; margin-bottom: 10px; }
.feature-card p { color: var(--muted); font-size: 14px; line-height: 1.4; min-height: 78px; }
.card-action { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; padding-top: 15px; border-top: 1px solid var(--line); }
.card-action > span:last-child { border-radius: 50%; width: 36px; height: 36px; display: grid; place-items: center; background: var(--brand); color: white; font-size: 22px; }
.service-outro,.platform-outro { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 30px; align-items: stretch; }
.service-outro .metrics,.platform-outro .metrics { margin: 0; padding: 25px; background: white; border-radius: 20px; justify-content: space-between; }
.service-outro .metrics > div,.platform-outro .metrics > div { padding: 0 18px; }
.work-showcase { background: linear-gradient(145deg,#f7fafb,#fff5f6); }
.featured-case { min-height: 330px; border-radius: 26px; padding: 50px; display: flex; align-items: end; justify-content: space-between; gap: 35px; color: white; background: linear-gradient(90deg,#080808ed,#08080838),url('../images/background.png') center/cover; }
.featured-case__badge { font-size: 11px; letter-spacing: .18em; margin-bottom: 16px; }
.featured-case h3 { font-size: clamp(26px,3vw,43px); letter-spacing: -.04em; max-width: 530px; line-height: 1.05; }
.featured-case p:not(.featured-case__badge) { max-width: 450px; margin-top: 16px; font-size: 14px; color: #eee; }
.case-play { display: grid; grid-template-columns: 60px 1fr; align-items: center; gap: 0 16px; background: none; color: white; border: 0; text-align: left; flex-shrink: 0; }
.case-play > span { grid-row: span 2; width: 60px; height: 60px; display: grid; place-items: center; border-radius: 50%; background: #ffffff40; border: 1px solid #fff8; }
.case-play small { color: #ddd; }
.project-carousel { position: relative; margin-top: 30px; }
.project-list { display: flex; gap: 22px; overflow-x: auto; padding: 8px 3px 25px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.project-tile { flex: 0 0 calc((100% - 66px)/4); min-width: 0; border-radius: 20px; background: white; border: 1px solid white; overflow: hidden; scroll-snap-align: start; transition: transform .3s,box-shadow .3s; }
.project-tile__image { position: relative; }
.project-tile__image img { width: 100%; aspect-ratio: 1.6; object-fit: cover; }
.project-tile__image > span { position: absolute; top: 13px; left: 13px; color: white; border-radius: 15px; background: #0008; padding: 6px 10px; font-size: 9px; letter-spacing: .07em; }
.project-tile__image button { position: absolute; bottom: 12px; right: 12px; border: 1px solid #fff8; color: white; background: #0007; border-radius: 50%; width: 34px; height: 34px; }
.project-tile__body { padding: 20px; }
.project-tile h3 { font-size: 19px; line-height: 1.2; }
.project-tile p { color: var(--muted); font-size: 14px; margin: 10px 0 18px; }
.carousel-control { position: absolute; top: 40%; z-index: 2; border: 1px solid var(--line); background: white; border-radius: 50%; box-shadow: var(--shadow); width: 42px; height: 42px; }
.carousel-control[data-slide=previous] { left: -18px; }.carousel-control[data-slide=next] { right: -18px; }
.about-story { background: radial-gradient(at 85% 40%,#fff2f4,transparent 55%),#fff; }
.about-figure { position: relative; padding: 15px; min-width: 0; }
.about-figure > img { width: 100%; height: 350px; object-fit: cover; border-radius: 30px; }
.about-figure .sound-badge { position: absolute; right: 0; bottom: -15px; }
.about-figure .handwritten { position: absolute; top: -20px; right: 15%; }
.about-principles { display: grid; grid-template-columns: .8fr 1.3fr; gap: 25px; margin-top: 60px; }
.purpose-figure { position: relative; overflow: hidden; border-radius: 25px; }
.purpose-figure img { height: 100%; width: 100%; object-fit: cover; min-height: 350px; }
.purpose-figure figcaption { position: absolute; inset: 0; display: flex; align-items: end; padding: 32px; background: linear-gradient(transparent,#000a); color: white; }
.purpose-heading { font-size: 34px; line-height: 1.05; letter-spacing: -.04em; }
.purpose-heading > span { display: block; }
.principle-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.principle-grid article { padding: 28px; background: white; border: 1px solid var(--line); border-radius: 22px; }
.principle-grid article > span { color: var(--brand); font-size: 27px; }
.principle-grid h3 { font-size: 19px; margin: 10px 0; }
.principle-grid p,.principle-grid li { color: var(--muted); font-size: 14px; line-height: 1.45; }
.principle-grid ul { padding-left: 18px; margin-bottom: 0; }
.principle-grid .creator-principle { color: white; background: var(--ink); }.creator-principle p { color: #ddd; }
.platform-showcase { background: radial-gradient(at 100% 100%,#ffe7ee,transparent 45%),#f7fafc; }
.platform-figure { position: relative; padding: 15px 25px 25px; min-width: 0; }
.platform-figure > img { width: 100%; height: 300px; object-fit: cover; border-radius: 28px; }
.reach-card,.analytics-card { position: absolute; background: #fffffff0; border: 1px solid white; border-radius: 18px; box-shadow: var(--shadow); padding: 18px; width: 150px; }
.reach-card { top: -10px; right: 0; }.reach-card svg { width: 100%; height: 70px; fill: #434952; }.reach-card strong,.reach-card span { display: block; }.reach-card strong:last-of-type { color: var(--brand); font-size: 28px; }
.analytics-card { left: 0; bottom: 0; }.analytics-card strong { display: block; font-size: 25px; }.analytics-card span,.analytics-card small,.reach-card span { font-size: 11px; color: var(--muted); }
.analytics-bars { display: flex; align-items: end; gap: 6px; height: 55px; margin-block: 10px; }.analytics-bars i { flex: 1; height: 25%; border-radius: 4px 4px 0 0; background: var(--brand); }.analytics-bars i:nth-child(2) { height: 42%; }.analytics-bars i:nth-child(3) { height: 55%; }.analytics-bars i:nth-child(4) { height: 48%; }.analytics-bars i:nth-child(5) { height: 72%; }.analytics-bars i:nth-child(6) { height: 88%; }
.platform-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 18px; margin-top: 40px; }
.platform-tile { overflow: hidden; background: white; border-radius: 22px; border: 1px solid var(--line); min-width: 0; transition: transform .3s,box-shadow .3s; }.platform-tile__image { position: relative; }.platform-tile__image img { height: 130px; width: 100%; object-fit: cover; }.platform-tile__image .card-number { position: absolute; left: 15px; top: 10px; color: white; text-shadow: 0 1px 8px black; }.platform-tile > div:last-child { padding: 18px; }.platform-tile .card-symbol { width: 42px; height: 42px; font-size: 22px; margin-top: -38px; position: relative; }.platform-tile h3 { font-size: 18px; margin-top: 10px; line-height: 1.12; }.platform-tile p { font-size: 13px; color: var(--muted); margin: 10px 0 18px; }
.available-platforms { display: flex; gap: 25px; justify-content: center; align-items: center; flex-wrap: wrap; padding-top: 40px; color: #565b63; font-size: 15px; }.available-platforms strong,.available-platforms small { font-size: 10px; }
.inquiry-section { min-height: 850px; }.inquiry-section::after { background: linear-gradient(90deg,#ffffffed 0%,#ffffffeb 25%,#ffffff70 55%,transparent 82%),linear-gradient(0deg,#ffffffe8,transparent 65%); }
.inquiry-intro { max-width: 760px; margin-bottom: 28px; }.inquiry-intro .display-heading { font-size: clamp(36px,3.9vw,64px); }.inquiry-intro .intro-copy { max-width: 650px; }
.inquiry-types { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin-top: 30px; }.inquiry-types button { min-width: 0; background: #ffffffdf; border: 1px solid #f4d9dd; border-radius: 15px; padding: 16px 12px; font-size: 11px; font-weight: 600; min-height: 65px; line-height: 1.5; }.inquiry-types button[aria-pressed=true] { color: white; background: var(--brand); }
.inquiry-grid { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.1fr); gap: 22px; align-items: stretch; }.inquiry-form-panel { background: #ffffffef; border: 1px solid white; border-radius: 22px; padding: 27px; box-shadow: var(--shadow); }.inquiry-form-panel h2 { font-size: 23px; letter-spacing: -.03em; }.inquiry-form-panel > p { color: var(--muted); font-size: 14px; margin: 4px 0 20px; }
.inquiry-side { display: flex; flex-direction: column; gap: 18px; }.inquiry-details { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; background: #fffffff2; border: 1px solid white; border-radius: 22px; padding: 24px; box-shadow: var(--shadow); }.inquiry-details article { display: flex; gap: 12px; min-width: 0; }.inquiry-details h3 { font-size: 16px; line-height: 1.1; }.inquiry-details p { font-size: 12px; line-height: 1.35; color: var(--muted); margin: 6px 0 9px; }.inquiry-details a,.inquiry-details .text-action { color: var(--brand); font-size: 12px; overflow-wrap: anywhere; }.detail-icon { display: grid; place-items: center; width: 38px; height: 46px; flex-shrink: 0; background: var(--tint); border-radius: 14px; color: var(--brand); font-size: 25px; }
.world-reach { background: #ffffffdc; border: 1px solid white; border-radius: 22px; padding: 25px; display: grid; grid-template-columns: 1fr 1.2fr; align-items: center; gap: 10px; box-shadow: var(--shadow); flex: 1; }.world-reach .eyebrow { font-size: 10px; letter-spacing: .2em; margin-bottom: 10px; }.world-reach__heading { font-size: 31px; line-height: 1.05; letter-spacing: -.04em; margin-bottom: 12px; }.world-reach p:not(.eyebrow) { color: var(--muted); font-size: 13px; line-height: 1.3; }.world-reach__illustration { position: relative; }.world-reach__illustration svg { width: 100%; fill: #393f46; }.map-point { position: absolute; top: 30%; left: 27%; color: var(--brand); font-size: 18px; }.map-point--two { left: 70%; top: 55%; }
.contact-benefits { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); padding: 18px 20px; gap: 14px; border-radius: 20px; background: #fffffff2; box-shadow: var(--shadow); }.contact-benefits > div { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 0 5px; }.contact-benefits span { grid-row: span 2; font-size: 26px; color: var(--brand); }.contact-benefits strong { font-size: 10px; }.contact-benefits small { font-size: 9px; color: var(--muted); }
@media(min-width:1700px) { .home-hero { min-height: 950px; } }
@media(max-width:1250px) { .service-grid,.platform-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }.compact-services { grid-template-columns: repeat(3,minmax(0,1fr)); }.scene-intro .sound-badge { display: none; }.scene-intro .handwritten { right: 12%; }.service-outro,.platform-outro { grid-template-columns: minmax(0,1fr); }.project-tile { flex-basis: calc((100% - 44px)/3); }.inquiry-details { gap: 14px; padding: 20px; }.inquiry-details article { flex-direction: column; gap: 8px; }.contact-benefits { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:900px) { .home-hero__heading { font-size: clamp(46px,7.2vw,65px); }.home-hero__description { max-width: 520px; font-size: 18px; }.home-hero::after { background: linear-gradient(90deg,#fffffff2,#ffffffc0 60%,#ffffff70); }.project-tile { flex-basis: calc((100% - 22px)/2); }.about-principles { grid-template-columns: minmax(0,1fr); }.purpose-figure img { height: 300px; min-height: 0; }.inquiry-grid { grid-template-columns: minmax(0,1fr); }.inquiry-details article { flex-direction: row; }.inquiry-details h3 { font-size: 14px; }.contact-benefits { grid-template-columns: repeat(4,minmax(0,1fr)); }.overview-figure { margin: 25px 20px 25px 0; }.platform-figure { margin-top: 20px; } }
@media(max-width:600px) { .home-hero__content { padding-block: 135px 105px; }.home-hero__heading { font-size: clamp(34px,8.6vw,50px); letter-spacing: -.045em; }.home-hero__description { font-size: 16px; }.home-hero .eyebrow { font-size: 9px; letter-spacing: .23em; }.home-hero .actions > * { width: 100%; max-width: 290px; }.scroll-cue { bottom: 20px; }.compact-services,.service-grid,.platform-grid { grid-template-columns: minmax(0,1fr); }.compact-service { grid-template-columns: minmax(0,1fr) 80px; }.compact-service img { width: 80px; }.feature-card__image img { height: 210px; }.feature-card p { min-height: 0; }.feature-card__body { padding-inline: 22px; }.scene-intro { background: none; }.scene-intro .handwritten { display: none; }.featured-case { padding: 26px; flex-direction: column; align-items: start; min-height: 320px; }.case-play { margin-top: 15px; }.project-tile { flex-basis: 86%; }.carousel-control[data-slide=previous] { left: -12px; }.carousel-control[data-slide=next] { right: -12px; }.principle-grid { grid-template-columns: minmax(0,1fr); }.about-figure > img { height: 270px; }.inquiry-types { grid-template-columns: repeat(2,minmax(0,1fr)); }.inquiry-details { grid-template-columns: minmax(0,1fr); }.inquiry-details article { flex-direction: row; }.world-reach { grid-template-columns: minmax(0,1fr); }.world-reach__illustration { max-width: 300px; }.contact-benefits { grid-template-columns: repeat(2,minmax(0,1fr)); }.inquiry-form-panel { padding: 22px; }.purpose-heading { font-size: 29px; } }

.project-featured-label{position:absolute;top:12px;left:12px;border-radius:5px;padding:4px 8px;background:var(--brand);color:white;font-size:10px}.project-tile__image>a{position:absolute;inset:40% auto auto 45%;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--brand)}.overview-figure__inset>a{position:absolute;inset:35% auto auto 40%;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:white;color:var(--brand)}

.figure-direction{position:absolute;right:20px;bottom:20px;display:grid;place-items:center;width:48px;height:48px;background:white;border-radius:50%;font-size:25px;color:var(--brand)}.scene-direction{position:absolute;right:30%;bottom:20px;font-size:50px;color:var(--brand)}
@media(pointer:coarse) {
  .feature-card:hover,.project-tile:hover,.platform-tile:hover { transform: none; box-shadow: var(--shadow); }
  .project-list { overscroll-behavior-x: contain; }
  .carousel-control { top: auto; bottom: -36px; }
  .carousel-control[data-slide=previous] { left: auto; right: 60px; }
  .carousel-control[data-slide=next] { right: 0; }
  .project-carousel { margin-bottom: 50px; }
  .compact-service > a { background: #fff; border: 1px solid var(--line); border-radius: 50%; bottom: 10px; right: 10px; }
  .compact-service { padding-bottom: 64px; }
}
@media(max-width:600px) {
  :root { --gutter: 20px; }
  .section { padding-block: 44px; }
  .home-hero__content { padding-block: 120px 96px; }
  .home-hero .actions > * { max-width: none; }
  .home-hero__description,.intro-copy { line-height: 1.5; }
  .service-outro .metrics,.platform-outro .metrics { padding: 20px 14px; }
  .service-outro .metrics > div,.platform-outro .metrics > div { padding: 0 6px; }
  .compact-service p,.platform-tile p,.tick-list li { font-size: 14px; line-height: 1.5; }
  .inquiry-types button { font-size: 13px; }
  .inquiry-details p,.inquiry-details a,.inquiry-details .text-action { font-size: 14px; }
  .inquiry-details article > div:last-child { min-width: 0; }
  .contact-benefits strong { font-size: 12px; }
  .contact-benefits small { font-size: 11px; }
  .overview-figure__main { height: 270px; }
  .overview-figure__inset { width: 48%; }
  .platform-figure { padding-inline: 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .platform-figure > img { grid-column: 1/-1; height: 240px; }
  .reach-card,.analytics-card { position: static; width: auto; min-width: 0; padding: 14px; }
  .reach-card span,.analytics-card span,.analytics-card small { font-size: 12px; }
}