/* PICA brand page — animation + effects the Tailwind utilities can't express.
   Adapted from the Escoffier brand template (te-esc-* → te-pica-*). Generic
   helpers (.te-fade, .marquee-track, .te-emp-logo) keep their shared names
   because page-brand-pica.js targets them. */

/* Scroll fade-up. Per-element stagger is set via .te-pica-delay-* classes. */
.te-fade {
	opacity: 0;
	transform: translateY(36px);
	transition: opacity 0.9s ease, transform 0.9s ease;
	will-change: opacity, transform;
}
.te-fade.is-visible {
	opacity: 1;
	/* `none` (not translateY(0)) + releasing will-change: a lingering
	   transform/composited layer breaks iOS touch hit-testing inside
	   descendant iframes — the YouTube player's controls go dead. */
	transform: none;
	will-change: auto;
}
@media (prefers-reduced-motion: reduce) {
	.te-fade { opacity: 1; transform: none; transition: none; }
}

/* Industry marquee */
@keyframes te-marquee-scroll {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}
.marquee-track {
	animation: te-marquee-scroll 28s linear infinite;
}
.marquee-track.is-paused {
	animation-play-state: paused;
}

/* Logo tint (navy duotone) — matches the Escoffier industry-strip treatment. */
.te-emp-logo {
	filter: brightness(0) saturate(100%) invert(25%) sepia(15%) saturate(600%) hue-rotate(185deg) brightness(90%);
	object-fit: contain;
}

/* Per-element fade stagger. */
.te-pica-metric:nth-child(1) { transition-delay: 0ms; }
.te-pica-metric:nth-child(2) { transition-delay: 110ms; }
.te-pica-metric:nth-child(3) { transition-delay: 220ms; }
.te-pica-metric:nth-child(4) { transition-delay: 330ms; }
.te-pica-metric:nth-child(5) { transition-delay: 440ms; }
.te-pica-delay-80  { transition-delay: 80ms; }
.te-pica-delay-120 { transition-delay: 120ms; }
.te-pica-delay-160 { transition-delay: 160ms; }
.te-pica-delay-200 { transition-delay: 200ms; }

/* ── 1. HERO ── */
.te-pica-hero { min-height: 90vh; background: #0d1f3c; }
/* Image anchored to the right, bleeding off-edge — matches Escoffier exactly.
   Mostly full color; only its far-left edge fades (mask), and the navy overlay
   below sits over the left portion. */
/* Media wrapper hard-clips the zoomed photo (About-page pattern), so the
   visible hero height never changes no matter how far the image is zoomed. */
.te-pica-hero__media { position: absolute; inset: 0; overflow: hidden; }
.te-pica-hero__img {
	/* Full-bleed cover under a light scrim — matches the homepage/About heroes
	   (was: right-anchored photo with a near-solid navy left half). */
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* Landscape master (2390x1792): hat tops at 32% of image height, chins
	   at 57%, group spans 24.5-78% of image width. Cover alone shows the
	   full image width on desktop with the students centered behind the
	   copy, so zoom 1.28x pinned to the LEFT edge: the visible band ends
	   right at the group's right edge (78%), pushing the students into the
	   right ~70% of the window and their faces (from ~39% of viewport
	   width) clear of the logo chip and copy column — the Escoffier
	   arrangement. Origin-Y 64% keeps hats upper-middle with headroom
	   across 1280-1920; don't raise the zoom past ~1.3 or the rightmost
	   student's arm clips off-screen. User-approved as-is (pants stay out
	   of frame at standard desktop shapes; the visible bottom is ~78-82%
	   of image height vs pants at 85%). */
	object-position: center 50%;
	transform: scale(1.28);
	transform-origin: 0 64%;
	max-width: none;
}
.te-pica-hero__overlay {
	background: linear-gradient(90deg, rgba(13,31,60,0.8) 0%, rgba(13,31,60,0.62) 38%, rgba(13,31,60,0.5) 54%, rgba(13,31,60,0) 64%);
}
.te-pica-hero__title {
	font-family: "DM Serif Display", serif;
	font-size: 64px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: 0;
	text-shadow: 0 1px 12px rgba(0,0,0,0.55), 0 2px 32px rgba(0,0,0,0.35);
}
.te-pica-hero__lede {
	/* Real width cap (the markup's max-w-xl never applies — undeclared
	   variable); 44rem matches the AEGS/Gecko hero sub in brand.css. */
	max-width: 44rem;
	font-family: Inter, system-ui, sans-serif;
	font-weight: 500;
	font-size: 24px;
	line-height: 39px;
	letter-spacing: 0;
	color: #E5E7EB;
	position: relative;
	text-shadow: 0 1px 12px rgba(0,0,0,0.55), 0 2px 32px rgba(0,0,0,0.35);
}
/* Orange accent bar: spans the text's visual height at any line count. */
.te-pica-hero__lede::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.3em;
	bottom: 0.3em;
	width: 4px;
	background: #2263C5;
}

/* AA orange button: overrides the markup's bg-[#FF6900]/hover (white label 4.88:1). */
.te-pica-btn-orange { background: #BF4E00; color: #ffffff; }
.te-pica-btn-orange:hover { background: #A84600; }
/* Outline button (CTA secondary). */
.te-pica-btn-outline { border-color: #BF4E00; color: #BF4E00; } /* AA on white (4.88:1) */
.te-pica-btn-outline:hover { background: rgba(255, 105, 0, 0.06); }

/* Shared wave dividers. Purely decorative and layered above content (z-20) —
   never intercept clicks/selection. */
.te-pica-wave { line-height: 0; pointer-events: none; }
.te-pica-wave__svg { width: 100%; height: 120px; display: block; overflow: visible; } /* fills overshoot the viewBox so edge rows render solid (Safari blend hairlines) */
.te-pica-wave__svg--90 { height: 90px; }
.te-pica-wave__svg--100 { height: 100px; }

/* ── 2. KEY METRICS ── */
/* The wrapper overlaps the hero footnote (-mt-14, z-30): let clicks/selection
   pass through its transparent area; the card itself stays interactive. */
.te-pica-metrics-wrap { pointer-events: none; }
.te-pica-metrics { pointer-events: auto; }
.te-pica-metric__num {
	font-family: "DM Serif Display", serif;
	font-weight: 400;
	font-size: 75px;
	line-height: 60px;
	color: #EF6200; /* AA large text on white (3.27:1) */
}
.te-pica-metric__label { color: #0d1f3c; }

/* ── 3. OUR TRADITION ── */
.te-pica-heritage { background: #0d1f3c; min-height: 70vh; margin-top: 0; }
/* Image stays full color — only the navy overlay below diffuses its left side,
   matching the Escoffier heritage section (whose source photo is already B&W). */
.te-pica-heritage__overlay {
	/* Soft, diffused falloff: fully clear by 85% so the image's right side
	   shows its true color (matches the Escoffier heritage curve). */
	background: linear-gradient(to right, #0d1f3c 0%, rgba(13,31,60,0.97) 8%, rgba(13,31,60,0.88) 16%, rgba(13,31,60,0.74) 25%, rgba(13,31,60,0.58) 34%, rgba(13,31,60,0.42) 43%, rgba(13,31,60,0.28) 52%, rgba(13,31,60,0.16) 61%, rgba(13,31,60,0.07) 70%, rgba(13,31,60,0.02) 78%, rgba(13,31,60,0) 85%);
}
.te-pica-heritage__inner { min-height: 70vh; }
.te-pica-eyebrow { color: #FF6900; }
.te-pica-heritage__h2 {
	font-family: "DM Serif Display", serif;
	font-weight: 400;
	font-size: 48px;
}

/* ── PARTNERSHIPS ── */
.te-pica-partners { background: #F8F6F3; }
.te-pica-partners__h2 {
	font-family: "DM Serif Display", serif;
	font-weight: 400;
	color: #0d1f3c;
	font-size: 36px;
}
.te-pica-partners__p { font-size: 17px; }
.te-pica-partners__list {
	list-style: disc;
	padding-left: 1.25rem;
	color: #4B5563;
	font-size: 16px;
	line-height: 1.7;
}
.te-pica-partners__list li { margin-bottom: 0.15rem; }

/* Four square partner cards (2×2). Padding matches Escoffier's p-7 (1.75rem),
   set here because Tailwind's pre-compiled app.css doesn't include p-6. */
.te-pica-partner-card { box-shadow: 0 4px 24px rgba(26,35,50,0.08); padding: 1.75rem; }
.te-pica-partner-logo-wrap {
	height: 46px;
	display: flex;
	align-items: center;
}
.te-pica-partner-logo {
	object-fit: contain;
	object-position: left center;
	max-width: 100%;
}
.te-pica-partner-logo--ducasse { height: 42px; }
.te-pica-partner-logo--roches  { height: 32px; }
.te-pica-partner-logo--glion   { height: 30px; }
.te-pica-partner-logo--caas    { height: 40px; }
.te-pica-flag { object-fit: contain; flex-shrink: 0; }
.te-pica-flag--france { height: 26px; width: 26px; }
.te-pica-flag--sm { height: 22px; }

/* ── INDUSTRY STRIP ── */
.te-pica-employers { padding-top: 140px; padding-bottom: 80px; }
.te-pica-employers__h2 {
	font-family: "DM Serif Display", serif;
	font-weight: 400;
	color: #0d1f3c;
	font-size: 36px;
}
.te-pica-employers__badge { font-style: italic; }
/* Capped at the site's 1280px content width; items widened so the unique
   set (5 x 256px = 1280px) fills the window - no logo shows twice at once. */
.te-pica-marquee-wrap { padding-right: 64px; max-width: 1280px; margin-left: auto; margin-right: auto; }
#te-marquee-toggle { cursor: pointer; }
.te-pica-marquee-mask {
	mask-image: linear-gradient(to right, transparent 0%, black 8%, black 88%, transparent 100%);
	-webkit-mask-image: linear-gradient(to right, transparent 0%, black 8%, black 88%, transparent 100%);
}
#te-marquee { width: max-content; }
.te-pica-emp-item { width: 256px; padding: 0 28px; }
.te-pica-employers__note {
	font-family: Inter, system-ui, sans-serif;
	font-size: 12px;
	font-style: italic;
	line-height: 20px;
	color: #6A7282;
}

/* ── QUOTES (leadership + testimonial) ── */
.te-pica-cream { background: #F8F6F3; }
.te-pica-white { background: #ffffff; }
.te-pica-quote-block { padding-top: 48px; padding-bottom: 80px; }
.te-pica-quote-avatar {
	width: 72px;
	height: 72px;
	object-position: center 22%;
	box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
/* Larson leadership avatar — same 72px cover crop as the base, just shifted to
   show his full head (less cut at top) without changing the image size. */
.te-pica-quote-avatar--larson { object-position: 50% 6%; }
.te-pica-quote {
	font-family: Georgia, serif;
	font-size: 30px;
	line-height: 41.3px;
	font-weight: 400;
	font-style: italic;
	color: #1A2332;
}
.te-pica-quote-name {
	font-family: Inter, system-ui, sans-serif;
	font-weight: 700;
	font-size: 16px;
	line-height: 24px;
	color: #1A2332;
}
.te-pica-quote-role {
	font-family: Inter, system-ui, sans-serif;
	font-weight: 600;
	font-size: 14px;
	line-height: 20px;
	color: #1A2332;
	letter-spacing: 0.01em;
}

/* Testimonial block. Bonetti's headshot is a centered square close-up, so the
   avatar uses a plain centered crop (no scale). */
.te-pica-testi-block { padding-top: 80px; padding-bottom: 72px; }
.te-pica-testi-note {
	font-family: Inter, system-ui, sans-serif;
	font-size: 12px;
	font-style: italic;
	line-height: 16px;
	color: #6A7282;
}
.te-pica-divider-cream { background: #F8F6F3; line-height: 0; }
.te-pica-divider-white { background: #ffffff; line-height: 0; }

/* ── VIDEO GALLERY ── */
.te-pica-video-section {
	background: #0d1f3c;
	background-image: repeating-linear-gradient(160deg, rgba(255,255,255,0.045) 0px, rgba(255,255,255,0.045) 1px, transparent 1px, transparent 32px);
}
.te-pica-video__h2 {
	font-family: "DM Serif Display", serif;
	font-weight: 400;
}
.te-pica-video__play { background: rgba(255,255,255,0.75); }
.te-pica-video__caption { font-family: Inter, system-ui, sans-serif; }

/* ── CTA ── */
.te-pica-cta__h2 {
	font-family: "DM Serif Display", serif;
	font-weight: 400;
	line-height: 1.25;
	color: #003366;
}
.te-pica-cta__brands-link { color: #0d1f3c; }
.te-pica-cta__brands-link:hover { text-decoration: underline; }

/* ─────────────────────────────────────────────────────────────
   Mobile-first responsive: the base rules above target desktop
   (Figma 1440); scale type/layout down on narrow viewports.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 1023px) {
	.te-pica-hero__title { font-size: 44px; line-height: 50px; }
	.te-pica-hero__lede { font-size: 19px; line-height: 30px; }
	.te-pica-hero__overlay {
		background: linear-gradient(to bottom, rgba(13,31,60,0.85) 0%, rgba(13,31,60,0.78) 100%);
	}
	.te-pica-metric__num { font-size: 52px; line-height: 48px; }
	/* Slimmer cell padding so each claim label line fits without extra wrapping;
	   flat white band at these widths (desktop keeps the floating card). */
	.te-pica-metrics { border-radius: 0; box-shadow: none; }
	.te-pica-metric .px-7 { padding-left: 10px; padding-right: 10px; }
	/* Our Tradition: photo becomes a full-width, full-color banner above the
	   copy (About-page pattern) — no wash over the image (client rule). */
	.te-pica-heritage { min-height: 0; }
	.te-pica-heritage__media { position: static; width: 100%; height: 380px; opacity: 1; }
	.te-pica-heritage__overlay { display: none; }
	.te-pica-heritage__inner { min-height: 0; }
	.te-pica-heritage__inner > .max-w-7xl { padding: 40px 24px 96px; }
	.te-pica-heritage__h2 { font-size: 34px; }
	.te-pica-partners__h2 { font-size: 28px; }
	.te-pica-employers__h2,
	.te-pica-cta__h2 { font-size: 28px; }
	.te-pica-quote { font-size: 23px; line-height: 33px; }
}

/* Mobile/tablet hero: full-color banner (no overlay — client rule), copy
   below on white in navy type. Desktop keeps the overlaid composition. */
@media (max-width: 1023.98px) {
	.te-pica-hero { min-height: 0; background: #ffffff; display: block; }
	/* Banner: fixed 460px height (consistent with the other hero banners); the
	   overflow-hidden wrapper clips the zoom so the counter strip at the
	   image's bottom can never show and the box never grows. */
	/* Landscape master: phones fit the image's full height, so the zoom is
	   what crops it. 1.35x about the group's center (X 51%) fills the
	   banner with faces (~157px tall vs ~130px at the old 1.12x). Origin-Y
	   38% is the pants ceiling: bottom crop lands at 83.9% of image height
	   vs pants entering at 85% — raising it past 38% shows pants. Hat tops
	   land at ~137px, 33px clear of the 240x80 logo chip (bottom edge
	   104px). The cost of this zoom is the outer students' arms: ~10px
	   shaved each side at 390px, more on narrower phones — faces all stay
	   in frame down to 320px. */
	.te-pica-hero__media { position: relative; height: 460px; overflow: hidden; }
	.te-pica-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: 100%; object-fit: cover; object-position: 51% 50%; transform: scale(1.35); transform-origin: 51% 38%; mask-image: none; -webkit-mask-image: none; }
	.te-pica-hero__overlay { display: none; }
	.te-pica-hero .py-32 { padding-top: 40px; padding-bottom: 56px; }
	.te-pica-hero__title { color: #003366; text-shadow: none; }
	.te-pica-hero__lede { color: #364153; text-shadow: none; }
	.te-pica-hero__footnote { color: #6a7282; text-shadow: none; }
	.te-pica-hero__footnote a { color: inherit; }
	/* Copy sits on white below the banner here — no over-photo shadows needed. */
	.te-pica-hero .te-pica-btn-orange { box-shadow: none; }
	/* The hero's white wave is invisible on the white banner background and
	   slices into the button/copy — hide it at these widths. */
	.te-pica-hero .te-pica-wave { display: none; }
}
@media (min-width: 768px) and (max-width: 1023.98px) {
	.te-pica-hero__media { height: 560px; }
	/* Deeper zoom than phones — tablets are near the image's own 4:3, so
	   cover barely crops and the students read small without it. Both
	   origin bounds are load-bearing: pants enter at 85% of image height
	   (origin-Y above ~37% shows them at 768px), and at the 1023px end
	   cover hides more image top, so lower origins push the hat tops up
	   under the 104px logo chip (33% leaves ~16px of clearance there;
	   hats sit at ~172px at 768). Bottom crop lands at 70-77% of image
	   height — mid-apron, no pants. */
	.te-pica-hero__img { transform: scale(1.5); transform-origin: 51% 33%; }
	.te-pica-heritage__media { height: 460px; }
	/* 5-across metric cells are narrow here: drop the designed two-line label
	   split and wrap naturally, balanced, so no word strands on its own line. */
	.te-pica-metric__label br { display: none; }
	.te-pica-metric__label { text-wrap: balance; }
}

/* Our Tradition, narrow desktop: the student sits in the left half of the
   source photo, so a left-anchored crop places her at the right of the frame —
   where the gradient is lightest and clear of the text column. Full desktop
   (≥1320px) keeps the original centered crop. */
@media (min-width: 1024px) and (max-width: 1319.98px) {
	.te-pica-heritage__img { object-position: 25% center; }
	/* (The old hero's narrow-desktop 1.45x counter-strip zoom was removed
	   with the photo swap — the students image covers cleanly.) */
}

/* CTA: when the buttons stack, the column shrink-wraps to the widest button
   (the orange one) and Contact Triumph stretches to match its width. */
@media (max-width: 639.98px) {
	.te-pica-cta__actions { display: inline-flex; align-items: stretch; }
	.te-pica-cta__actions > a { justify-content: center; }
}

/* Video gallery below desktop: 2-up with the 3rd centered beneath (640-1023px)
   so the cards stay small enough to avoid pixelated thumbnails; 1-up on phones.
   Wider row gap separates the stacked rows (caption-to-next-video breathing room). */
@media (max-width: 1023.98px) {
	.te-pica-video-grid { row-gap: 40px; }
}
@media (min-width: 640px) and (max-width: 1023.98px) {
	.te-pica-video-grid { grid-template-columns: repeat(2, 1fr); }
	.te-pica-video-grid > *:last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; width: calc(50% - 8px); }
}

/* ── GLOBAL PARTNERSHIPS cards ── */
/* The flags + country-name row wraps when the name runs out of room, instead
   of the name overflowing past the card edge (no effect when it fits). */
.te-pica-partner-card .flex.items-center { flex-wrap: wrap; }
/* Mobile: one card per row (matches the Escoffier partner column). */
@media (max-width: 767.98px) {
	.te-pica-partners .grid-cols-2 { grid-template-columns: 1fr; }
}

/* Real 48rem cap on the quote blocks — the markup's max-w-3xl never applies
   (undeclared variable); matches the AEGS/Gecko quote width. */
.te-pica-quote-block { max-width: 48rem; }

/* ── WCAG AA orange pass ── */
.te-pica-partners .te-pica-eyebrow { color: #BF4E00; } /* cream + white cards (4.52:1) */
.te-pica-employers__badge { background: #EF6200; } /* white label is large text, 3.27:1 */

/* Mobile: long centered paragraphs left-justify (site-wide pattern). */
@media (max-width: 767.98px) {
	.te-pica-testi-note { text-align: left; }
}

/* Mobile: partner-card body text steps up (site-wide card pattern). */
@media (max-width: 767.98px) {
	.te-pica-partner-card .text-sm { font-size: 16px; line-height: 1.6; }
}

/* Mobile: below-banner hero H1 matches the homepage's 32px (site-wide). */
@media (max-width: 767.98px) {
	.te-pica-hero__title { font-size: 32px; line-height: 1.15; }
}

/* Tablet: H1 steps to the site's 56px ladder (homepage/About/Gecko/AEGS)
   instead of holding the ≤1023 44px. */
@media (min-width: 768px) and (max-width: 1023.98px) {
	.te-pica-hero__title { font-size: 56px; line-height: 62px; }
}

/* Below-banner layouts (mobile + tablet, ≤1023): the brand logo floats
   back over the banner's upper-left in its white desktop chip, left-aligned
   with the header logo (24px). The copy container goes static so the chip
   anchors to the section (its z-10 stacking was only for the desktop
   overlay, hidden here). */
@media (max-width: 1023.98px) {
	.te-pica-hero .py-32 { position: static; }
	.te-pica-hero__logo-wrap { position: absolute; top: 24px; left: 24px; z-index: 20; margin: 0; }
}

/* Mobile: hero lede matches the homepage lede (18px/1.55); H2s match the
   homepage section headings (30px) — site-wide pass. */
@media (max-width: 767.98px) {
	.te-pica-hero__lede { font-size: 18px; line-height: 1.55; }
	.te-pica-heritage__h2,
	.te-pica-partners__h2,
	.te-pica-video__h2,
	.te-pica-cta__h2 { font-size: 30px; line-height: 1.15; }
	/* Edge case: the marquee heading runs looser than the 1.15 pass so the
	   orange badge clears the wrapped line below — 1.35 matches Gecko/AEGS
	   exactly (native leading differed subtly). */
	.te-pica-employers__h2 { font-size: 30px; line-height: 1.35; }
}

/* Mobile: claims labels drop their designed two-line <br> split and wrap
   balanced instead (mirrors the tablet rule); the employer-marquee footnote
   joins the 16px disclaimer leading. */
@media (max-width: 767.98px) {
	.te-pica-metric__label br { display: none; }
	.te-pica-metric__label { text-wrap: balance; }
	/* Disclaimers/footnotes step from 12px to 13px (site-wide legibility
	   floor; tightened ~1.3 leading preserved). */
	.te-pica-testi-note,
	.te-pica-employers__note { font-size: 13px; line-height: 17px; }
}

/* All levels (iPad landscape is 1024px — desktop layout — and hidpi
   desktops can blend too): -1px overlaps kill the subpixel hairlines at
   section junctions — the heritage media's top edge, plus the blend row at
   the BOTTOM edge of each section-closing wave svg (each following section
   pulls up over it). The 1px is invisible in every layout. */
.te-pica-heritage__media { margin-top: -1px; }
.te-pica-partners,
.te-pica-video-section,
.te-pica-white { margin-top: -1px; }

/* Mobile: tighter section rhythm — halve the white below the claims card,
   the cream above "Global Partnerships", the cream below the partner cards
   (above the marquee heading), the white below the logos, and the cream
   around the two quote avatars (above Jack's / above Lorenzo's). */
@media (max-width: 767.98px) {
	.te-pica-metrics-wrap { margin-bottom: 40px; }
	.te-pica-partners { padding-top: 48px; padding-bottom: 72px; }
	.te-pica-employers { padding-bottom: 40px; }
	.te-pica-quote-block { padding-top: 24px; padding-bottom: 40px; }
	/* Halve the navy above the video-gallery heading (site-wide pattern). */
	.te-pica-video-section { padding-top: 56px; }
	/* Narrow window: slimmer logo cells so 2+ logos show at once, plus a
	   faster loop so the next one isn't a wait. */
	.te-pica-emp-item { width: 176px; padding: 0 16px; }
	.marquee-track { animation-duration: 21s; }
}

/* Mobile: claims card — slimmer side padding + a real gutter between two
   truly equal columns (minmax(0,1fr) stops long numbers forcing their
   column wider and shoving the other into the edge); numbers step to 44px
   so they fit their half; larger labels (matches Escoffier). */
@media (max-width: 767.98px) {
	.te-pica-metrics { padding-left: 16px; padding-right: 16px; }
	.te-pica-metrics .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
	/* Odd claim count: the leftover last claim spans both columns, centered,
	   instead of orphaning bottom-left. */
	.te-pica-metrics .grid-cols-2 > :last-child:nth-child(odd) { grid-column: 1 / -1; }
	.te-pica-metric__num { font-size: 48px; }
	.te-pica-metric__label { font-size: 13px; }
}

/* Mobile: partnership cards bleed 16px into the section's 32px side padding
   (cards only — the section's own copy keeps its margins) with slightly
   larger country names; halve the dead space above the employer-marquee
   heading; larger testimonial headshots; halve the space below "View All
   Triumph Brands". */
@media (max-width: 767.98px) {
	.te-pica-partner-card { margin-left: -16px; margin-right: -16px; }
	.te-pica-partner-card .te-pica-eyebrow { font-size: 13px; }
	/* Full-width cards here — logos/flags match the Escoffier card scale
	   (the smaller base sizes only exist for desktop's 2-across grid). */
	.te-pica-partner-logo--ducasse { height: 48px; }
	.te-pica-partner-logo--roches { height: 40px; }
	.te-pica-partner-logo--glion { height: 36px; }
	.te-pica-partner-logo--caas { height: 48px; }
	.te-pica-flag--france { height: 28px; width: 28px; }
	.te-pica-flag--sm { height: 24px; }
	.te-pica-employers { padding-top: 70px; }
	.te-pica-quote-avatar { width: 88px; height: 88px; }
	.te-pica-white.pb-40 { padding-bottom: 80px; }
	.te-pica-cta__brands-link { font-size: 16px; }
	.te-pica-cta__brands-link svg { width: 18px; height: 18px; }
}