/* 컴피 제품 포털 샘플. 공통 요소는 site.css를 사용하고 홈 화면만 여기서 구성한다. */
.home {
  --portal-ink: #151922;
  --portal-muted: #667085;
  --portal-blue: #1e65e6;
  --portal-blue-dark: #144aa8;
  --portal-lime: #d9ff72;
  --portal-paper: #f7f8fb;
  --portal-radius: 18px;
  background: #fff;
  color: var(--portal-ink);
}
.home .wrap { max-width: 1320px; }
.home h1, .home h2, .home h3 { letter-spacing: -.045em; }
.home .svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* 홈 화면의 모든 글자 간격과 줄 높이를 하나의 기준으로 맞춘다. */
.home, .home * {
  letter-spacing: -.03em !important;
  line-height: 1.4 !important;
}

.skip-link { position: fixed; top: -100px; left: 16px; z-index: 1000; padding: 12px 18px; background: var(--portal-lime); color: var(--portal-ink); font-weight: 600; }
.skip-link:focus { top: 12px; }
.home :focus-visible { outline: 2px solid var(--portal-blue); outline-offset: 3px; }

/* Header */
.home .nav { background: rgba(255,255,255,.96); border-bottom: 1px solid #eef0f4; backdrop-filter: blur(16px); }
.home .nav.is-stuck { background: rgba(255,255,255,.94); border-bottom-color: #dfe3ea; box-shadow: 0 10px 30px rgba(27,39,66,.05); }
.home .nav__inner { height: 72px; }
.home .logo__tile { width: 34px; height: 34px; border-radius: 10px; background: var(--portal-blue); font-size: 15px; }
.home .logo__text { color: var(--portal-ink); font-size: 18px; }
.home .logo__text em { color: var(--portal-blue); }
.home .nav__menu { gap: 42px; }
.home .nav__menu a { color: #3e4654; font-size: 14px; font-weight: 600; }
.home .nav__menu a:hover { color: var(--portal-blue); }
.home .nav__cta { display: inline-flex; align-items: center; gap: 10px; min-height: 42px; padding: 0 16px; border-radius: 9px; background: var(--portal-ink); color: #fff; font-size: 13px; font-weight: 600; }
.home .nav__cta:hover { background: var(--portal-blue); }

/* Shared */
.section-space { padding: 105px 0; }
.section-space--tight { padding-top: 12px; padding-bottom: 110px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; margin-bottom: 42px; }
.section-heading--compact { margin-bottom: 26px; }
.section-kicker { display: block; color: var(--portal-blue); font-size: 11px; font-weight: 600; letter-spacing: .16em; }
.section-heading h2 { margin-top: 14px; color: var(--portal-ink); font-size: clamp(28.8px, 2.56vw, 37.12px); line-height: 1.16; }
.section-heading > p { max-width: 410px; padding-bottom: 6px; color: var(--portal-muted); font-size: 16px; line-height: 1.75; }
.portal-button { display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-height: 50px; padding: 0 20px; border-radius: 10px; font-size: 14px; font-weight: 600; transition: transform .2s ease, background .2s ease; }
.portal-button:hover { transform: translateY(-2px); }
.portal-button--dark { background: var(--portal-ink); color: #fff; }
.portal-button--dark:hover { background: var(--portal-blue); }
.portal-button--light { background: #fff; color: var(--portal-ink); }
.portal-button--light:hover { background: var(--portal-lime); }

/* Config-driven sliders */
.portal-hero { position: relative; overflow: hidden; border-bottom: 1px solid #e4e8ef; }
.portal-slider, .news-slider { position: relative; }
.banner-track { position: relative; }
.portal-slide { position: relative; overflow: hidden; }
.portal-slide[hidden] { display: none; }
.portal-slide.is-active .portal-slide__copy { animation: slide-copy .55s ease both; }
.portal-slide.is-active .portal-slide__art { animation: slide-art .7s ease both; }
.portal-slide__inner { position: relative; display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 55px; min-height: 590px; padding-top: 62px; padding-bottom: 82px; }
.portal-slide__copy { position: relative; z-index: 4; max-width: 570px; }
.portal-slide__eyebrow { display: inline-flex; align-items: center; gap: 8px; color: #365e9d; font-size: 11px; font-weight: 600; letter-spacing: .17em; }
.portal-slide__eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--portal-blue); box-shadow: 0 0 0 5px rgba(30,101,230,.12); }
.portal-slide h1, .portal-slide h2 { margin-top: 24px; color: var(--portal-ink); font-size: clamp(32px, 3.456vw, 48.64px); line-height: 1.12; white-space: pre-line; }
.portal-slide__copy > p { max-width: 520px; margin-top: 25px; color: #526278; font-size: 17px; line-height: 1.75; }
.portal-slide__copy .portal-button { margin-top: 32px; }
.portal-slide__art { position: relative; display: grid; place-items: center; min-height: 440px; }
.portal-slide__art::before { content: ""; position: absolute; width: 410px; height: 410px; border-radius: 36% 64% 62% 38% / 47% 42% 58% 53%; background: rgba(255,255,255,.58); box-shadow: 0 35px 90px rgba(75,112,169,.15); transform: rotate(-8deg); }
.portal-slide__art picture { position: relative; z-index: 2; }
.portal-hero .portal-slide__art picture img { width: 208px; height: 208px; object-fit: contain; filter: drop-shadow(0 28px 30px rgba(47,65,105,.18)); }
.portal-slide__satellites { position: absolute; inset: 0; z-index: 3; }
.portal-slide__satellites img { position: absolute; width: 76px; height: 76px; border-radius: 18px; filter: drop-shadow(0 18px 18px rgba(38,57,92,.2)); }
.portal-slide__satellites img:nth-child(1) { top: 7%; right: 11%; transform: rotate(8deg); }
.portal-slide__satellites img:nth-child(2) { bottom: 6%; right: 16%; transform: rotate(12deg); }
.portal-slide__satellites img:nth-child(3) { top: 20%; left: 7%; transform: rotate(-11deg); }
.portal-slide--sky { background: radial-gradient(circle at 78% 32%, rgba(112,200,255,.34), transparent 37%), linear-gradient(120deg, #eaf2ff 0%, #dff5ff 100%); }
.portal-slide--violet { background: radial-gradient(circle at 78% 25%, rgba(156,121,255,.3), transparent 38%), linear-gradient(120deg, #f0efff 0%, #e7ddff 100%); }
.portal-slide--mint { background: radial-gradient(circle at 80% 30%, rgba(82,218,195,.3), transparent 38%), linear-gradient(120deg, #e8fbf6 0%, #d9f3ef 100%); }
.slider-controls { position: absolute; z-index: 8; left: 50%; bottom: 25px; transform: translateX(-50%); display: flex; align-items: center; gap: 12px; pointer-events: none; }
.slider-controls > * { pointer-events: auto; }
.slider-controls > button { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(39,64,101,.16); border-radius: 50%; background: rgba(255,255,255,.6); }
.slider-controls > button:hover { background: #fff; }
.slider-dots { display: flex; align-items: center; gap: 7px; }
.slider-dot { width: 7px; height: 7px; padding: 0; border-radius: 10px; background: #9ba9bd; transition: width .2s ease, background .2s ease; }
.slider-dot.is-on { width: 25px; background: var(--portal-blue); }
.slider-count { margin-left: 5px; color: #6b788a; font-size: 11px; letter-spacing: .08em; }
.slider-count b { color: var(--portal-ink); }
.banner-empty { padding: 70px 24px; color: var(--portal-muted); text-align: center; }
@keyframes slide-copy { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes slide-art { from { opacity: 0; transform: translateX(18px) scale(.98); } to { opacity: 1; transform: none; } }

/* Value cards */
.value-section { background: #fff; }
.value-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.value-card { position: relative; display: grid; grid-template-columns: 1.02fr .98fr; min-height: 330px; overflow: hidden; border-radius: var(--portal-radius); }
.value-card--utility { background: linear-gradient(135deg, #dff4ff, #bfe6fb); }
.value-card--ai { background: linear-gradient(135deg, #eee7ff, #ddd5ff); }
.value-card__copy { position: relative; z-index: 2; padding: 42px 0 40px 42px; }
.value-card__copy > span { color: #405b7d; font-size: 10px; font-weight: 600; letter-spacing: .13em; }
.value-card__copy h3 { margin-top: 19px; font-size: clamp(22.4px, 1.536vw, 24.96px); line-height: 1.22; }
.value-card__copy p { max-width: 310px; margin-top: 17px; color: #53667d; font-size: 14px; line-height: 1.75; }
.value-card__art { position: relative; display: grid; place-items: center; min-width: 0; }
.value-stack { position: relative; width: 230px; height: 230px; }
.value-stack::before { content: ""; position: absolute; inset: 15px; border-radius: 50%; background: rgba(255,255,255,.5); box-shadow: 0 20px 50px rgba(43,94,132,.12); }
.value-stack img { position: absolute; width: 86px; height: 86px; border-radius: 22px; filter: drop-shadow(0 15px 17px rgba(36,76,108,.18)); }
.value-stack img:nth-child(1) { left: 5px; top: 27px; transform: rotate(-10deg); }
.value-stack img:nth-child(2) { right: 4px; top: 13px; transform: rotate(9deg); }
.value-stack img:nth-child(3) { left: 74px; bottom: 11px; transform: rotate(4deg); }
.ai-orb { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 176px; height: 176px; border: 1px solid rgba(255,255,255,.7); border-radius: 38px; background: linear-gradient(150deg, rgba(255,255,255,.75), rgba(144,112,255,.23)); box-shadow: 0 25px 55px rgba(72,49,154,.15); transform: rotate(7deg); }
.ai-orb b { color: #6b41ed; font-size: 37.12px; line-height: 1; letter-spacing: -.08em; }
.ai-orb small { margin-top: 8px; color: #775fba; font-size: 9px; font-weight: 600; letter-spacing: .17em; }
.ai-orb__icon { position: absolute; right: 12px; bottom: 22px; width: 68px; height: 68px; filter: drop-shadow(0 12px 15px rgba(59,41,118,.2)); transform: rotate(-7deg); }

/* Enterprise */
.enterprise-wrap { background: #fff; }
.enterprise-banner { position: relative; min-height: 440px; overflow: hidden; border-radius: var(--portal-radius); background: #152033; color: #fff; }
.enterprise-banner > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.enterprise-banner__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,19,35,.92) 0%, rgba(10,19,35,.78) 36%, rgba(10,19,35,.18) 76%, rgba(10,19,35,.08) 100%); }
.enterprise-banner__copy { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-height: 440px; max-width: 710px; padding: 55px 64px; }
.enterprise-banner__copy > span { color: #b9cff4; font-size: 10px; font-weight: 600; letter-spacing: .16em; }
.enterprise-banner h2 { margin-top: 18px; font-size: clamp(28.8px, 2.56vw, 35.2px); line-height: 1.23; }
.enterprise-banner p { max-width: 500px; margin-top: 16px; color: #d7deea; font-size: 15px; }
.enterprise-banner .portal-button { margin-top: 28px; }

/* Products */
.products-section { background: var(--portal-paper); }
.product-grid { --product-columns: 4; --product-gap: 16px; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--product-gap); }
/* 한 줄은 가운데 정렬하고, 두 줄 이상은 마지막 줄도 왼쪽부터 채운다. */
.product-grid:has(> :nth-child(5)) { justify-content: flex-start; }
.product-grid > .product-card { flex: 0 0 calc((100% - (var(--product-columns) - 1) * var(--product-gap)) / var(--product-columns)); }
.product-card { display: flex; flex-direction: column; min-width: 0; min-height: 420px; overflow: hidden; border: 1px solid #e1e5ec; border-radius: 14px; background: #fff; box-shadow: 0 8px 25px rgba(31,46,75,.05); transition: transform .2s ease, box-shadow .2s ease; }
.product-card:hover { transform: translateY(-5px); box-shadow: 0 18px 38px rgba(31,46,75,.1); }
.product-card__visual { position: relative; display: flex; align-items: center; justify-content: center; height: 125px; overflow: hidden; }
.product-card__visual::before { content: ""; position: absolute; width: 170px; height: 170px; border-radius: 50%; background: rgba(255,255,255,.43); top: -86px; right: -25px; }
.product-card__visual > span { position: absolute; left: 18px; top: 16px; color: rgba(27,52,87,.56); font-size: 9px; font-weight: 600; letter-spacing: .15em; }
.product-card__visual img { position: relative; z-index: 2; width: 76px; height: 76px; margin-top: 13px; filter: drop-shadow(0 12px 13px rgba(24,51,84,.16)); }
.product-card--manager .product-card__visual { background: linear-gradient(135deg, #e7efff, #bfd6ff); }
.product-card--clip .product-card__visual { background: linear-gradient(135deg, #f0e9ff, #ddcdfc); }
.product-card--capture .product-card__visual { background: linear-gradient(135deg, #dbf7f0, #bfece1); }
.product-card--download .product-card__visual { background: linear-gradient(135deg, #fff0dc, #ffd8a6); }
.product-card__body { flex: 1; padding: 27px 24px 20px; }
.product-card__body h3 { font-size: 23px; }
.product-card__body p { margin-top: 13px; color: var(--portal-muted); font-size: 14px; line-height: 1.7; }
.product-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 70px; padding: 14px 18px 14px 24px; border-top: 1px solid #edf0f4; }
.product-card__foot > span { color: #8a93a2; font-size: 11px; }
.product-card__foot a { display: inline-flex; align-items: center; gap: 7px; color: var(--portal-blue); font-size: 12px; font-weight: 600; }
.product-card__foot a:hover { color: var(--portal-blue-dark); }

/* News */
.news-section { background: #fff; }
.news-slider { min-height: 350px; overflow: hidden; border-radius: var(--portal-radius); }
.news-slider .portal-slide { min-height: 350px; background: linear-gradient(110deg, #dcecff 0%, #d7eaff 48%, #e9e3ff 100%); }
.news-slider .portal-slide__inner { display: block; min-height: 350px; padding-top: 0; padding-bottom: 0; }
.news-slider .portal-slide__copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-height: 350px; max-width: 610px; padding: 44px 0; }
.news-slider .portal-slide h2 { margin-top: 14px; font-size: clamp(24px, 1.92vw, 27.52px); line-height: 1.25; }
.news-slider .portal-slide__copy > p { max-width: 530px; margin-top: 15px; font-size: 14px; }
.news-slider .portal-slide__copy .portal-button { margin-top: 23px; }
.news-slider .portal-slide__art { position: absolute; inset: 0; min-height: 0; z-index: 0; display: block; }
.news-slider .portal-slide__art::before { display: none; }
.news-slider .portal-slide__art picture { position: absolute; top: 0; right: 0; bottom: 0; display: block; width: 70%; height: 100%; overflow: hidden; }
.news-slider .portal-slide__art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: right center; animation: news-media-drift 7s ease-in-out infinite alternate; }
.news-slider .portal-slide__inner::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(220,236,255,.98) 0%, rgba(220,236,255,.9) 39%, rgba(220,236,255,.25) 63%, transparent 100%); pointer-events: none; }
.news-slider .portal-slide__copy { position: relative; z-index: 3; }
.news-slider .portal-slide.is-active .portal-slide__copy { animation: news-copy-in .7s cubic-bezier(.2,.7,.2,1) both; }
.news-slider .portal-slide.is-active .portal-slide__art { animation: news-media-in .9s cubic-bezier(.2,.7,.2,1) both; }
@keyframes news-copy-in { from { opacity: 0; transform: translateX(-18px); } to { opacity: 1; transform: none; } }
@keyframes news-media-in { from { opacity: 0; transform: translateX(28px); } to { opacity: 1; transform: none; } }
@keyframes news-media-drift { from { transform: translateX(0); } to { transform: translateX(12px); } }

/* Tips */
.tips-section { background: #f4f5f7; }
.tips-grid { display: grid; grid-template-columns: 1.03fr 1fr 1fr; grid-template-rows: repeat(2, 250px); gap: 16px; }
.tip-card { position: relative; display: flex; overflow: hidden; border-radius: 16px; padding: 27px; }
.tip-card > div { position: relative; z-index: 2; max-width: 70%; }
.tip-card span { font-size: 10px; font-weight: 600; letter-spacing: .11em; }
.tip-card h3 { margin-top: 13px; font-size: 23px; line-height: 1.28; }
.tip-card p { margin-top: 10px; font-size: 12px; line-height: 1.65; opacity: .7; }
.tip-card > img { position: absolute; right: 18px; bottom: 17px; width: 86px; height: 86px; filter: drop-shadow(0 13px 14px rgba(30,42,68,.18)); transform: rotate(5deg); }
.tip-card > button { position: absolute; z-index: 3; display: grid; place-items: center; top: 20px; right: 20px; width: 30px; height: 30px; border-radius: 50%; background: rgba(20,25,34,.88); color: #fff; }
.tip-card--large { grid-row: 1 / span 2; padding: 37px; }
.tip-card--large > div { max-width: 85%; }
.tip-card--large h3 { margin-top: 20px; font-size: 28.8px; }
.tip-card--large p { max-width: 270px; margin-top: 16px; font-size: 14px; }
.tip-card--large > img { right: 40px; bottom: 40px; width: 145px; height: 145px; }
.tip-card--clip { background: #ff6a82; }
.tip-card--capture { background: #bfeff2; }
.tip-card--download { background: #ffd93e; }
.tip-card--manager { background: #d8cbff; }

/* Support */
.support-section { padding: 74px 0 88px; background: #e9edf3; }
.support-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.support-heading h2 { margin-top: 12px; font-size: clamp(22.4px, 1.92vw, 25.6px); }
.support-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.support-card { display: flex; align-items: center; gap: 15px; min-height: 92px; padding: 19px 22px; border: 1px solid #dce1e9; border-radius: 12px; background: #fff; text-align: left; transition: transform .2s ease, border-color .2s ease; }
.support-card:hover { transform: translateY(-3px); border-color: #b8c6dc; }
.support-card > .ico:first-child { width: 25px; height: 25px; color: var(--portal-blue); }
.support-card > .ico:last-child { margin-left: auto; }
.support-card span { flex: 1; }
.support-card b, .support-card small { display: block; }
.support-card b { font-size: 15px; }
.support-card small { margin-top: 3px; color: #8a93a2; font-size: 11px; }

/* Footer */
.portal-foot { margin-top: 0; padding: 68px 0 30px; background: #151922; }
.portal-foot__grid { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 65px; }
.portal-foot__brand p { margin-top: 20px; color: #8f98a8; font-size: 13px; line-height: 1.8; }
.portal-foot .logo__tile { border-radius: 10px; background: var(--portal-blue); color: #fff; }
.portal-foot .logo__text em { color: #8eb7ff; }
.portal-foot__column { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.portal-foot__column h2 { margin-bottom: 7px; color: #fff; font-size: 13px; }
.portal-foot__column a, .portal-foot__column button, .portal-foot__column span { padding: 0; color: #969fae; font-size: 12px; text-align: left; }
.portal-foot__column a:hover, .portal-foot__column button:hover { color: #fff; }
.portal-foot__bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 52px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); color: #727c8c; font-size: 11px; }

@media (max-width: 1100px) {
  .portal-slide__inner { gap: 20px; }
  .portal-slide h1, .portal-slide h2 { font-size: clamp(28.8px, 3.84vw, 42.88px); }
  .value-card { grid-template-columns: 1.1fr .9fr; }
  .value-card__copy { padding-left: 32px; }
  .product-card__body { padding-left: 19px; padding-right: 19px; }
  .product-card__foot { padding-left: 19px; }
  .portal-foot__grid { gap: 35px; }
}

@media (max-width: 900px) {
  .home .nav__menu, .home .nav__cta { display: none; }
  .home .nav__toggle { display: flex; }
  .home .nav.is-open .nav__menu { display: flex; top: 72px; background: #fff; border-color: #e3e7ed; }
  .home .nav.is-open .nav__menu a { color: var(--portal-ink); border-color: #edf0f4; }
  .section-space { padding: 78px 0; }
  .section-space--tight { padding-top: 0; padding-bottom: 84px; }
  .portal-slide__inner { min-height: 560px; grid-template-columns: 1fr 1fr; }
  .portal-slide__art { min-height: 390px; }
  .value-grid { grid-template-columns: 1fr; }
  .value-card { min-height: 300px; }
  .product-grid { --product-columns: 2; }
  .product-grid:has(> :nth-child(3)) { justify-content: flex-start; }
  .tips-grid { grid-template-columns: 1fr 1fr; grid-template-rows: 310px 230px 230px; }
  .tip-card--large { grid-column: 1 / -1; grid-row: auto; }
  .tip-card--large > img { width: 125px; height: 125px; }
  .support-grid { grid-template-columns: 1fr; }
  .portal-foot__grid { grid-template-columns: 1.4fr 1fr 1fr; }
  .portal-foot__brand { grid-column: 1 / -1; }
}

@media (max-width: 700px) {
  .home .nav__inner { height: 66px; }
  .home .nav.is-open .nav__menu { top: 66px; }
  .section-heading { display: block; margin-bottom: 30px; }
  .section-heading h2 { font-size: 24.32px; }
  .section-heading > p { margin-top: 16px; font-size: 14px; }
  .portal-slide__inner { display: flex; flex-direction: column; justify-content: center; min-height: 650px; gap: 8px; padding-top: 54px; padding-bottom: 82px; text-align: center; }
  .portal-slide__copy { display: flex; flex-direction: column; align-items: center; }
  .portal-slide h1, .portal-slide h2 { margin-top: 17px; font-size: 27.52px; }
  .portal-slide__copy > p { margin-top: 18px; font-size: 15px; }
  .portal-slide__copy .portal-button { margin-top: 22px; }
  .portal-slide__art { order: 2; width: 100%; min-height: 250px; }
  .portal-slide__art::before { width: 245px; height: 245px; border-radius: 30%; }
  .portal-hero .portal-slide__art picture img { width: 136px; height: 136px; }
  .portal-slide__satellites img { width: 52px; height: 52px; border-radius: 13px; }
  .portal-slide__satellites img:nth-child(1) { right: 16%; }
  .portal-slide__satellites img:nth-child(2) { right: 22%; }
  .portal-slide__satellites img:nth-child(3) { left: 16%; }
  .slider-controls { justify-content: center; }
  .value-card { grid-template-columns: 1.1fr .9fr; min-height: 270px; }
  .value-card__copy { padding: 31px 0 31px 27px; }
  .value-card__copy h3 { font-size: 29px; }
  .value-card__copy p { font-size: 12px; }
  .value-stack { transform: scale(.72); }
  .ai-orb { width: 125px; height: 125px; border-radius: 27px; }
  .ai-orb b { font-size: 26.88px; }
  .ai-orb__icon { width: 51px; height: 51px; right: 3px; }
  .enterprise-banner { min-height: 480px; }
  .enterprise-banner > img { object-position: 67% center; }
  .enterprise-banner__shade { background: linear-gradient(90deg, rgba(10,19,35,.94), rgba(10,19,35,.66)); }
  .enterprise-banner__copy { min-height: 480px; padding: 38px 30px; }
  .enterprise-banner h2 { font-size: 24.32px; }
  .news-slider, .news-slider .portal-slide, .news-slider .portal-slide__inner { min-height: 480px; }
  .news-slider .portal-slide__inner { display: block; text-align: left; }
  .news-slider .portal-slide__copy { align-items: flex-start; justify-content: flex-start; min-height: 480px; padding: 40px 24px; text-align: left; }
  .news-slider .portal-slide h2 { font-size: 24.8px; }
  .news-slider .portal-slide__art { min-height: 480px; }
  .news-slider .portal-slide__art picture { top: auto; width: 100%; height: 70%; }
  .news-slider .portal-slide__art img { object-position: 66% center; }
  .news-slider .portal-slide__inner::after { background: linear-gradient(180deg, rgba(220,236,255,.98) 0%, rgba(220,236,255,.88) 48%, rgba(220,236,255,.15) 76%, transparent 100%); }
  .tips-grid { grid-template-columns: 1fr; grid-template-rows: auto; }
  .tip-card, .tip-card--large { grid-column: auto; min-height: 240px; padding: 27px; }
  .tip-card--large h3 { font-size: 30px; }
  .tip-card--large > img { right: 18px; bottom: 17px; width: 98px; height: 98px; }
  .support-heading { display: block; }
  .portal-foot__grid { grid-template-columns: repeat(3, 1fr); gap: 30px 16px; }
  .portal-foot__bottom { flex-direction: column; }
}

@media (max-width: 430px) {
  .home .wrap { --gutter: 16px; }
  .section-space { padding: 62px 0; }
  .section-heading h2 { font-size: 26.4px; }
  .portal-slide__inner { min-height: 620px; }
  .portal-slide h1, .portal-slide h2 { font-size: 29.6px; }
  .portal-slide__copy > p { font-size: 14px; }
  .value-card { min-height: 255px; }
  .value-card__copy { padding: 26px 0 26px 22px; }
  .value-card__copy h3 { font-size: 25px; }
  .value-card__copy p { max-width: 190px; }
  .value-card__art { transform: translateX(8px); }
  .product-grid { --product-gap: 10px; }
  .product-card { min-height: 395px; border-radius: 11px; }
  .product-card__visual { height: 110px; }
  .product-card__visual > span { left: 12px; top: 12px; font-size: 7px; }
  .product-card__visual img { width: 62px; height: 62px; }
  .product-card__body { padding: 19px 14px 15px; }
  .product-card__body h3 { font-size: 19px; }
  .product-card__body p { font-size: 12px; line-height: 1.62; }
  .product-card__foot { align-items: flex-start; flex-direction: column; min-height: 78px; padding: 12px 14px; }
  .product-card__foot > span { font-size: 9px; }
  .product-card__foot a { align-self: flex-end; font-size: 11px; }
  .enterprise-banner h2 { font-size: 25.6px; }
  .portal-foot__grid { grid-template-columns: 1fr 1fr; }
  .portal-foot__brand { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-slide.is-active .portal-slide__copy, .portal-slide.is-active .portal-slide__art { animation: none; }
  .news-slider .portal-slide.is-active .portal-slide__copy, .news-slider .portal-slide.is-active .portal-slide__art { animation: none; }
  .news-slider .portal-slide__art img { animation: none; }
  .portal-button, .product-card, .support-card { transition: none; }
}