@charset "UTF-8";

:root {
  color-scheme: light;
  --ink: #354247;
  --muted: #68777a;
  --paper: #fcf8f0;
  --cream: #f4eee3;
  --white: #fffdf8;
  --line: rgba(53, 66, 71, .15);
  --berry: #ad5973;
  --coral: #d78064;
  --butter: #edcf7a;
  --mint: #dce9df;
  --sage: #9db59f;
  --lilac: #e8e1ed;
  --blue: #dce9ee;
  --sans: "Pretendard", "SUIT", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
  --display: "Noto Serif KR", "Noto Serif CJK KR", "Nanum Myeongjo", "AppleMyungjo", "Batang", serif;
  --mono: "SFMono-Regular", "Cascadia Code", "Consolas", monospace;
  --round: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
body, button, a { -webkit-tap-highlight-color: transparent; }
button, a { color: inherit; font: inherit; }
a { text-decoration: none; }
button { border: 0; }
img { display: block; max-width: 100%; }
::selection { color: var(--white); background: var(--berry); }
.container { width: min(100% - 48px, 1280px); margin-inline: auto; }
.skip-link { position: fixed; z-index: 1000; top: 12px; left: 12px; padding: 12px 18px; border-radius: 999px; color: var(--white); background: var(--ink); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.scroll-progress { position: fixed; z-index: 100; inset: 0 0 auto; height: 3px; pointer-events: none; }
.scroll-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg,var(--coral),var(--berry),var(--butter)); transform-origin: left; }

.site-header { position: sticky; z-index: 50; top: 0; border-bottom: 1px solid rgba(53,66,71,.08); background: rgba(252,248,240,.92); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.topbar { display: flex; min-height: 76px; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 11px; flex: 0 0 auto; }
.brand-mark { display: grid; width: 35px; height: 35px; grid-template-columns: repeat(2,1fr); gap: 3px; padding: 5px; border-radius: 12px 12px 12px 4px; background: var(--white); box-shadow: 0 4px 12px rgba(53,66,71,.1); transform: rotate(-4deg); }
.brand-mark i { display: block; border-radius: 50%; background: var(--coral); }
.brand-mark i:nth-child(2) { background: var(--butter); }
.brand-mark i:nth-child(3) { background: var(--sage); }
.brand-mark i:nth-child(4) { background: var(--lilac); }
.brand-word { display: grid; gap: 3px; }
.brand-word strong { font-size: 13px; font-weight: 850; letter-spacing: .045em; }
.brand-word small { color: var(--muted); font-size: 10px; letter-spacing: .02em; }
.primary-nav { display: flex; align-items: center; gap: clamp(16px,2.5vw,34px); color: #526166; font-size: 12px; font-weight: 700; }
.primary-nav a { transition: color .18s ease, transform .18s ease, background .18s ease; }
.primary-nav a:hover { color: var(--berry); transform: translateY(-1px); }
.nav-pill { display: inline-flex; align-items: center; gap: 10px; padding: 10px 15px; border: 1px solid rgba(53,66,71,.12); border-radius: 999px; color: var(--ink); background: var(--white); }
.nav-pill span { color: var(--berry); font-size: 15px; }
.nav-pill:hover { border-color: rgba(173,89,115,.3); background: #f7e9e3; }
.menu-toggle { display: none; }

.hero { position: relative; overflow: hidden; padding: clamp(60px,8vw,112px) 0 25px; background: radial-gradient(ellipse at 84% 10%,rgba(220,233,238,.7),transparent 32%), radial-gradient(ellipse at 14% 80%,rgba(244,224,215,.58),transparent 38%), linear-gradient(125deg,#fbf6ed 0%,#fffaf1 53%,#edf2e8 100%); }
.hero:before { position: absolute; top: -210px; left: 43%; width: 460px; height: 460px; border: 1px solid rgba(173,89,115,.11); border-radius: 50%; content: ""; pointer-events: none; }
.hero:after { position: absolute; right: -210px; bottom: -460px; width: 690px; height: 690px; border: 1px solid rgba(157,181,159,.24); border-radius: 50%; content: ""; pointer-events: none; }
.hero-orb { position: absolute; border-radius: 50%; pointer-events: none; }
.hero-orb--peach { top: 26%; left: 41%; width: 18px; height: 18px; background: var(--coral); box-shadow: 0 0 0 7px rgba(215,128,100,.1); }
.hero-orb--mint { right: 7%; bottom: 19%; width: 27px; height: 27px; background: var(--butter); box-shadow: 0 0 0 9px rgba(237,207,122,.13); }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0,.88fr) minmax(470px,1.12fr); gap: clamp(36px,6vw,88px); align-items: center; }
.hero-copy { max-width: 580px; padding: 10px 0 26px; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 21px; color: var(--berry); font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .1em; }
.eyebrow-spark { color: var(--coral); font-family: var(--sans); font-size: 16px; }
.eyebrow-year { margin-left: 3px; padding: 5px 8px; border-radius: 999px; color: #6d6961; background: rgba(237,207,122,.35); font-size: 10px; letter-spacing: .04em; }
.hero h1 { margin: 0; font-size: clamp(47px,6vw,78px); font-weight: 850; line-height: 1.16; letter-spacing: -.075em; word-break: keep-all; }
.hero h1 span { color: var(--berry); font-family: var(--display); font-size: .88em; font-weight: 700; letter-spacing: -.075em; }
.hero-description { margin: 24px 0 0; color: var(--muted); font-size: clamp(14px,1.2vw,16px); line-height: 1.9; letter-spacing: -.025em; word-break: keep-all; }
.mobile-only { display: none; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 13px 22px; margin-top: 29px; }
.button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 13px; padding: 0 20px; border: 1px solid transparent; border-radius: 999px; font-size: 12px; font-weight: 800; transition: transform .2s ease, background .2s ease, box-shadow .2s ease; }
.button:hover { transform: translateY(-2px); }
.button:focus-visible, .nav-pill:focus-visible, .text-link:focus-visible, .primary-nav a:focus-visible, .menu-toggle:focus-visible, .back-top:focus-visible { outline: 3px solid var(--berry); outline-offset: 4px; }
.button--berry { color: var(--white); background: var(--berry); box-shadow: 0 8px 18px rgba(173,89,115,.18); }
.button--berry:hover { background: #8f4961; box-shadow: 0 11px 22px rgba(173,89,115,.22); }
.button--berry span { font-size: 17px; }
.text-link { display: inline-flex; align-items: center; gap: 9px; color: var(--ink); font-size: 12px; font-weight: 750; }
.text-link span { color: var(--coral); font-size: 17px; transition: transform .18s ease; }
.text-link:hover span { transform: translateX(4px); }
.hero-footnote { display: flex; align-items: center; gap: 8px; margin-top: 33px; color: #849092; font-size: 10px; }
.tiny-flower { color: var(--coral); font-size: 16px; }
.hero-visual { position: relative; min-width: 0; padding: 0 7px 18px 0; }
.hero-photo { position: relative; margin: 0; overflow: hidden; border: 7px solid rgba(255,253,248,.92); border-radius: 24px 52px 24px 38px; background: var(--cream); box-shadow: 0 24px 62px rgba(65,72,67,.13); transform: rotate(1deg); }
.hero-photo img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.hero-photo figcaption { position: absolute; right: 15px; bottom: 14px; display: flex; align-items: center; gap: 8px; padding: 9px 13px; border: 1px solid rgba(255,255,255,.78); border-radius: 999px; color: #495759; background: rgba(255,253,248,.94); font-size: 10px; font-weight: 750; box-shadow: 0 4px 14px rgba(53,66,71,.1); }
.photo-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--coral); }
.hero-sticker { position: absolute; z-index: 2; display: grid; place-items: center; text-align: center; box-shadow: 0 10px 24px rgba(53,66,71,.12); }
.hero-sticker--number { top: 5%; left: -26px; width: 88px; height: 88px; border: 5px solid var(--paper); border-radius: 50%; color: var(--ink); background: var(--butter); transform: rotate(-9deg); }
.hero-sticker--number strong { font-family: var(--display); font-size: 33px; line-height: .9; }
.hero-sticker--number span { margin-top: -8px; font-size: 10px; font-weight: 800; line-height: 1.25; }
.hero-sticker--note { right: -12px; bottom: -6px; display: block; padding: 11px 15px; border: 4px solid var(--paper); border-radius: 16px 16px 16px 5px; color: #50605d; background: var(--mint); font-size: 10px; font-weight: 700; line-height: 1.45; transform: rotate(3deg); }
.hero-sticker--note .tiny-flower { margin-right: 3px; font-size: 13px; }
.hero-bottom { display: flex; justify-content: space-between; margin-top: 36px; padding: 14px 0 0; border-top: 1px solid rgba(53,66,71,.12); color: rgba(53,66,71,.48); font-family: var(--mono); font-size: 10px; letter-spacing: .12em; }

.quick-facts { position: relative; z-index: 2; padding: 20px 0 26px; background: var(--paper); }
.facts-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 11px; }
.fact { display: flex; min-height: 90px; align-items: center; gap: 14px; padding: 16px 19px; border-radius: 16px; }
.fact strong { font-family: var(--display); font-size: 32px; font-weight: 700; letter-spacing: -.06em; }
.fact span { color: #536166; font-size: 11px; font-weight: 700; line-height: 1.45; }
.fact .fact-emoji { flex: 0 0 auto; font-size: 20px; line-height: 1; }
.fact span:last-child { max-width: 112px; }
.fact--peach { background: #f4e4dc; }
.fact--mint { background: #e4ede2; }
.fact--butter { background: #f4edda; }
.fact--lilac { background: #ece7f0; }

.section-space { padding: clamp(70px,8vw,116px) 0; }
.industries { background: #f1ecdf; }
.section-heading { display: grid; grid-template-columns: 68px minmax(0,1fr) minmax(210px,.45fr); gap: 23px; align-items: end; margin-bottom: 43px; }
.heading-index { display: flex; align-items: flex-start; justify-content: space-between; width: 58px; height: 58px; padding: 11px; border-radius: 18px 18px 18px 5px; color: var(--berry); background: var(--white); box-shadow: 0 6px 18px rgba(53,66,71,.07); transform: rotate(-4deg); }
.heading-index span { font-family: var(--mono); font-size: 10px; font-weight: 700; }
.heading-index i { font-size: 18px; font-style: normal; }
.heading-main .eyebrow { margin-bottom: 11px; }
.heading-main h2, .background-copy h2, .privacy-copy h2 { margin: 0; font-size: clamp(34px,4.6vw,60px); font-weight: 850; line-height: 1.25; letter-spacing: -.075em; word-break: keep-all; }
.heading-main h2 em, .background-copy h2 em { color: var(--berry); font-family: var(--display); font-size: .83em; font-style: normal; font-weight: 650; letter-spacing: -.06em; }
.section-aside { margin: 0 0 5px; color: var(--muted); font-size: 12px; line-height: 1.8; word-break: keep-all; }
.section-aside strong { color: var(--berry); font-size: 13px; }
.industry-tools { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: -12px 0 21px; }
.industry-search { position: relative; display: flex; width: min(100%,360px); align-items: center; }
.industry-search-icon { position: absolute; left: 15px; font-size: 20px; line-height: 1; pointer-events: none; }
.industry-search input { width: 100%; min-height: 48px; padding: 0 17px 0 46px; border: 1px solid rgba(53,66,71,.16); border-radius: 999px; outline: none; color: var(--ink); background: var(--white); box-shadow: 0 5px 15px rgba(53,66,71,.045); font: 600 14px/1.4 var(--sans); transition: border-color .18s ease, box-shadow .18s ease; }
.industry-search input::placeholder { color: #87918e; font-weight: 500; }
.industry-search input:focus { border-color: var(--berry); box-shadow: 0 0 0 4px rgba(173,89,115,.12); }
.industry-result { margin: 0; color: #68777a; font-size: 12px; font-weight: 650; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; clip-path: inset(50%); }
.industry-list { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 0; padding: 0; border-top: 1px solid rgba(53,66,71,.18); list-style: none; }
.industry-list li { display: grid; min-height: 62px; grid-template-columns: 27px minmax(0,1fr) auto; gap: 8px; align-items: center; padding: 10px 12px 10px 0; border-bottom: 1px solid rgba(53,66,71,.12); transition: background .2s ease; }
.industry-list li:nth-child(4n+2), .industry-list li:nth-child(4n+3), .industry-list li:nth-child(4n+4) { padding-left: 12px; border-left: 1px solid rgba(53,66,71,.1); }
.industry-list li:hover { background: rgba(255,253,248,.62); }
.industry-number { color: #536166; font-family: var(--mono); font-size: 12px; }
.industry-name { font-size: 14px; font-weight: 720; letter-spacing: -.035em; line-height: 1.45; word-break: keep-all; }
.industry-count { padding: 4px 7px; border-radius: 999px; color: #5c6d66; background: rgba(220,233,223,.78); font-size: 12px; font-weight: 750; white-space: nowrap; }
.industry-list li:nth-child(4n+2) .industry-count { background: rgba(244,228,220,.9); }
.industry-list li:nth-child(4n+3) .industry-count { background: rgba(232,225,237,.9); }
.industry-list li:nth-child(4n+4) .industry-count { background: rgba(244,237,218,.95); }
.industry-list.is-filtered li { padding-left: 0; border-left: 0; }
.industry-list.is-filtered li .industry-count { background: rgba(220,233,223,.78); }
.js .industry-list.is-filtered.is-visible li:nth-child(n) { animation-delay: 0s; }
.industry-footer { display: flex; align-items: center; gap: 9px; margin-top: 18px; color: var(--muted); font-size: 10px; }
.industry-footer strong { margin-left: auto; color: #9c8d83; font-family: var(--mono); font-size: 10px; letter-spacing: .12em; }

.formats { overflow: hidden; background: #e9e4ef; }
.section-heading--formats { margin-bottom: 36px; }
.format-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; align-items: start; }
.format-card { overflow: hidden; padding: 10px 10px 15px; border: 1px solid rgba(53,66,71,.08); border-radius: 20px; background: rgba(255,253,248,.9); box-shadow: 0 11px 28px rgba(53,66,71,.07); transition: transform .22s ease, box-shadow .22s ease; }
.format-card:nth-child(even) { margin-top: 21px; }
.format-card:hover { transform: translateY(-5px) rotate(-.4deg); box-shadow: 0 18px 34px rgba(53,66,71,.12); }
.format-photo { position: relative; display: grid; overflow: hidden; place-items: center; border-radius: 14px; background: var(--mint); }
.format-photo img { width: 100%; height: 100%; object-fit: cover; }
.format-photo span { position: absolute; top: 9px; left: 9px; display: grid; width: 26px; height: 26px; place-items: center; border: 1px solid rgba(255,255,255,.8); border-radius: 50%; color: var(--ink); background: rgba(255,253,248,.9); font-family: var(--mono); font-size: 10px; }
.format-photo--square { aspect-ratio: 1; background: #dfeade; }
.format-photo--four-three { aspect-ratio: 4/3; background: #f3dfd8; }
.format-photo--sixteen-nine { aspect-ratio: 16/9; background: #dce9ee; }
.format-photo--twentyone-nine { aspect-ratio: 21/9; background: #f2e8ce; }
.format-label { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 14px 5px 0; }
.format-label strong { color: var(--berry); font-family: var(--display); font-size: 27px; letter-spacing: -.04em; }
.format-label span { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 10px; font-weight: 700; }
.format-label i, .background-tags i { font-size: 15px; font-style: normal; line-height: 1; }
.section-note { display: flex; align-items: flex-start; gap: 9px; margin: 22px 0 0; color: #697578; font-size: 10px; line-height: 1.7; }
.note-star { color: var(--coral); font-size: 15px; line-height: 1; }

.backgrounds { overflow: hidden; background: linear-gradient(115deg,#e5eee5 0%,#edf0e6 56%,#f4e7da 100%); }
.background-grid { display: grid; grid-template-columns: minmax(280px,.8fr) minmax(0,1.2fr); gap: clamp(38px,7vw,95px); align-items: center; }
.background-copy { position: relative; z-index: 2; }
.background-copy .eyebrow { margin-bottom: 19px; }
.background-number { display: flex; align-items: baseline; gap: 6px; margin: 0 0 3px; color: var(--coral); font-family: var(--display); font-size: clamp(60px,8vw,98px); font-weight: 700; letter-spacing: -.08em; line-height: .95; }
.background-number span { color: #817d70; font-family: var(--sans); font-size: 16px; font-weight: 700; letter-spacing: 0; }
.background-copy h2 { font-size: clamp(32px,4vw,52px); }
.section-description { max-width: 420px; margin: 18px 0 0; color: #5f6e70; font-size: 12px; line-height: 1.9; word-break: keep-all; }
.background-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 21px; }
.background-tags span { padding: 7px 11px; border: 1px solid rgba(53,66,71,.09); border-radius: 999px; color: #53665f; background: rgba(255,253,248,.54); font-size: 10px; font-weight: 750; }
.background-tags i { margin-right: 4px; }
.background-gallery { position: relative; min-height: 440px; }
.background-gallery figure { position: absolute; overflow: hidden; margin: 0; border: 7px solid rgba(255,253,248,.94); background: var(--white); box-shadow: 0 20px 45px rgba(53,66,71,.14); }
.background-gallery figure img { width: 100%; height: 100%; object-fit: cover; }
.background-main-photo { top: 3%; right: 3%; width: 79%; height: 82%; border-radius: 26px 52px 25px 35px; transform: rotate(2deg); }
.background-small-photo { right: 0; bottom: 0; width: 42%; height: 43%; border-radius: 20px 20px 20px 5px; transform: rotate(-5deg); }
.background-gallery figcaption { position: absolute; right: 11px; bottom: 11px; padding: 6px 10px; border-radius: 999px; color: #536166; background: rgba(255,253,248,.94); font-family: var(--mono); font-size: 10px; letter-spacing: .05em; }
.background-sticker { position: absolute; z-index: 2; top: 0; left: 3%; display: grid; width: 96px; height: 96px; place-items: center; border: 5px solid rgba(255,253,248,.92); border-radius: 50%; color: #564d48; background: var(--butter); font-family: var(--display); font-size: 13px; font-weight: 700; line-height: 1.3; text-align: center; transform: rotate(-9deg); }

.folders { background: var(--paper); }
.folder-layout { display: grid; grid-template-columns: 1.08fr .92fr; gap: clamp(18px,3vw,38px); align-items: stretch; }
.folder-photo { position: relative; min-height: 390px; overflow: hidden; margin: 0; border: 8px solid var(--white); border-radius: 26px 26px 26px 7px; background: #e9ddc9; box-shadow: 0 18px 42px rgba(53,66,71,.1); transform: rotate(-1deg); }
.folder-photo img { width: 100%; height: 100%; min-height: 390px; object-fit: cover; }
.folder-photo figcaption { position: absolute; right: 13px; bottom: 13px; left: 13px; width: fit-content; max-width: calc(100% - 26px); padding: 8px 11px; border-radius: 0 999px 999px 0; border-left: 3px solid var(--coral); color: #4c5758; background: rgba(255,253,248,.94); font-size: 10px; font-weight: 650; }
.folder-details { position: relative; overflow: hidden; padding: clamp(25px,4vw,46px); border-radius: 7px 28px 28px 28px; background: #f4e5dc; }
.folder-details:after { position: absolute; right: -62px; bottom: -82px; width: 210px; height: 210px; border: 1px solid rgba(173,89,115,.16); border-radius: 50%; box-shadow: 0 0 0 18px rgba(173,89,115,.035),0 0 0 38px rgba(173,89,115,.025); content: ""; }
.folder-bubble { display: flex; width: fit-content; align-items: center; gap: 12px; padding: 7px 13px 7px 8px; border-radius: 999px; color: #687372; background: rgba(255,253,248,.76); font-size: 10px; font-weight: 700; }
.folder-bubble strong { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; color: var(--white); background: var(--berry); font-family: var(--mono); font-size: 10px; }
.folder-lead { position: relative; z-index: 1; margin: 22px 0 20px; font-family: var(--display); font-size: clamp(23px,3vw,34px); font-weight: 650; line-height: 1.45; letter-spacing: -.055em; }
.folder-lead strong { color: var(--berry); font-weight: 700; }
.folder-points { position: relative; z-index: 1; display: grid; margin: 0; padding: 0; list-style: none; }
.folder-points li { display: grid; grid-template-columns: 30px 1fr; gap: 0 10px; align-items: baseline; padding: 13px 0; border-top: 1px solid rgba(53,66,71,.12); }
.folder-points li > span { grid-row: span 2; color: var(--coral); font-family: var(--mono); font-size: 10px; }
.folder-points strong { font-size: 11px; font-weight: 800; }
.folder-points small { margin-top: 3px; color: #718080; font-size: 10px; }

.privacy { background: #e7e2ed; }
.privacy-grid { display: grid; grid-template-columns: 1fr .9fr; gap: clamp(30px,6vw,80px); align-items: center; }
.privacy-copy { position: relative; z-index: 1; }
.privacy-copy .eyebrow { color: #7a6687; }
.privacy-copy h2 { font-size: clamp(34px,4.5vw,58px); }
.privacy-copy h2 span { color: var(--berry); font-family: var(--display); font-size: .86em; font-weight: 650; }
.privacy-copy > p:not(.eyebrow) { max-width: 520px; margin: 18px 0 22px; color: #626e72; font-size: 12px; line-height: 1.9; word-break: keep-all; }
.privacy-link { display: inline-flex; align-items: center; gap: 10px; color: var(--berry); font-size: 11px; font-weight: 800; }
.privacy-link span { font-size: 16px; }
.privacy-photo { position: relative; overflow: hidden; min-height: 300px; margin: 0; border: 8px solid rgba(255,253,248,.9); border-radius: 30px 8px 30px 30px; background: #312d2a; box-shadow: 0 18px 42px rgba(53,66,71,.12); transform: rotate(1deg); }
.privacy-photo img { width: 100%; height: 100%; min-height: 300px; object-fit: cover; }
.privacy-photo figcaption { position: absolute; right: 12px; bottom: 12px; left: 12px; width: fit-content; padding: 8px 11px; border-radius: 999px; color: var(--ink); background: rgba(255,253,248,.94); font-size: 10px; font-weight: 750; }

.site-footer { padding: 21px 0; background: #f2eadf; }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand--footer .brand-mark { width: 30px; height: 30px; }
.brand--footer .brand-word strong { font-size: 11px; }
.brand--footer .brand-word small { display: none; }
.site-footer p { margin: 0; color: #7d8988; font-family: var(--mono); font-size: 10px; letter-spacing: .04em; }
.site-footer p i { padding: 0 6px; color: var(--coral); font-style: normal; }
.back-top { display: inline-flex; align-items: center; gap: 8px; color: #68777a; font-size: 10px; font-weight: 750; }
.back-top span { color: var(--berry); font-size: 16px; transition: transform .18s ease; }
.back-top:hover span { transform: translateY(-3px); }

.js .reveal { opacity: 0; transform: translateY(16px); transition: opacity .58s ease, transform .58s cubic-bezier(.2,.7,.25,1); }
.js .reveal.is-visible { opacity: 1; transform: translateY(0); }
.js .industry-list li { opacity: 0; transform: translateY(5px); }
.js .industry-list.is-visible li { animation: item-in .32s ease forwards; }
.js .industry-list.is-visible li:nth-child(4n+1) { animation-delay: .02s; }
.js .industry-list.is-visible li:nth-child(4n+2) { animation-delay: .05s; }
.js .industry-list.is-visible li:nth-child(4n+3) { animation-delay: .08s; }
.js .industry-list.is-visible li:nth-child(4n+4) { animation-delay: .11s; }
@keyframes item-in { to { opacity: 1; transform: translateY(0); } }

@media (min-width: 1500px) {
  .container { width: min(100% - 80px, 1360px); }
}
@media (max-width: 1100px) {
  .hero-grid { grid-template-columns: minmax(0,.9fr) minmax(400px,1.1fr); gap: 34px; }
  .hero h1 { font-size: clamp(43px,5.2vw,62px); }
  .section-heading { grid-template-columns: 58px minmax(0,1fr) minmax(180px,.5fr); gap: 17px; }
  .industry-list { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .industry-list li:nth-child(3n+2), .industry-list li:nth-child(3n+3) { padding-left: 12px; border-left: 1px solid rgba(53,66,71,.1); }
  .industry-list li:nth-child(4n+2), .industry-list li:nth-child(4n+3), .industry-list li:nth-child(4n+4) { border-left: 0; }
  .industry-list.is-filtered li { padding-left: 0; border-left: 0; }
  .industry-list.is-filtered li .industry-count { background: rgba(220,233,223,.78); }
  .format-grid { gap: 10px; }
  .format-label { align-items: flex-start; flex-direction: column; gap: 0; }
  .background-grid { gap: 40px; }
}
@media (max-width: 760px) {
  html { scroll-padding-top: 72px; }
  .container { width: min(100% - 38px, 560px); }
  .topbar { min-height: 68px; gap: 12px; }
  .brand { gap: 8px; }
  .brand-mark { width: 31px; height: 31px; }
  .brand-word strong { font-size: 11px; }
  .brand-word small { font-size: 10px; }
  .topbar { flex-wrap: wrap; }
  .menu-toggle { display: none; }
  .menu-toggle-label { font-size: 12px; font-weight: 750; }
  .menu-icon { display: grid; width: 15px; gap: 4px; }
  .menu-icon i { display: block; height: 1.5px; border-radius: 4px; background: currentColor; transition: transform .2s ease; }
  .menu-toggle[aria-expanded="true"] .menu-icon i:first-child { transform: translateY(2.75px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .menu-icon i:last-child { transform: translateY(-2.75px) rotate(-45deg); }
  .primary-nav { position: static; order: 3; display: flex; width: 100%; flex-wrap: wrap; justify-content: flex-start; gap: 6px; padding: 0 0 12px; }
  .primary-nav > a { padding: 8px 10px; border: 1px solid rgba(53,66,71,.12); border-radius: 999px; background: rgba(255,253,248,.76); }
  .primary-nav .nav-pill { margin-top: 0; }
  .industry-list.is-filtered li { padding-left: 0; border-left: 0; }
  .industry-list.is-filtered li .industry-count { background: rgba(220,233,223,.78); }
  .js .menu-toggle { display: inline-flex; align-items: center; gap: 8px; padding: 9px 11px; border: 1px solid rgba(53,66,71,.14); border-radius: 999px; color: var(--ink); background: var(--white); cursor: pointer; }
  .js .primary-nav { position: absolute; top: 60px; right: 18px; left: 18px; display: none; width: auto; align-items: stretch; flex-direction: column; flex-wrap: nowrap; gap: 0; padding: 10px; border: 1px solid rgba(53,66,71,.1); border-radius: 17px; background: rgba(255,253,248,.98); box-shadow: 0 16px 30px rgba(53,66,71,.13); }
  .js .primary-nav.is-open { display: flex; }
  .js .primary-nav > a { padding: 12px 11px; border: 0; border-bottom: 1px solid rgba(53,66,71,.08); border-radius: 0; background: transparent; }
  .js .primary-nav .nav-pill { justify-content: space-between; margin-top: 8px; border: 0; border-radius: 999px; color: var(--white); background: var(--berry); }
  .js .primary-nav .nav-pill span { color: var(--white); }
  .hero { padding: 43px 0 18px; }
  .hero:before { top: 38%; left: 67%; width: 275px; height: 275px; }
  .hero:after { right: -300px; bottom: -220px; width: 440px; height: 440px; }
  .hero-grid { grid-template-columns: 1fr; gap: 28px; }
  .hero-copy { padding: 8px 0 0; }
  .eyebrow { gap: 7px; margin-bottom: 15px; font-size: 10px; }
  .eyebrow-year { font-size: 10px; }
  .hero h1 { font-size: clamp(40px,10vw,59px); line-height: 1.18; }
  .hero-description { margin-top: 15px; font-size: 14px; line-height: 1.8; }
  .mobile-only { display: initial; }
  .hero-actions { gap: 11px 16px; margin-top: 19px; }
  .button { min-height: 46px; padding: 0 16px; font-size: 12px; }
  .text-link { font-size: 12px; }
  .hero-footnote { margin-top: 17px; font-size: 11px; }
  .hero-visual { padding: 0 2px 15px 0; }
  .hero-photo { border-width: 5px; border-radius: 18px 34px 18px 26px; }
  .hero-photo figcaption { right: 8px; bottom: 8px; gap: 6px; padding: 7px 9px; font-size: 10px; }
  .hero-sticker--number { top: -15px; left: -8px; width: 66px; height: 66px; border-width: 4px; }
  .hero-sticker--number strong { font-size: 25px; }
  .hero-sticker--number span { margin-top: -6px; font-size: 10px; }
  .hero-sticker--note { right: -2px; bottom: -2px; padding: 8px 10px; border-width: 3px; font-size: 10px; }
  .hero-bottom { margin-top: 19px; padding-top: 10px; font-size: 10px; }
  .quick-facts { padding: 14px 0 17px; }
  .facts-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
  .fact { min-height: 68px; gap: 10px; padding: 11px 13px; border-radius: 13px; }
  .fact strong { font-size: 26px; }
  .fact span { font-size: 11px; }
  .fact .fact-emoji { font-size: 18px; }
  .fact span:last-child { max-width: 78px; }
  .section-space { padding: 58px 0; }
  .section-heading { grid-template-columns: 42px 1fr; gap: 13px; align-items: start; margin-bottom: 26px; }
  .heading-index { width: 40px; height: 40px; padding: 7px; border-radius: 13px 13px 13px 4px; }
  .heading-index span { font-size: 10px; }
  .heading-index i { font-size: 14px; }
  .heading-main .eyebrow { margin: 2px 0 9px; font-size: 10px; }
  .heading-main h2, .background-copy h2, .privacy-copy h2 { font-size: clamp(31px,8.3vw,45px); }
  .section-aside { grid-column: 2; margin: -2px 0 0; font-size: 12px; }
  .industry-tools { align-items: flex-start; flex-direction: column; gap: 7px; margin: -9px 0 15px; }
  .industry-search { width: 100%; }
  .industry-search input { min-height: 43px; font-size: 14px; }
  .industry-result { font-size: 12px; }
  .industry-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .industry-list li { min-height: 58px; grid-template-columns: 21px minmax(0,1fr) auto; gap: 5px; padding: 8px 6px 8px 0; }
  .industry-list li:nth-child(2n) { padding-left: 8px; border-left: 1px solid rgba(53,66,71,.1); }
  .industry-list li:nth-child(3n+2), .industry-list li:nth-child(3n+3) { border-left: 0; }
  .industry-list li:nth-child(4n+2), .industry-list li:nth-child(4n+3), .industry-list li:nth-child(4n+4) { padding-left: 0; border-left: 0; }
  .industry-list li:nth-child(2n) { padding-left: 8px; border-left: 1px solid rgba(53,66,71,.1); }
  .industry-name { font-size: 14px; overflow-wrap: anywhere; }
  .industry-number { font-size: 12px; }
  .industry-count { padding: 3px 5px; font-size: 12px; }
  .industry-footer { align-items: flex-start; font-size: 11px; line-height: 1.5; }
  .industry-footer strong { padding-top: 2px; font-size: 10px; }
  .industry-list.is-filtered li { padding-left: 0; border-left: 0; }
  .industry-list.is-filtered li .industry-count { background: rgba(220,233,223,.78); }
  .format-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .format-card { padding: 7px 7px 11px; border-radius: 15px; }
  .format-card:nth-child(even) { margin-top: 13px; }
  .format-photo { border-radius: 10px; }
  .format-label { padding: 10px 4px 0; }
  .format-label strong { font-size: 22px; }
  .format-label span { font-size: 11px; }
  .section-note { margin-top: 17px; font-size: 12px; }
  .background-grid, .privacy-grid { grid-template-columns: 1fr; gap: 23px; }
  .background-copy .eyebrow { margin-bottom: 13px; }
  .background-number { font-size: 64px; }
  .background-number span { font-size: 13px; }
  .background-copy h2 { font-size: clamp(31px,8.3vw,44px); }
  .section-description { margin-top: 12px; font-size: 12px; }
  .background-tags { gap: 5px; margin-top: 14px; }
  .background-tags span { padding: 6px 9px; font-size: 10px; }
  .background-gallery { min-height: 300px; margin-top: 4px; }
  .background-gallery figure { border-width: 5px; }
  .background-main-photo { width: 83%; height: 82%; }
  .background-small-photo { width: 44%; height: 43%; }
  .background-sticker { width: 74px; height: 74px; border-width: 4px; font-size: 10px; }
  .background-gallery figcaption { right: 7px; bottom: 7px; padding: 5px 7px; font-size: 10px; }
  .folder-layout { grid-template-columns: 1fr; gap: 20px; }
  .folder-photo, .folder-photo img { min-height: 250px; }
  .folder-photo { border-width: 6px; border-radius: 20px 20px 20px 5px; }
  .folder-details { padding: 23px; border-radius: 5px 22px 22px 22px; }
  .folder-lead { margin: 17px 0 14px; font-size: 25px; }
  .folder-points li { padding: 11px 0; }
  .folder-points strong { font-size: 12px; }
  .folder-points small { font-size: 11px; }
  .privacy-copy .eyebrow { margin-bottom: 13px; }
  .privacy-copy > p:not(.eyebrow) { margin: 13px 0 17px; font-size: 13px; }
  .privacy-photo, .privacy-photo img { min-height: 220px; }
  .privacy-photo { border-width: 5px; border-radius: 23px 6px 23px 23px; }
  .privacy-photo figcaption { right: 8px; bottom: 8px; left: 8px; padding: 7px 9px; font-size: 10px; }
  .footer-inner { flex-wrap: wrap; gap: 13px; }
  .brand--footer { flex: 1; }
  .site-footer p { order: 3; width: 100%; font-size: 10px; }
  .back-top { font-size: 10px; }
}
@media (max-width: 390px) {
  .container { width: calc(100% - 30px); }
  .brand-word small { display: none; }
  .fact { gap: 6px; padding-inline: 8px; }
  .fact .fact-emoji { font-size: 16px; }
  .fact strong { font-size: 24px; }
  .fact span:last-child { max-width: 70px; font-size: 10px; }
  .hero h1 { font-size: 39px; }
  .industry-name { font-size: 14px; }
  .industry-count { font-size: 12px; }
  .hero-bottom { letter-spacing: .06em; }
}
@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js .reveal, .js .industry-list li { opacity: 1; transform: none; }
}