:root{--cream:#f8f5ed;--blue:#1595de;--deep:#0879bd;--ink:#172b35;--muted:#61717a;--line:#e1e0d9}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);font-family:Arial,Helvetica,sans-serif;color:var(--ink)}a{color:inherit;text-decoration:none}.wrap{width:min(1160px,calc(100% - 48px));margin:auto}.site-header{background:var(--cream);position:relative;z-index:10;border-bottom:1px solid var(--line)}.header-inner{height:86px;display:flex;align-items:center;justify-content:space-between}.brand{font-weight:900;letter-spacing:.09em;font-size:19px;line-height:1}.brand span{font-weight:400}.brand small{display:block;font-size:9px;letter-spacing:.27em;color:var(--deep);margin-top:7px}nav{display:flex;align-items:center;gap:29px;font-size:13px;font-weight:600}nav a:hover{color:var(--deep)}nav .parent-link{border:1px solid #c9d5d8;border-radius:30px;padding:12px 17px}.menu-toggle{display:none}.hero{background:var(--blue);color:white;position:relative;overflow:hidden;min-height:580px;padding:80px 0 155px}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:50px;position:relative;z-index:2}.eyebrow,.section-label{font-size:11px;font-weight:800;letter-spacing:.21em}.hero .eyebrow{color:#c9edff}.hero h1{font-size:clamp(44px,5.6vw,76px);line-height:1.07;letter-spacing:-.055em;margin:23px 0}.hero h1 em{font-style:normal;color:#c5edff}.hero p{font-size:17px;line-height:1.8;max-width:480px;color:#ecf8ff}.hero-actions{display:flex;gap:27px;align-items:center;margin-top:35px}.btn{border:0;border-radius:3px;padding:17px 24px;display:inline-flex;justify-content:space-between;gap:35px;font-weight:800;font-size:13px;cursor:pointer}.btn-light{background:white;color:var(--deep)}.btn-blue{background:var(--deep);color:white}.text-link{font-size:13px;font-weight:700}.photo-bubble{width:min(390px,100%);aspect-ratio:1;position:relative;margin:10px auto 0;border-radius:50%;border:12px solid #ffffff45}.photo-main{width:100%;height:100%;object-fit:cover;border-radius:50%;filter:saturate(.9)}.photo-small{position:absolute;width:37%;aspect-ratio:1;object-fit:cover;border:7px solid white;border-radius:50%;box-shadow:0 12px 30px #005b8c55}.photo-small.top{top:-7%;right:-11%}.photo-small.bottom{bottom:-8%;left:-12%}.bubble-ring{position:absolute;inset:-28px;border:1px solid #ffffff50;border-radius:50%;pointer-events:none}.wave{position:absolute;left:-8%;width:116%;height:130px;border-radius:50% 50% 0 0}.wave-back{bottom:-56px;background:#0879bd;transform:rotate(-2deg)}.wave-front{bottom:-88px;background:#ffcf0d;transform:rotate(2deg)}.section{padding:105px 0}.section-label{color:var(--deep);margin-bottom:28px}h2{font-size:clamp(34px,4vw,53px);line-height:1.14;letter-spacing:-.045em;margin:0 0 26px}h2 span{color:var(--deep)}p{line-height:1.85}.intro{display:grid;grid-template-columns:1fr 2fr;gap:45px}.intro p{max-width:710px;color:var(--muted);font-size:16px}.about{background:#ffcf0d}.products{background:#fff9df}.services{background:#fffdf4}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:50px;margin-bottom:35px}.section-heading>p{max-width:370px;color:var(--muted)}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.product-card{background:var(--cream);overflow:hidden}.product-card img{display:block;width:100%;height:230px;object-fit:cover}.product-card>div{padding:25px}.product-card span{font-size:11px;color:var(--deep);font-weight:800}.product-card h3{font-size:21px;margin:13px 0 8px}.product-card p{color:var(--muted);font-size:14px;margin:0}.footnote{text-align:center;margin:34px 0 0;color:var(--muted);font-size:14px}.footnote a{color:var(--deep);font-weight:bold}.services .section-heading{margin-bottom:60px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.service-grid>div{border-top:2px solid var(--blue);padding-top:25px}.service-grid b{color:var(--deep);font-size:12px}.service-grid h3{font-size:22px;margin:20px 0 10px}.service-grid p{font-size:14px;color:var(--muted)}.process{background:#e8f4fa;padding:90px 0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:45px}.steps>div{border-top:1px solid #b8d7e6;padding-top:22px}.steps strong{font-size:35px;color:var(--deep)}.steps h3{margin:18px 0 7px}.steps p{font-size:14px;color:var(--muted)}.contact{display:grid;grid-template-columns:1fr 1fr;gap:80px}.contact>div>p{color:var(--muted);max-width:430px}.contact-note{margin-top:40px;font-size:13px}form{background:#fff;padding:35px;box-shadow:0 12px 45px #102b3b0c}label{display:block;font-size:12px;font-weight:700;margin-bottom:19px}input,textarea{display:block;width:100%;border:1px solid #d9e0e2;border-radius:2px;background:#fff;padding:13px;margin-top:8px;font:inherit;font-size:14px}input:focus,textarea:focus{outline:2px solid #1595de55}form small{display:block;color:var(--muted);font-size:11px;margin-top:15px}footer{background:#152c38;color:white;padding:35px 0}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:20px}.footer-inner strong{letter-spacing:.08em;font-size:13px}.footer-inner p,.footer-inner span,.footer-inner a{font-size:12px;color:#c4d4db}.footer-inner>div:last-child{display:flex;gap:30px}@media(max-width:800px){.menu-toggle{display:block;background:none;border:0;font-size:25px}nav{display:none;position:absolute;top:85px;left:0;right:0;background:var(--cream);padding:25px;flex-direction:column;align-items:start}nav.open{display:flex}.hero{padding:65px 0 125px}.hero-grid{grid-template-columns:1fr;gap:65px}.photo-bubble{width:min(310px,75%)}.intro,.contact{grid-template-columns:1fr;gap:20px}.section-heading{display:block}.product-grid,.service-grid,.steps{grid-template-columns:1fr}.section{padding:70px 0}.product-card img{height:240px}.footer-inner,.footer-inner>div:last-child{flex-direction:column;align-items:start}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.contact-form { min-width: 0; margin: 0; }
.contact-form textarea { resize: vertical; }
.button { border: 0; border-radius: 3px; padding: 17px 24px; font: inherit; font-weight: 800; font-size: 13px; cursor: pointer; }
.button-primary { background: var(--deep); color: white; }
.button:disabled { opacity: .65; cursor: wait; }
@media (max-width: 400px) { .contact-form { padding: 24px; } }

.brand-marquee {
  overflow: hidden;
  margin: 0 calc((1160px - 100vw) / 2) 50px;
  mask-image: linear-gradient(to right, transparent, black 8%, black 92%, transparent);
}
.brand-marquee-track {
  display: flex;
  width: max-content;
  animation: brand-marquee-scroll 180s linear infinite;
}
.brand-marquee-group {
  display: flex;
  align-items: center;
  gap: 24px;
  flex: 0 0 auto;
  padding-right: 24px;
}
.brand-marquee-group img {
  display: block;
  flex: 0 0 180px;
  width: 180px;
  height: 120px;
  object-fit: contain;
}
@keyframes brand-marquee-scroll {
  to { transform: translateX(-50%); }
}
@media (max-width: 1208px) {
  .brand-marquee { margin-inline: -24px; }
}
@media (max-width: 800px) {
  .brand-marquee-group { gap: 16px; padding-right: 16px; }
  .brand-marquee-group img { flex-basis: 150px; width: 150px; height: 100px; }
}
.catalog-jump {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 35px;
}
.catalog-jump span {
  margin-right: 10px;
  color: var(--muted);
  font-size: 12px;
}
.catalog-jump a {
  border: 1px solid #d6d9d7;
  border-radius: 30px;
  padding: 9px 15px;
  font-size: 12px;
  font-weight: 700;
}
.catalog-jump a:hover {
  background: var(--deep);
  color: white;
}
.catalog-timeline {
  position: relative;
  padding-bottom: 45px;
}
.catalog-timeline::before {
  position: absolute;
  top: 85px;
  bottom: 130px;
  left: 50%;
  width: 1px;
  background: #b6cfdc;
  content: "";
}
.brand-section {
  position: relative;
  padding: 35px 0 40px;
  scroll-margin-top: 20px;
}
.brand-heading {
  position: relative;
  z-index: 2;
  display: flex;
  min-height: 120px;
  align-items: center;
  justify-content: center;
  gap: 22px;
  margin: 0 auto 42px;
  text-align: left;
}
.brand-disc {
  display: grid;
  width: 104px;
  height: 104px;
  flex: 0 0 104px;
  place-content: center;
  border: 8px solid var(--cream);
  border-radius: 50%;
  background: #f7d94c;
  box-shadow: 0 0 0 1px #b9cbd3;
  color: #c42c2d;
  font-size: 21px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
  transform: rotate(-7deg);
}
.brand-disc.urc {
  background: #e32b38;
  color: white;
  transform: none;
}
.brand-disc.oishi {
  background: #e73436;
  color: white;
  font-style: italic;
  transform: rotate(-5deg);
}
.brand-disc.silver {
  background: #164b83;
  color: white;
  font-size: 19px;
  transform: none;
}
.brand-disc.fruit {
  background: #f4b548;
  color: #653e1d;
  font-size: 17px;
  transform: none;
}
.brand-disc.ube-disc {
  background: #7138a4;
  color: white;
  transform: rotate(6deg);
}
.brand-disc.has-logo {
  position: relative;
  width: 156px;
  height: 156px;
  flex-basis: 156px;
  padding: 0;
  background: white;
  transform: none;
}
.brand-disc.has-logo img {
  position: absolute;
  inset: 20px;
  display: block;
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  max-width: none;
  object-fit: contain;
}
.eyeline {
  color: var(--deep);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .2em;
}
.brand-heading h2 {
  margin: 8px 0 0;
  font-size: clamp(26px, 3vw, 40px);
}
.brand-description {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 13px;
}
.catalog-row {
  position: relative;
  display: grid;
  min-height: 340px;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 85px;
  margin: 25px 0 70px;
}
.catalog-row::after {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: 13px;
  height: 13px;
  border: 5px solid var(--cream);
  border-radius: 50%;
  background: var(--deep);
  box-sizing: content-box;
  content: "";
  transform: translate(-50%, -50%);
}
.catalog-row.reverse .visual {
  order: 2;
}
.catalog-row.reverse .detail {
  order: 1;
  text-align: right;
}
.visual {
  position: relative;
  display: grid;
  min-height: 330px;
  place-items: center;
  overflow: hidden;
  border: 1px solid #e7e4dc;
  border-radius: 12px;
  background: white;
}
.visual img {
  width: 100%;
  height: 350px;
  object-fit: cover;
}
.visual img.product-image {
  padding: 14px;
  object-fit: contain;
}
.product-carousel {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.product-carousel img {
  display: none;
  width: 100%;
  height: 100%;
  padding: 14px;
  object-fit: contain;
}
.product-carousel img.is-active {
  display: block;
  animation: product-slide-in .45s ease-out;
}
.product-carousel img[hidden] {
  display: none;
}
@keyframes product-slide-in {
  from { opacity: .4; }
  to { opacity: 1; }
}
.placeholder-label {
  position: absolute;
  bottom: 12px;
  left: 12px;
  padding: 7px 10px;
  background: #fffdf0e8;
  color: #52616b;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
}
.detail {
  padding: 20px 0;
}
.detail h3 {
  margin: 17px 0;
  font-size: clamp(25px, 2.8vw, 38px);
  letter-spacing: -.04em;
  line-height: 1.15;
}
.detail p {
  max-width: 440px;
  color: var(--muted);
  font-size: 15px;
}
.catalog-row.reverse .detail p {
  margin-left: auto;
}
.detail a {
  display: inline-block;
  margin-top: 15px;
  padding-bottom: 7px;
  border-bottom: 1px solid var(--deep);
  color: var(--deep);
  font-size: 13px;
  font-weight: 800;
}
.ube-feature {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 85px;
}
.ube-photo {
  position: relative;
  min-height: 440px;
  overflow: hidden;
  border-radius: 50% 50% 12px 12px;
  background: #e8d7f2;
}
.ube-photo img {
  width: 100%;
  height: 480px;
  object-fit: cover;
}
.ube-copy h3 {
  font-size: clamp(34px, 4vw, 58px);
  letter-spacing: -.05em;
  line-height: 1.1;
}
.ube-copy h3 em {
  color: #7d42aa;
  font-style: normal;
}
.ube-copy p {
  color: var(--muted);
  font-size: 15px;
}
.catalog-cta {
  display: inline-block;
  margin-top: 18px;
  padding: 17px 24px;
  background: var(--deep);
  color: white;
  font-size: 13px;
  font-weight: 800;
}
.catalog-end {
  padding: 85px 0;
  background: #e5f2f9;
  text-align: center;
}
.catalog-end h2 {
  max-width: 700px;
  margin: 15px auto;
}
.catalog-end p {
  max-width: 580px;
  margin: auto;
  color: var(--muted);
}
.catalog-end small {
  display: block;
  max-width: 700px;
  margin: 35px auto 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.7;
}
@media (max-width: 800px) {
  .catalog-timeline::before {
    top: 80px;
    bottom: 130px;
    left: 27px;
  }
  .brand-heading {
    justify-content: flex-start;
    gap: 15px;
    margin-bottom: 22px;
  }
  .brand-disc {
    width: 80px;
    height: 80px;
    flex-basis: 80px;
    font-size: 16px;
  }
  .brand-disc.has-logo {
    width: 120px;
    height: 120px;
    flex-basis: 120px;
  }
  .brand-heading:has(.brand-disc.has-logo) {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .brand-heading h2 {
    font-size: 25px;
  }
  .catalog-row,
  .ube-feature {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .catalog-row {
    margin: 15px 0 55px;
    padding-left: 50px;
  }
  .catalog-row::after {
    top: 160px;
    left: 27px;
  }
  .catalog-row.reverse .visual,
  .catalog-row.reverse .detail {
    order: 0;
  }
  .catalog-row.reverse .detail {
    text-align: left;
  }
  .catalog-row.reverse .detail p {
    margin-left: 0;
  }
  .visual {
    min-height: 230px;
  }
  .visual img {
    height: 250px;
  }
  .detail {
    padding: 10px 0;
  }
  .ube-photo {
    min-height: 280px;
  }
  .ube-photo img {
    height: 300px;
  }
  .ube-copy h3 {
    font-size: 35px;
  }
  .catalog-end {
    padding: 65px 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .catalog-timeline {
    scroll-behavior: auto;
  }
  .product-carousel img.is-active {
    animation: none;
  }
}
