@import "tailwindcss";

:root { color-scheme: light; background: #dfe8e5; }

html,
body {
  min-height: 100%;
  margin: 0;
  background: #dfe8e5;
}

* { box-sizing: border-box; }
a { color: inherit; }
.info-page { min-height: 100vh; color: #132a2e; background: radial-gradient(circle at 82% 8%, rgba(169,203,195,.58), transparent 34%), linear-gradient(180deg,#eef4f1 0,#dfe9e5 46%,#f7f3ec 100%); font-family: Manrope, ui-sans-serif, system-ui, sans-serif; }
.info-nav { width: min(1180px, calc(100% - 40px)); min-height: 82px; margin: auto; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(19,42,46,.1); }
.info-brand img { width: 148px; height: 40px; object-fit: contain; display: block; }
.info-nav-links { display:flex; align-items:center; gap:26px; }
.info-nav-links a { color:#40575a; text-decoration:none; font-size:14px; font-weight:750; }
.info-nav-link { padding: 11px 18px; border: 1px solid rgba(19,42,46,.17); border-radius: 999px; background:rgba(255,255,255,.48); color:#132a2e!important; }
.info-hero { width: min(1180px, calc(100% - 40px)); min-height: 590px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(380px, .98fr); align-items: center; gap: 66px; }
.info-eyebrow { color: #4d776e; font-size: 12px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.info-hero h1 { max-width: 690px; margin: 18px 0; font-size: clamp(48px, 5.9vw, 80px); line-height: .98; letter-spacing: -.055em; }
.info-hero p { max-width: 620px; margin: 0; color: #526668; font-size: 18px; line-height: 1.65; }
.info-visual { position:relative; min-height:440px; border:1px solid rgba(255,255,255,.58); border-radius:34px; background:rgba(255,255,255,.35); box-shadow:0 30px 100px rgba(34,73,70,.15); overflow:hidden; }
.info-visual-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.info-visual-image.contain { object-fit:contain; padding:64px; background:rgba(238,244,241,.92); }
.info-visual-card { position:absolute; display:flex; flex-direction:column; padding:22px; border:1px solid rgba(255,255,255,.76); border-radius:22px; background:rgba(250,253,251,.78); box-shadow:0 20px 48px rgba(32,69,66,.14); backdrop-filter:blur(18px); }
.info-visual-card small { color:#597b73; font-size:10px; font-weight:900; letter-spacing:.12em; }
.info-visual-card strong { margin:9px 0 2px; font-size:48px; line-height:1; letter-spacing:-.055em; }
.info-visual-card span { color:#607275; font-size:13px; }
.info-visual-main { left:8%; bottom:9%; min-width:190px; }
.info-visual-float { right:6%; top:9%; min-width:175px; }
.info-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.info-button { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; padding: 0 22px; border: 1px solid #18383a; border-radius: 12px; background: #18383a; color: white; text-decoration: none; font-weight: 850; }
.info-button.secondary { background: rgba(255,255,255,.36); color: #18383a; }
.info-content { width: min(1180px, calc(100% - 40px)); margin: 48px auto 88px; }
.info-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.info-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.info-grid article { min-height: 240px; padding: 26px; border: 1px solid rgba(29,40,43,.11); border-radius: 22px; background: rgba(255,255,255,.62); box-shadow:0 16px 44px rgba(36,73,69,.06); }
.info-grid article > span { color: #597b73; font-size: 11px; font-weight: 900; letter-spacing: .14em; }
.info-grid h2, .info-prose h2 { margin: 40px 0 10px; font-size: 24px; letter-spacing: -.025em; }
.info-grid article h2 { margin-top: 68px; }
.info-grid p, .info-prose p { color: #5e6869; line-height: 1.65; }
.info-prose { max-width: 760px; }
.info-prose h2:first-child { margin-top: 0; }
.info-footer { width: min(1180px, calc(100% - 40px)); min-height: 90px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-top: 1px solid rgba(29,40,43,.13); color: #5e6869; }
.info-footer span:last-child { display: flex; gap: 20px; }
@media (max-width: 820px) {
  .info-nav { min-height: 74px; }
  .info-brand img { width: 132px; }
  .info-nav-links a:not(.info-nav-link) { display:none; }
  .info-hero { grid-template-columns: 1fr; min-height:0; padding:54px 0 20px; gap: 36px; }
  .info-hero h1 { font-size: clamp(44px, 14vw, 68px); }
  .info-visual { min-height:330px; border-radius:34px; }
  .info-visual-card { padding:17px; }
  .info-visual-card strong { font-size:38px; }
  .info-content { margin: 56px auto; }
  .info-grid, .info-grid.two { grid-template-columns: 1fr; }
  .info-grid article { min-height: 0; }
  .info-grid article h2 { margin-top: 38px; }
}