/* ==========================================================================
   /partner - Partners (clients + technology partners)
   prefix: pt-
   01 Overview (counts per field) / Logo band (marquee) / 02 Client wall (logo grid)
   03 Technology partners (dark section: expands in, desktop deck-to-grid scrub)
   Palette: tokens only (paper / ink / brand indigo / night / tape yellow via --signal).
   NOTE: ASCII-only on purpose - Tomcat transcodes static files from MS949 and garbles UTF-8.
   ========================================================================== */

/* ---------- Page font stack: Hangul inside mono labels falls back to Pretendard ---------- */
.c-page-partner {
    --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", "Malgun Gothic", monospace;
}

/* ---------- Shared: logo box / name fallback ---------- */
[data-pt-logo] img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}
.pt-typo {
    position: absolute;
    inset: 14% 10% 26%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
}
.pt-typo strong {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: clamp(14px, 1.12vw, 17px);
    font-weight: 700;
    line-height: 1.32;
    letter-spacing: -0.024em;
    color: var(--ink-2);
}
.pt-typo small {
    padding: 3px 7px;
    border-radius: var(--r-xs);
    box-shadow: inset 0 0 0 1px var(--line-2);
    font-size: 10px;
    letter-spacing: .12em;
    color: var(--muted);
}

/* JS trims the white padding of each logo file and scales the visible mark up,
   so the (blank) overflow of the file is clipped at the logo box */
.pt-tile__logo, .pt-vendor__logo { overflow: hidden; }

/* Filter swap: suspend reveal transitions (WAAPI handles the entrance) */
.pt-notrans [data-reveal], .pt-notrans .pt-tile__logo, .pt-notrans .pt-typo { transition: none !important; }

/* Editorial wrapping: no single-word last lines in descriptions / closing copy */
.c-page-partner .c-sechead__desc { text-wrap: pretty; }
.pt-cat__name { text-wrap: balance; }

/* Empty states: JETCO symbol as a quiet placeholder */
.pt-none__mark { width: 56px; height: 56px; opacity: .28; filter: grayscale(1); }

/* ==========================================================================
   01. Overview - counts per field
   ========================================================================== */
.pt-stats { padding-bottom: clamp(72px, 8vw, 128px); }
.pt-stats > .c-container { position: relative; }

/* kinetic outline type behind the heading (moves sideways with scroll: data-scrub-x) */
.pt-kinetic {
    position: absolute;
    left: 0;
    right: 0;
    top: clamp(18px, 3.2vw, 46px);
    overflow: hidden;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
}
.pt-kinetic span {
    display: inline-block;
    padding-left: 34vw;
    font-size: clamp(84px, 13vw, 220px);
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -0.055em;
    color: transparent;
    -webkit-text-stroke: 1.5px rgba(var(--signal-rgb), .14);
}

.pt-ledger {
    display: grid;
    grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
    gap: clamp(16px, 2vw, 28px);
    align-items: stretch;
}
.pt-ledger--solo { grid-template-columns: minmax(0, 1fr); }

/* Total card (brand indigo, dark context -> yellow accents) */
.pt-total {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 100%;
    padding: clamp(24px, 2.4vw, 36px);
    border-radius: var(--r-lg);
    background: var(--brand);
    color: #fff;
}
html.js .pt-total[data-reveal] {
    transition: opacity 1s var(--ease), transform 1.2s var(--ease), box-shadow .7s var(--ease);
    transition-delay: var(--d, 0ms), var(--d, 0ms), 0s;
}
.pt-total:hover { box-shadow: var(--shadow-2); }
.pt-total__grid {
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image:
        linear-gradient(var(--night-line) 1px, transparent 1px),
        linear-gradient(90deg, var(--night-line) 1px, transparent 1px);
    background-size: 44px 44px;
    background-position: -1px -1px;
    -webkit-mask-image: linear-gradient(165deg, #000 8%, transparent 62%);
    mask-image: linear-gradient(165deg, #000 8%, transparent 62%);
    transition: background-size 1.2s var(--ease), opacity .6s var(--ease);
    opacity: .8;
}
.pt-total:hover .pt-total__grid { opacity: 1; background-size: 40px 40px; }
.pt-total__head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 4px 12px;
    font-size: 11px;
    letter-spacing: .14em;
    color: var(--fog);
}
.pt-total__head > span:first-child { color: var(--signal); }
/* mono label rows: never break inside a label (body has overflow-wrap:anywhere) */
.pt-total__head > span, .pt-cat__top > span, .pt-vendor__top > span { white-space: nowrap; }
.pt-total__num {
    display: flex;
    align-items: flex-start;
    margin-top: auto;
    padding-top: clamp(32px, 4vw, 64px);
    font-size: clamp(96px, 10.6vw, 176px);
    font-weight: 760;
    line-height: .86;
    letter-spacing: -0.065em;
    font-variant-numeric: tabular-nums;
}
.pt-total__num small {
    margin: .12em 0 0 .14em;
    font-size: .16em;
    font-weight: 650;
    letter-spacing: -0.01em;
    color: var(--signal);
}
.pt-total__label {
    font-size: clamp(17px, 1.3vw, 19px);
    font-weight: 650;
    letter-spacing: -0.022em;
}
.pt-total__bar {
    display: flex;
    gap: 3px;
    height: 10px;
    margin-top: 4px;
}
.pt-total__bar i {
    flex-basis: 0;
    flex-shrink: 1;
    min-width: 4px;
    border-radius: 2px;
    background: rgba(255, 255, 255, .5);
    transform-origin: 50% 100%;
    transition: background .35s var(--ease), transform .5s var(--ease);
}
.pt-total__bar i:nth-child(even) { background: rgba(255, 255, 255, .26); }
.pt-total__bar i.is-hot { background: var(--signal); transform: scaleY(1.7); }
html.js .pt-total__bar { clip-path: inset(-12px 100% -12px 0); transition: clip-path 1.6s var(--ease) .35s; }
html.js .pt-total.is-in .pt-total__bar { clip-path: inset(-12px 0 -12px 0); }
.pt-total__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    font-size: 11px;
    letter-spacing: .02em;
    color: var(--fog);
}
.pt-total__legend span { display: inline-flex; gap: 6px; transition: color .3s; }
.pt-total__legend b { font-weight: 500; color: #fff; transition: color .3s; }
.pt-total__legend span.is-hot { color: #fff; }
.pt-total__legend span.is-hot b { color: var(--signal); }
.pt-total__foot {
    padding-top: 14px;
    border-top: 1px solid var(--night-line-2);
    font-size: 13px;
    letter-spacing: -0.01em;
    color: var(--fog);
}

/* Field cells (ledger table) */
.pt-cats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-content: stretch;
    border-top: 1.5px solid var(--ink);
}
.pt-cats > li { min-width: 0; border-bottom: 1px solid var(--line-2); }
.pt-cats > li:not(:nth-child(3n+1)) { border-left: 1px solid var(--line); }
.pt-cat {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 236px;
    padding: 20px 22px 24px;
}
.pt-cat::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--white);
    transform: scaleY(0);
    transform-origin: 50% 100%;
    transition: transform .6s var(--ease);
}
.pt-cat:hover::before, .pt-cat:focus-visible::before { transform: scaleY(1); }
.pt-cat:focus-visible { outline-offset: -3px; }
.pt-cat__top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    font-size: 11px;
    letter-spacing: .1em;
    color: var(--muted);
}
.pt-cat__top .c-mono { padding-top: 2px; color: var(--ink-2); font-weight: 500; }
.pt-cat__icon {
    flex: none;
    width: 32px;
    height: 32px;
    overflow: visible;
    fill: none;
    stroke: var(--signal);
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform .6s var(--ease);
}
.pt-cat:hover .pt-cat__icon { transform: translateY(-2px) scale(1.08); }
.pt-cat__num {
    margin: clamp(18px, 2.2vw, 32px) 0 14px;
    font-size: clamp(52px, 5.2vw, 84px);
    font-weight: 720;
    line-height: .9;
    letter-spacing: -0.055em;
    font-variant-numeric: tabular-nums;
    transition: color .45s var(--ease);
}
.pt-cat:hover .pt-cat__num { color: var(--signal); }
.pt-cat__name {
    padding-right: 46px;
    font-size: 17px;
    font-weight: 650;
    line-height: 1.35;
    letter-spacing: -0.02em;
}
.pt-cat__eng {
    margin: 5px 0 20px;
    padding-right: 46px;
    font-size: 10.5px;
    letter-spacing: .14em;
    color: var(--muted);
}
.pt-cat__bar {
    position: relative;
    display: block;
    height: 3px;
    margin-top: auto;
    border-radius: 2px;
    background: var(--line);
    overflow: hidden;
}
.pt-cat__bar i {
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: var(--w, 0%);
    min-width: 3px;
    background: var(--ink);
    transform-origin: 0 50%;
    transition: transform 1.5s var(--ease) .3s, background .35s;
}
html.js .pt-cats > li:not(.is-in) .pt-cat__bar i { transform: scaleX(0); }
.pt-cat:hover .pt-cat__bar i { background: var(--signal); }
.pt-cat__bar--dash {
    background: repeating-linear-gradient(90deg, var(--ink-3) 0 6px, transparent 6px 11px);
    opacity: .45;
}
.pt-cat__go {
    position: absolute;
    right: 18px;
    bottom: 36px;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px var(--line-2);
    color: var(--ink);
    transition: background .4s var(--ease), box-shadow .4s, color .4s;
}
.pt-cat__go svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transform: rotate(45deg);
    transition: transform .55s var(--ease);
}
.pt-cat:hover .pt-cat__go, .pt-cat:focus-visible .pt-cat__go { background: var(--signal); box-shadow: inset 0 0 0 1px var(--signal); color: var(--on-signal); }
.pt-cat:hover .pt-cat__go svg { transform: rotate(90deg); }

/* Technology-partner cell - hatched, inverts to ink on hover (accent switches to tape yellow) */
.pt-cat--tech { background: repeating-linear-gradient(-45deg, transparent 0 10px, rgba(16, 18, 46, .04) 10px 11px); transition: color .45s var(--ease); }
.pt-cat--tech::before { background: var(--ink); }
.pt-cat--tech:hover, .pt-cat--tech:focus-visible { --signal: var(--tape); --on-signal: var(--ink); color: #fff; }
.pt-cat--tech:hover .pt-cat__top .c-mono, .pt-cat--tech:hover .pt-cat__eng,
.pt-cat--tech:focus-visible .pt-cat__top .c-mono, .pt-cat--tech:focus-visible .pt-cat__eng { color: var(--fog); }
.pt-cat--tech:hover .pt-cat__go, .pt-cat--tech:focus-visible .pt-cat__go { box-shadow: inset 0 0 0 1px var(--signal); }
.pt-cat--tech:hover .pt-cat__bar--dash { background: repeating-linear-gradient(90deg, var(--fog-2) 0 6px, transparent 6px 11px); opacity: 1; }

/* ==========================================================================
   Logo band - two-row marquee (printed on paper: grayscale + multiply)
   ========================================================================== */
.pt-band {
    position: relative;
    overflow: hidden;
    padding: 22px 0 30px;
    background: #fff;
    border-top: 1.5px solid var(--ink);
    border-bottom: 1px solid var(--line-2);
}
.pt-band__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 14px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--ink-2);
}
.pt-band__head > span { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }
.pt-band__head > .pt-band__sum { display: inline-block; font-weight: 500; color: var(--ink-3); }
.pt-band__sum b { margin: 0 1px 0 5px; font-family: var(--font-mono); font-weight: 600; color: var(--ink); }
.pt-band__mark {
    flex: none;
    width: 8px;
    height: 8px;
    border-radius: 1px;
    background: var(--signal);
    box-shadow: 0 0 0 3px var(--signal-soft);
}
.pt-band__sep {
    display: inline-block;
    vertical-align: middle;
    width: 4px;
    height: 4px;
    margin: -2px 12px 0;
    background: var(--line-2);
    transform: rotate(45deg);
}
.pt-band__row + .pt-band__row { margin-top: 2px; }
.pt-band .c-marquee__track { background: #fff; }
.pt-band:hover .c-marquee__track { animation-play-state: paused; }
.pt-band .c-marquee__group { align-items: center; }
.pt-mq {
    position: relative;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 172px;
    height: 74px;
    margin-right: 22px;
}
.pt-mq::after { display: none; }
.pt-mq img {
    filter: none;
    opacity: 1;
    mix-blend-mode: normal;
    transition: filter .5s var(--ease), opacity .5s var(--ease);
}
.pt-mq:hover img { filter: none; opacity: 1; }
.pt-mq .pt-typo { position: static; inset: auto; }
.pt-mq .pt-typo strong { font-size: 15px; color: var(--ink-3); }

/* ==========================================================================
   02. Client wall - logo grid
   ========================================================================== */
.pt-toolbar { position: relative; z-index: 2; align-items: center; }
.pt-chips { position: relative; min-width: 0; max-width: 100%; }
.pt-count { white-space: nowrap; }
.pt-count__label { color: var(--ink-2); }

.pt-wall {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
}
.pt-wall.is-collapsed {
    -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 170px), rgba(0, 0, 0, .08));
    mask-image: linear-gradient(to bottom, #000 calc(100% - 170px), rgba(0, 0, 0, .08));
}

.pt-tile {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-width: 0;
    aspect-ratio: 5 / 4;
    border-radius: var(--r);
    background: var(--white);
    box-shadow: inset 0 0 0 1px var(--line);
    transform-origin: 50% 0;
    transition: box-shadow .5s var(--ease);
}
/* entrance: each tile flips up from below, then its logo settles in */
html.js .pt-tile[data-reveal] {
    transition: opacity .9s var(--ease), transform 1.3s var(--ease), box-shadow .5s var(--ease);
    transition-delay: var(--d, 0ms), var(--d, 0ms), 0s;
}
html.js .pt-tile[data-reveal="up"] { transform: perspective(1000px) translate3d(0, 46px, 0) rotateX(-34deg); }
html.js .pt-tile[data-reveal].is-in { transform: none; }
html.js .pt-tile[data-reveal] .pt-tile__logo, html.js .pt-tile[data-reveal] .pt-typo {
    opacity: 0;
    scale: .78;
    transition: transform .75s var(--ease), opacity .8s var(--ease) calc(var(--d, 0ms) + 240ms), scale 1.2s var(--ease) calc(var(--d, 0ms) + 240ms);
}
html.js .pt-tile[data-reveal].is-in .pt-tile__logo, html.js .pt-tile[data-reveal].is-in .pt-typo { opacity: 1; scale: 1; }

/* focus frame: four crisp corner brackets close in on the logo */
.pt-tile::before {
    --c: var(--signal);
    content: "";
    position: absolute;
    inset: 17% 13% 35%;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(var(--c), var(--c)) 0 0 / 14px 1.5px no-repeat,
        linear-gradient(var(--c), var(--c)) 0 0 / 1.5px 14px no-repeat,
        linear-gradient(var(--c), var(--c)) 100% 0 / 14px 1.5px no-repeat,
        linear-gradient(var(--c), var(--c)) 100% 0 / 1.5px 14px no-repeat,
        linear-gradient(var(--c), var(--c)) 0 100% / 14px 1.5px no-repeat,
        linear-gradient(var(--c), var(--c)) 0 100% / 1.5px 14px no-repeat,
        linear-gradient(var(--c), var(--c)) 100% 100% / 14px 1.5px no-repeat,
        linear-gradient(var(--c), var(--c)) 100% 100% / 1.5px 14px no-repeat;
    opacity: 0;
    transition: inset .7s var(--ease), opacity .35s var(--ease);
}
.pt-tile__no {
    position: absolute;
    right: 12px;
    top: 10px;
    font-size: 10px;
    letter-spacing: .08em;
    color: var(--muted);
    opacity: .55;
    transition: opacity .4s, color .4s;
}
.pt-tile__logo {
    position: absolute;
    inset: 17% 13% 21%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .75s var(--ease);
}
.pt-tile__logo img {
    filter: none;
    opacity: 1;
    transition: filter .6s var(--ease), opacity .6s var(--ease);
}
.pt-tile__tag {
    position: absolute;
    left: 6px;
    right: 6px;
    bottom: 6px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    padding: 7px 10px 8px;
    border-radius: 9px;
    background: var(--ink);
    color: #fff;
    line-height: 1.2;
    letter-spacing: 0;
    transform: translateY(calc(100% + 8px));
    transition: transform .6s var(--ease);
}
.pt-tile__tag b, .pt-tile__tag i {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pt-tile__tag b { order: 2; font-size: 12.5px; font-weight: 600; letter-spacing: -0.01em; }
.pt-tile__tag i { order: 1; font-style: normal; font-size: 10.5px; font-weight: 500; color: var(--signal); }

.pt-tile:hover, .pt-tile.is-focus { box-shadow: inset 0 0 0 1px var(--ink), var(--shadow-1); }
.pt-tile:hover::before, .pt-tile.is-focus::before { inset: 9% 7% 31%; opacity: 1; }
.pt-tile:hover .pt-tile__no, .pt-tile.is-focus .pt-tile__no { opacity: 0; }
.pt-tile:hover .pt-tile__logo, .pt-tile.is-focus .pt-tile__logo,
.pt-tile:hover .pt-typo, .pt-tile.is-focus .pt-typo { transform: translateY(-9%); }
.pt-tile:hover .pt-tile__logo img, .pt-tile.is-focus .pt-tile__logo img { filter: none; opacity: 1; }
.pt-tile:hover .pt-tile__tag, .pt-tile.is-focus .pt-tile__tag { transform: none; }
.pt-tile .pt-typo { transition: transform .75s var(--ease); }

/* Contact slot - closes an incomplete last row (span set by JS).
   Size containment: the slot never changes the row height, it takes the tiles' height. */
.pt-slot {
    position: relative;
    min-width: 0;
    container-type: size;
    border-radius: var(--r);
    background: repeating-linear-gradient(-45deg, transparent 0 10px, rgba(16, 18, 46, .045) 10px 11px);
}
.pt-slot[hidden] { display: none; }
.pt-slot::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    border: 1px dashed var(--line-2);
    border-radius: inherit;
    pointer-events: none;
    transition: border-color .45s var(--ease);
}
.pt-slot__link {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    height: 100%;
    padding: 14px 14px 14px 16px;
    border-radius: inherit;
}
.pt-slot__link::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--white);
    transform: scaleY(0);
    transform-origin: 50% 100%;
    transition: transform .6s var(--ease);
}
.pt-slot__link:focus-visible { outline-offset: -3px; }
.pt-slot__code {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 10.5px;
    letter-spacing: .14em;
    white-space: nowrap;
    color: var(--muted);
}
.pt-slot__code i {
    flex: none;
    width: 7px;
    height: 7px;
    border-radius: 1px;
    box-shadow: inset 0 0 0 1.5px var(--signal);
    transition: background .4s var(--ease);
}
.pt-slot__text {
    display: none;
    font-size: 19px;
    font-weight: 680;
    line-height: 1.34;
    letter-spacing: -0.03em;
    color: var(--ink-2);
}
.pt-slot__cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 14.5px;
    font-weight: 620;
    letter-spacing: -0.01em;
    white-space: nowrap;
    color: var(--ink);
}
.pt-slot__go {
    flex: none;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px var(--line-2);
    transition: background .4s var(--ease), box-shadow .4s, color .4s;
}
.pt-slot__go svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform .55s var(--ease);
}
.pt-slot__link:hover::before, .pt-slot__link:focus-visible::before { transform: scaleY(1); }
.pt-slot:hover::before, .pt-slot:focus-within::before { border-style: solid; border-color: var(--ink); }
.pt-slot__link:hover .pt-slot__code i { background: var(--signal); }
.pt-slot__link:hover .pt-slot__go, .pt-slot__link:focus-visible .pt-slot__go { background: var(--signal); box-shadow: inset 0 0 0 1px var(--signal); color: var(--on-signal); }
.pt-slot__link:hover .pt-slot__go svg { transform: translateX(2px); }
@container (min-width: 300px) {
    .pt-slot__link { padding: 18px 18px 18px 22px; }
    .pt-slot__text { display: block; }
}
@container (min-width: 300px) and (max-height: 150px) {
    .pt-slot__text { font-size: 16px; }
    .pt-slot__link { padding-top: 14px; padding-bottom: 14px; }
}
/* three or more empty cells: copy bottom-left, action bottom-right */
@container (min-width: 520px) {
    .pt-slot__link {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: auto 1fr;
        align-items: end;
        column-gap: 24px;
        padding: 20px 22px 22px 26px;
    }
    .pt-slot__code { grid-column: 1 / -1; align-self: start; }
    .pt-slot__text { font-size: clamp(20px, 2cqw + 8px, 26px); }
    .pt-slot__cta { gap: 14px; }
}

/* show more / empty */
.pt-more { display: flex; justify-content: center; margin-top: 28px; }
.pt-more__btn .pt-more__icon { transition: transform .55s var(--ease); }
.pt-more__btn:hover .pt-more__icon { transform: rotate(90deg); }
.pt-more__btn[aria-expanded="true"] .pt-more__icon { transform: rotate(45deg); }
.pt-empty { margin-top: 10px; }

/* ==========================================================================
   03. Technology partners - dark section
   ========================================================================== */
.pt-tech {
    overflow: hidden;
    isolation: isolate;
    padding-bottom: clamp(64px, 7vw, 112px);
    border-bottom: 1px solid var(--night-line);
}
.pt-tech__field {
    position: absolute;
    inset: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    opacity: .26;
    -webkit-mask-image: radial-gradient(ellipse 70% 52% at 86% 0%, #000 10%, transparent 72%);
    mask-image: radial-gradient(ellipse 70% 52% at 86% 0%, #000 10%, transparent 72%);
}
/* crisp grid texture instead of a glow */
.pt-tech__grid {
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image:
        linear-gradient(var(--night-line) 1px, transparent 1px),
        linear-gradient(90deg, var(--night-line) 1px, transparent 1px);
    background-size: 96px 96px;
    background-position: -1px -1px;
    -webkit-mask-image: radial-gradient(ellipse 60% 46% at 50% 58%, #000 20%, transparent 78%);
    mask-image: radial-gradient(ellipse 60% 46% at 50% 58%, #000 20%, transparent 78%);
    opacity: .7;
}

.pt-vendors {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
}
.pt-vendors__item { display: flex; flex: 0 0 calc((100% - 64px) / 5); min-width: 0; }
/* desktop deck-to-grid scrub (partner.js): GSAP owns the transforms */
.pt-vendors.is-deal .pt-vendors__item { transition: none !important; will-change: transform; }
.pt-vendors.is-deal .pt-vendor__card { box-shadow: inset 0 0 0 1px var(--night-line-2), 0 30px 60px -34px rgba(0, 0, 0, .9); }
.pt-vendor { display: flex; width: 100%; border-radius: var(--r-lg); will-change: transform; }
.pt-vendor__card {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 14px;
    width: 100%;
    padding: 12px 12px 18px;
    border-radius: inherit;
    background: var(--night-2);
    box-shadow: inset 0 0 0 1px var(--night-line);
    transition: background .5s var(--ease), box-shadow .5s var(--ease);
}
/* bottom accent rule draws across on hover */
.pt-vendor__card::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: var(--signal);
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: transform .7s var(--ease);
}
.pt-vendor__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 2px 4px 0;
    font-size: 10.5px;
    letter-spacing: .14em;
    color: var(--signal);
}
.pt-vendor__dot { width: 6px; height: 6px; visibility: hidden; }
.pt-vendor__plate {
    position: relative;
    display: block;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    border-radius: 12px;
    background: #fff;
}
/* viewfinder corners */
.pt-vendor__plate::after {
    --c: rgba(16, 18, 46, .22);
    content: "";
    position: absolute;
    inset: 9px;
    z-index: 2;
    pointer-events: none;
    background:
        linear-gradient(var(--c), var(--c)) 0 0 / 12px 1.5px no-repeat,
        linear-gradient(var(--c), var(--c)) 0 0 / 1.5px 12px no-repeat,
        linear-gradient(var(--c), var(--c)) 100% 0 / 12px 1.5px no-repeat,
        linear-gradient(var(--c), var(--c)) 100% 0 / 1.5px 12px no-repeat,
        linear-gradient(var(--c), var(--c)) 0 100% / 12px 1.5px no-repeat,
        linear-gradient(var(--c), var(--c)) 0 100% / 1.5px 12px no-repeat,
        linear-gradient(var(--c), var(--c)) 100% 100% / 12px 1.5px no-repeat,
        linear-gradient(var(--c), var(--c)) 100% 100% / 1.5px 12px no-repeat;
    transition: inset .6s var(--ease);
}
.pt-vendor__logo {
    position: absolute;
    inset: 18% 14%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .8s var(--ease);
}
.pt-vendor__logo img {
    filter: none;
    opacity: 1;
    transition: filter .6s var(--ease), opacity .6s var(--ease);
}
.pt-vendor__plate .pt-typo { inset: 12% 10%; }
.pt-vendor__plate .pt-typo strong { font-size: clamp(16px, 1.3vw, 19px); }
.pt-vendor__name {
    position: relative;
    display: block;
    padding: 0 24px 0 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 15.5px;
    font-weight: 650;
    letter-spacing: -0.015em;
    color: #fff;
}

.pt-vendor:hover .pt-vendor__card, .pt-vendor__card.is-focus {
    background: var(--night-3);
    box-shadow: inset 0 0 0 1px var(--night-line-2), 0 40px 70px -40px rgba(0, 0, 0, .85);
}
.pt-vendor:hover .pt-vendor__card::after, .pt-vendor__card.is-focus::after { transform: scaleX(1); }
.pt-vendor:hover .pt-vendor__plate::after, .pt-vendor__card.is-focus .pt-vendor__plate::after { inset: 6px; --c: var(--brand); }
.pt-vendor:hover .pt-vendor__logo, .pt-vendor__card.is-focus .pt-vendor__logo { transform: scale(1.05); }
.pt-vendor:hover .pt-vendor__logo img, .pt-vendor__card.is-focus .pt-vendor__logo img { filter: none; opacity: 1; }

/* closing contact row */
.pt-close {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 32px 56px;
    margin-top: clamp(80px, 9vw, 150px);
    padding-top: clamp(32px, 3vw, 48px);
    border-top: 1px solid var(--night-line-2);
}
.pt-close__copy {
    font-size: clamp(26px, 3vw, 46px);
    font-weight: 720;
    line-height: 1.24;
    letter-spacing: -0.04em;
    text-wrap: balance;
}
.pt-close__copy em { display: block; color: var(--fog-2); text-wrap: balance; }
.pt-close__actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1180px) {
    /* stack heading + description so long Korean headings do not orphan a word */
    .c-page-partner .c-sechead { grid-template-columns: 1fr; align-items: start; }
    .c-page-partner .c-sechead__desc { max-width: 640px; }
    .pt-wall { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .pt-vendors__item { flex-basis: calc((100% - 48px) / 4); }
}
@media (max-width: 1024px) {
    .pt-ledger { grid-template-columns: 1fr; }
    .pt-total { min-height: 0; }
    .pt-wall { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .pt-vendors__item { flex-basis: calc((100% - 32px) / 3); }
    .pt-close { grid-template-columns: 1fr; align-items: start; }
}
/* tablet: the stacked total card becomes a wide banner - number left, breakdown right */
@media (min-width: 761px) and (max-width: 1024px) {
    .pt-total {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-rows: auto 1fr auto auto auto auto;
        gap: 16px clamp(40px, 6vw, 72px);
    }
    .pt-total__head { grid-column: 1 / -1; grid-row: 1; }
    .pt-total__num { grid-column: 1; grid-row: 2 / -1; align-self: end; margin-top: 0; padding-top: 44px; }
    .pt-total__label { grid-column: 2; grid-row: 3; align-self: end; }
    .pt-total__bar { grid-column: 2; grid-row: 4; }
    .pt-total__legend { grid-column: 2; grid-row: 5; }
    .pt-total__foot { grid-column: 2; grid-row: 6; }
}
@media (max-width: 760px) {
    .pt-kinetic span { padding-left: 12vw; -webkit-text-stroke-width: 1.2px; }
    .pt-total__num { padding-top: 40px; font-size: clamp(88px, 27vw, 120px); }
    .pt-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pt-cats > li:not(:nth-child(3n+1)) { border-left: 0; }
    .pt-cats > li:nth-child(2n) { border-left: 1px solid var(--line); }
    .pt-cat { min-height: 0; padding: 16px 14px 18px; }
    .pt-cat__top { font-size: 10px; letter-spacing: .06em; }
    .pt-cat__icon { width: 26px; height: 26px; }
    .pt-cat__num { margin: 16px 0 10px; font-size: clamp(44px, 13vw, 56px); }
    /* arrow sits beside the number so the label rows get the full cell width */
    .pt-cat__name { padding-right: 0; font-size: 15.5px; }
    .pt-cat__eng { margin-bottom: 16px; padding-right: 0; font-size: 9.5px; letter-spacing: .1em; }
    .pt-cat__go { top: 62px; right: 12px; bottom: auto; width: 32px; height: 32px; }
    .pt-cat__go svg { width: 14px; height: 14px; }

    /* column + wrap would size the flex line to the chips' max-content width -> page overflow */
    .pt-toolbar { flex-wrap: nowrap; align-items: stretch; gap: 14px; }
    .pt-chips {
        max-width: none;
        /* edge fade: the chip row scrolls sideways */
        -webkit-mask-image: linear-gradient(90deg, transparent, #000 var(--gutter), #000 calc(100% - var(--gutter)), transparent);
        mask-image: linear-gradient(90deg, transparent, #000 var(--gutter), #000 calc(100% - var(--gutter)), transparent);
    }
    .pt-count { align-self: flex-end; }

    .pt-band { padding: 18px 0 22px; }
    .pt-band__head { font-size: 12px; gap: 10px; }
    .pt-band__head > span { gap: 8px; }
    .pt-band__sep { margin: -2px 8px 0; }
    .pt-mq { width: 132px; height: 58px; margin-right: 18px; }
    .pt-mq::after { display: none; }

    .pt-wall { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .pt-tile__no { right: 10px; top: 8px; font-size: 9px; }
    .pt-tile::before {
        background-size: 10px 1.5px, 1.5px 10px, 10px 1.5px, 1.5px 10px, 10px 1.5px, 1.5px 10px, 10px 1.5px, 1.5px 10px;
    }

    .pt-vendors { gap: 10px; }
    .pt-vendors__item { flex-basis: calc((100% - 10px) / 2); }
    .pt-vendor__card { gap: 10px; padding: 9px 9px 14px; border-radius: var(--r); }
    .pt-vendor__top { font-size: 9.5px; letter-spacing: .1em; }
    .pt-vendor__plate { border-radius: 9px; }
    .pt-vendor__name { font-size: 14px; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; }
    .pt-close__actions { width: 100%; }
    .pt-close__actions .c-btn { flex: 1 1 100%; }
}
@media (max-width: 560px) {
    .pt-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pt-tile__tag { left: 5px; right: 5px; bottom: 5px; padding: 6px 9px 7px; }
}
/* JS failsafe: if site.js never runs (no html.c-ready), un-hide the custom states too */
html.js:not(.c-ready) .pt-total__bar { animation: pt-failsafe-clip .6s ease 2.4s forwards; }
html.js:not(.c-ready) .pt-cats > li .pt-cat__bar i { animation: pt-failsafe-bar .6s ease 2.4s forwards; }
html.js:not(.c-ready) .pt-tile .pt-tile__logo, html.js:not(.c-ready) .pt-tile .pt-typo { animation: pt-failsafe-show .6s ease 2.4s forwards; }
@keyframes pt-failsafe-clip { to { clip-path: inset(-12px 0 -12px 0); } }
@keyframes pt-failsafe-bar { to { transform: none; } }
@keyframes pt-failsafe-show { to { opacity: 1; scale: 1; } }

/* Touch + reduced motion: static colour/tag instead of the focus pass */
@media (hover: none) {
    html.reduce-motion .pt-tile__logo img, html.reduce-motion .pt-vendor__logo img { filter: none; opacity: 1; }
    html.reduce-motion .pt-tile__tag { transform: none; }
    html.reduce-motion .pt-tile__logo, html.reduce-motion .pt-tile .pt-typo { transform: translateY(-9%); }
}
@media (prefers-reduced-motion: reduce) {
    html.js .pt-total__bar { clip-path: none; }
    html.js .pt-tile[data-reveal] .pt-tile__logo, html.js .pt-tile[data-reveal] .pt-typo { opacity: 1; scale: 1; }
}
