/* =====================================================================
   Section design + cartoon animations for the home page cards
   ===================================================================== */

/* ---------- section backdrops: soft blobs + floating leaves ---------- */
.section--deco { position: relative; }
.section--deco::before, .section--deco::after {
  content: ""; position: absolute; border-radius: 50%; pointer-events: none; z-index: 0; filter: blur(2px);
  animation: blob 14s ease-in-out infinite alternate;
}
.section--deco::before { width: 420px; height: 420px; left: -160px; top: -120px; background: radial-gradient(circle, rgba(246,177,60,.28), transparent 65%); }
.section--deco::after  { width: 520px; height: 520px; right: -200px; bottom: -200px; background: radial-gradient(circle, rgba(198,93,46,.18), transparent 65%); animation-delay: -7s; }
.leaf { position: absolute; z-index: 0; pointer-events: none; width: 34px; height: 34px; opacity: .55; animation: leafFloat 9s ease-in-out infinite; }
.leaf svg { width: 100%; height: 100%; }
.leaf--1 { left: 6%; top: 18%; } .leaf--2 { right: 8%; top: 12%; animation-delay: -3s; width: 26px; height: 26px; } .leaf--3 { left: 12%; bottom: 10%; animation-delay: -6s; width: 22px; height: 22px; }

/* ---------- service cards with illustrations ---------- */
.cards { gap: 26px; }
.card { padding: 26px 24px 28px; border: 2px solid var(--line); border-radius: 28px; }
.card { overflow: hidden; padding: 0 0 26px; border: 0; box-shadow: 0 18px 50px rgba(43,33,23,.12); }
.card > h3, .card > p { padding: 0 24px; }
.card > h3 { margin-top: 20px; }
.card__media { position: relative; height: 190px; background: #120f2a; display: flex; align-items: flex-end; padding: 18px; }
.card__media .mini { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.section--live { position: relative; }
.section--live .bg-scene { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
.section--live > .wrap { position: relative; z-index: 1; }
.section--live::before, .section--live::after { display: none; }
.card__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(1,5,45,0) 55%, rgba(1,5,45,.45) 100%); pointer-events: none; }
.card__media--cash { background: linear-gradient(135deg, #0b1050, #2a2a5a 60%, #c65d2e); }
.card__media--send { background: linear-gradient(135deg, #060a2e, #1f5fa8 70%, #9cc8f3); }
.card__media--bill { background: linear-gradient(135deg, #3a2c5e, #c65d2e 65%, #f6b13c); }
.card__media--travel { background: linear-gradient(135deg, #1c1b4a, #8b4d7a 60%, #f08a5d); }
.card__media[style] { background-image: var(--none); }
.card__badge { position: relative; z-index: 1; width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; background: rgba(255,255,255,.14); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.28); color: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.25); transition: transform .35s var(--ease), background .3s; }
.card__badge .ico { width: 28px; height: 28px; }
.card:hover .card__badge { transform: translateY(-4px) scale(1.06); background: var(--orange); border-color: var(--orange); }
.card:hover .card__media { background-position: center 40%; }
.card__media { transition: background-position 1.2s var(--ease); }
.card::before { display: none; }

/* ---------- our motto ---------- */
.motto { position: relative; background: var(--navy); color: #fff; padding: clamp(72px, 9vw, 120px) 0; overflow: hidden; }
.motto::before { content: ""; position: absolute; inset: 0; background: radial-gradient(60% 80% at 80% 20%, rgba(243,146,33,.22), transparent 60%), radial-gradient(50% 60% at 10% 90%, rgba(62,124,58,.25), transparent 60%); pointer-events: none; }
.motto__photo { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .22; mix-blend-mode: luminosity; pointer-events: none; }
.motto__grid { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.motto .kicker { color: var(--sun); }
.motto__title { color: #fff; font-size: clamp(2.2rem, 4.4vw, 3.6rem); line-height: 1.08; margin-bottom: .5em; }
.motto__text { font-size: 1.2rem; line-height: 1.7; color: rgba(255,255,255,.82); max-width: 560px; margin: 0; }
.pillars { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.pillar { display: grid; grid-template-columns: 56px 1fr; gap: 18px; align-items: start; padding: 22px 24px; border-radius: 22px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); transition: transform .35s var(--ease), background .3s, border-color .3s; }
.pillar:hover { transform: translateX(6px); background: rgba(255,255,255,.1); border-color: rgba(243,146,33,.5); }
.pillar__icon { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; background: rgba(243,146,33,.18); color: var(--sun); }
.pillar__icon .ico { width: 28px; height: 28px; }
.pillar__num { display: block; font-family: var(--font-head); font-weight: 800; font-size: 1.6rem; color: var(--sun); line-height: 1; margin-bottom: 4px; }
.pillar h3 { color: #fff; font-size: 1.15rem; margin-bottom: 4px; }
.pillar p { margin: 0; color: rgba(255,255,255,.75); font-size: .98rem; }
@media (max-width: 900px) { .motto__grid { grid-template-columns: 1fr; } }
.illo { width: 150px; height: 150px; overflow: visible; }
.card:hover .illo { animation: wobble .6s ease-in-out; }
.card h3 { font-size: 1.3rem; }
.card:nth-child(1) { --accent: #38D96B; } .card:nth-child(2) { --accent: #F6B13C; } .card:nth-child(3) { --accent: #C65D2E; } .card:nth-child(4) { --accent: #1F5FA8; }
.card::before { content: ""; position: absolute; left: 24px; right: 24px; top: 0; height: 6px; border-radius: 0 0 6px 6px; background: var(--accent, var(--orange)); }
.card::after { display: none; }

/* bouncy entrance */
.reveal--stagger > .card { transform: translateY(40px) scale(.92); transition: opacity .8s var(--ease), transform .9s cubic-bezier(.2,1.4,.4,1); }
.reveal--stagger.is-in > .card { opacity: 1; transform: none; }

/* thumb */
.illo__thumb { transform-box: fill-box; transform-origin: 50% 0; animation: press 2.2s ease-in-out infinite; }
.illo__led { animation: ledBlink 2.2s steps(1) infinite; }
.illo__ring { transform-box: fill-box; transform-origin: center; opacity: 0; animation: ripple 2.2s ease-out infinite; }
.illo__ring--2 { animation-delay: .35s; }
/* send */
.illo__window { animation: windowGlow 2.6s ease-in-out infinite; }
/* bill */
.illo__stamp { transform-box: fill-box; transform-origin: center; animation: stamp 3s cubic-bezier(.2,1.6,.4,1) infinite; }
.illo__paper { transform-box: fill-box; transform-origin: 50% 100%; animation: paperShake 3s ease-in-out infinite; }
.illo__bulb { animation: bulbGlow 3s ease-in-out infinite; }
/* travel */
.illo__bus { transform-box: fill-box; transform-origin: 50% 100%; animation: busBounce .5s ease-in-out infinite alternate; }
.illo__wheel { transform-box: fill-box; transform-origin: center; animation: spin 1s linear infinite; }
.illo__bars rect { transform-box: fill-box; transform-origin: 50% 100%; animation: bars 1.8s ease-in-out infinite; }
.illo__bars rect:nth-child(2) { animation-delay: .2s; } .illo__bars rect:nth-child(3) { animation-delay: .4s; }
.illo__puff { animation: puff 1.2s ease-out infinite; }
/* earn */
.illo__coin { transform-box: fill-box; transform-origin: center; animation: coinDrop 2.4s cubic-bezier(.3,1.5,.5,1) infinite; }
.illo__coins ellipse { transform-box: fill-box; transform-origin: center; animation: squash 2.4s ease-in-out infinite; }

/* ---------- day cards: little animated scenes ---------- */
.day__card { min-height: 320px; }
.day__art { position: absolute; right: 14px; bottom: 12px; width: 84px; height: 84px; opacity: .9; pointer-events: none; }
.day__card p { padding-right: 8px; }
.day__art svg { width: 100%; height: 100%; overflow: visible; }
.day--m .day__art .sun { transform-box: fill-box; transform-origin: center; animation: sunUp 4s ease-in-out infinite alternate; }
.day--m .day__art .rays { transform-box: fill-box; transform-origin: center; animation: spin 30s linear infinite; }
.day--a .day__art .leafy { transform-box: fill-box; transform-origin: 50% 100%; animation: sway 3s ease-in-out infinite alternate; }
.day--e .day__art .flame { transform-box: fill-box; transform-origin: 50% 100%; animation: flame .9s ease-in-out infinite alternate; }
.day--n .day__art .star { animation: twinkle 2.4s ease-in-out infinite; } .day--n .day__art .star:nth-child(2) { animation-delay: -.8s; } .day--n .day__art .star:nth-child(3) { animation-delay: -1.6s; }
.day__card p { position: relative; z-index: 1; }
.day__card::before { display: none; }

/* ---------- shopkeeper points: icons bounce in, wiggle on hover ---------- */
.points__icon { transition: transform .3s var(--ease), background .3s; }
.points li:hover .points__icon { transform: rotate(-8deg) scale(1.1); background: var(--sun); color: var(--navy); }
.points li:hover .points__icon .ico { animation: wobble .6s ease-in-out; }
.steps li::before { transition: transform .3s var(--ease); } .steps li:hover::before { transform: scale(1.15) rotate(-6deg); }

/* ---------- business cards ---------- */
.biz__card .card__icon { transition: transform .35s var(--ease); }
.biz__card:hover .card__icon { transform: rotate(-6deg) scale(1.1); background: var(--sun); color: var(--navy); }

/* ---------- keyframes ---------- */
@keyframes blob      { from { transform: translate(0,0) scale(1); } to { transform: translate(40px,30px) scale(1.15); } }
@keyframes leafFloat { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-22px) rotate(25deg); } }
@keyframes popIn     { 0% { opacity: 0; transform: translateY(40px) scale(.9); } 100% { opacity: 1; transform: none; } }
@keyframes wobble    { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-6deg) scale(1.05); } 75% { transform: rotate(6deg) scale(1.05); } }
@keyframes press     { 0%, 35%, 100% { transform: translateY(-14px); } 50%, 80% { transform: translateY(0); } }
@keyframes ledBlink  { 0%, 45% { fill: #38D96B; opacity: .35; } 50%, 85% { fill: #38D96B; opacity: 1; } }
@keyframes ripple    { 0%, 48% { transform: scale(.4); opacity: 0; } 55% { opacity: .9; } 100% { transform: scale(1.6); opacity: 0; } }
@keyframes windowGlow{ 0%, 70% { fill: #E4D3B6; } 85%, 100% { fill: #FFE08A; } }
@keyframes stamp     { 0%, 55% { transform: scale(2.2) rotate(-25deg); opacity: 0; } 65% { transform: scale(.9) rotate(-8deg); opacity: 1; } 72%, 100% { transform: scale(1) rotate(-8deg); opacity: 1; } }
@keyframes paperShake{ 0%, 62%, 72%, 100% { transform: rotate(0); } 65% { transform: rotate(-2deg); } 68% { transform: rotate(2deg); } }
@keyframes bulbGlow  { 0%, 50% { filter: drop-shadow(0 0 0 rgba(255,224,138,0)); } 70%, 100% { filter: drop-shadow(0 0 10px rgba(255,224,138,.9)); } }
@keyframes busBounce { from { transform: translateY(0); } to { transform: translateY(-3px); } }
@keyframes bars      { 0%, 100% { transform: scaleY(.3); opacity: .4; } 50% { transform: scaleY(1); opacity: 1; } }
@keyframes puff      { 0% { transform: translate(0,0); opacity: 1; } 100% { transform: translate(-14px,-10px); opacity: 0; } }
@keyframes coinDrop  { 0% { transform: translateY(-30px) rotateX(0); opacity: 0; } 30% { opacity: 1; } 60% { transform: translateY(0); } 100% { transform: translateY(0); } }
@keyframes squash    { 0%, 50%, 100% { transform: scale(1); } 62% { transform: scale(1.06, .9); } }
@keyframes sunUp     { from { transform: translateY(10px); } to { transform: translateY(-6px); } }
@keyframes flame     { from { transform: scaleY(1) scaleX(1); } to { transform: scaleY(1.15) scaleX(.9); } }

@media (prefers-reduced-motion: reduce) { .illo *, .day__art *, .leaf, .section--deco::before, .section--deco::after { animation: none !important; } }

/* ---------- more motion across the page ---------- */
.section-head.reveal h2 { opacity: 0; transform: translateY(24px); transition: opacity .8s var(--ease) .1s, transform .8s var(--ease) .1s; }
.section-head.reveal .lead { opacity: 0; transform: translateY(18px); transition: opacity .8s var(--ease) .25s, transform .8s var(--ease) .25s; }
.section-head.reveal.is-in h2, .section-head.reveal.is-in .lead { opacity: 1; transform: none; }
.kicker::before { transform-origin: left; animation: kickerLine 1.2s var(--ease) both; }
.pillar { opacity: 0; transform: translateX(40px); transition: opacity .7s var(--ease), transform .7s var(--ease), background .3s, border-color .3s; }
.pillars.is-in .pillar { opacity: 1; transform: none; }
.pillars.is-in .pillar:nth-child(2) { transition-delay: .15s; } .pillars.is-in .pillar:nth-child(3) { transition-delay: .3s; }
.pillar__num { display: inline-block; animation: numPulse 3s ease-in-out infinite; }
.pillar:nth-child(2) .pillar__num { animation-delay: -1s; } .pillar:nth-child(3) .pillar__num { animation-delay: -2s; }
.pillar__icon { animation: iconFloat 4s ease-in-out infinite; }
.phone { animation: phoneFloat 6s ease-in-out infinite; animation-delay: calc(var(--i) * -1s); }
.phone:hover { animation-play-state: paused; }
.journey__dot { animation: dotPulse 2.4s ease-in-out infinite; }
.journey__step:nth-child(2) .journey__dot { animation-delay: .4s; } .journey__step:nth-child(3) .journey__dot { animation-delay: .8s; } .journey__step:nth-child(4) .journey__dot { animation-delay: 1.2s; } .journey__step:nth-child(5) .journey__dot { animation-delay: 1.6s; }
.points li { opacity: 0; transform: translateX(-40px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.points.is-in li { opacity: 1; transform: none; }
.points.is-in li:nth-child(2) { transition-delay: .12s; } .points.is-in li:nth-child(3) { transition-delay: .24s; } .points.is-in li:nth-child(4) { transition-delay: .36s; }
.points__icon { animation: iconFloat 5s ease-in-out infinite; }
.points li:nth-child(2) .points__icon { animation-delay: -1.2s; } .points li:nth-child(3) .points__icon { animation-delay: -2.4s; } .points li:nth-child(4) .points__icon { animation-delay: -3.6s; }
.steps li::before { animation: stepPop .6s cubic-bezier(.2,1.5,.4,1) both; }
.steps li:nth-child(2)::before { animation-delay: .15s; } .steps li:nth-child(3)::before { animation-delay: .3s; }
.day__card { opacity: 0; transform: translateY(40px) rotate(-1deg); transition: opacity .8s var(--ease), transform .8s cubic-bezier(.2,1.3,.4,1); }
.day.is-in .day__card { opacity: 1; transform: none; }
.day.is-in .day__card:nth-child(2) { transition-delay: .12s; } .day.is-in .day__card:nth-child(3) { transition-delay: .24s; } .day.is-in .day__card:nth-child(4) { transition-delay: .36s; }
.day__time .ico { animation: iconFloat 4s ease-in-out infinite; }
.biz__card { opacity: 0; transform: translateY(40px); transition: opacity .8s var(--ease), transform .8s var(--ease), box-shadow .35s; }
.biz.is-in .biz__card { opacity: 1; transform: none; } .biz.is-in .biz__card:nth-child(2) { transition-delay: .15s; }
.cta-band { background: linear-gradient(120deg, #c65d2e, #e07a3a, #c65d2e, #a54a22); background-size: 300% 300%; animation: ctaGlow 12s ease-in-out infinite; }
.cta-band .btn--light { animation: ctaBtn 2.6s ease-in-out infinite; }
.ribbon__item .ico { animation: iconFloat 3s ease-in-out infinite; }
.footer__langs a { transition: transform .25s var(--ease), background .25s; } .footer__langs a:hover { transform: translateY(-3px); }

@keyframes kickerLine { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes numPulse   { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.06); text-shadow: 0 0 18px rgba(246,177,60,.6); } }
@keyframes iconFloat  { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes phoneFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes dotPulse   { 0%, 100% { box-shadow: var(--shadow), 0 0 0 0 rgba(246,177,60,.5); } 50% { box-shadow: var(--shadow), 0 0 0 12px rgba(246,177,60,0); } }
@keyframes stepPop    { from { transform: scale(0); } to { transform: scale(1); } }
@keyframes ctaGlow    { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes ctaBtn     { 0%, 100% { box-shadow: 0 0 0 0 rgba(255,255,255,.5); } 60% { box-shadow: 0 0 0 14px rgba(255,255,255,0); } }
@media (prefers-reduced-motion: reduce) { .pillar, .points li, .day__card, .biz__card, .section-head.reveal h2, .section-head.reveal .lead { opacity: 1; transform: none; } }
/* ---------- inner pages ---------- */
.page-head { padding-top: clamp(56px, 8vw, 96px); min-height: 60vh; }
.page-head h1 { font-size: clamp(2.2rem, 4.5vw, 3.4rem); }
.page-head__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
.contact { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(28px, 5vw, 64px); align-items: start; }
.contact__form { background: #fff; border-radius: var(--radius); padding: clamp(24px, 4vw, 40px); border: 1px solid var(--line); box-shadow: var(--shadow-lg); }
.contact__form .hp { position: absolute; left: -9999px; }
.field { display: grid; gap: 6px; margin-bottom: 16px; }
.field__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.field label { font-weight: 600; font-size: .95rem; color: var(--ink); }
.field input, .field select, .field textarea { font: inherit; padding: 12px 14px; border-radius: 12px; border: 2px solid var(--line); background: var(--cream); color: var(--ink); transition: border-color .2s, box-shadow .2s; width: 100%; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 4px rgba(243,146,33,.18); background: #fff; }
.contact__status { margin: 14px 0 0; font-weight: 600; min-height: 1.4em; }
.contact__status.is-ok { color: var(--leaf); } .contact__status.is-fail { color: var(--terracotta); }
.contact__info { background: var(--navy); color: #fff; border-radius: var(--radius); padding: clamp(24px, 4vw, 36px); position: sticky; top: 100px; }
.contact__info h2 { color: #fff; font-size: 1.3rem; }
.contact__info ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; }
.contact__info li { display: flex; gap: 12px; align-items: flex-start; }
.contact__info .ico { color: var(--sun); flex: none; }
.contact__info a { color: #fff; font-weight: 600; font-size: 1.05rem; }
@media (max-width: 900px) { .contact { grid-template-columns: 1fr; } .contact__info { position: static; } .field__row { grid-template-columns: 1fr; } }

/* ---------- inner page hero + flow ---------- */
.phero { position: relative; background: var(--navy); color: #fff; overflow: hidden; min-height: 460px; display: flex; align-items: center; }
.phero__scene { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.phero__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(1,5,45,.9) 0%, rgba(1,5,45,.6) 50%, rgba(1,5,45,.2) 100%); }
.phero__inner { position: relative; z-index: 1; padding: clamp(56px, 8vw, 96px) 0; max-width: 720px; }
.phero .kicker { color: var(--sun); }
.phero h1 { color: #fff; font-size: clamp(2.2rem, 4.6vw, 3.6rem); }
.phero .lead { color: rgba(255,255,255,.85); font-size: 1.15rem; }
.phero .btn--outline { color: #fff; border-color: rgba(255,255,255,.7); }
.phero .btn--outline:hover { background: #fff; color: var(--navy); }
.cards--plain .card { padding: 28px 26px; }
.cards--plain .card > h3, .cards--plain .card > p { padding: 0; }
.cards--plain .card > h3 { margin-top: 0; }
.flow { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; counter-reset: none; }
.flow__step { background: #fff; border-radius: var(--radius); padding: 26px 24px; border: 1px solid var(--line); box-shadow: var(--shadow); display: grid; grid-template-columns: 48px 1fr; gap: 14px; align-items: start; opacity: 0; transform: translateY(30px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.flow.is-in .flow__step { opacity: 1; transform: none; }
.flow.is-in .flow__step:nth-child(2) { transition-delay: .12s; } .flow.is-in .flow__step:nth-child(3) { transition-delay: .24s; } .flow.is-in .flow__step:nth-child(4) { transition-delay: .36s; }
.flow__num { width: 48px; height: 48px; border-radius: 50%; background: var(--sun); color: var(--navy); font-family: var(--font-head); font-weight: 800; font-size: 1.3rem; display: grid; place-items: center; }
.flow__step h3 { font-size: 1.1rem; margin-bottom: 4px; }
.flow__step p { margin: 0; color: var(--ink-soft); font-size: .98rem; }
.points--3 { grid-template-columns: repeat(3, 1fr); gap: 24px; }
.points--3 li { grid-template-columns: 54px 1fr; }
@media (max-width: 1100px) { .flow { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .points--3 { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .flow { grid-template-columns: 1fr; } }
/* ---------- FAQ ---------- */
.faq { max-width: 860px; display: grid; gap: 12px; }
.faq__item { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 0 22px; box-shadow: var(--shadow); }
.faq__item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 0; font-family: var(--font-head); font-weight: 700; font-size: 1.08rem; color: var(--navy); }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary .ico { transform: rotate(90deg); transition: transform .3s var(--ease); color: var(--terracotta); flex: none; }
.faq__item[open] summary .ico { transform: rotate(-90deg); }
.faq__item p { margin: 0 0 18px; color: var(--ink-soft); }

/* ---------- legal pages ---------- */
.legal__wrap { display: grid; grid-template-columns: 260px 1fr; gap: 48px; align-items: start; }
.legal__toc { position: sticky; top: 100px; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 20px; box-shadow: var(--shadow); font-size: .92rem; }
.legal__toc strong { display: block; margin-bottom: 10px; color: var(--navy); }
.legal__toc ol { margin: 0; padding-left: 20px; display: grid; gap: 6px; }
.legal__toc a { color: var(--ink-soft); } .legal__toc a:hover { color: var(--terracotta); }
.legal__body h1 { font-size: clamp(2rem, 4vw, 3rem); }
.legal__meta { color: var(--ink-soft); font-size: .9rem; margin-bottom: 28px; }
.legal__section { margin-bottom: 28px; }
.legal__section h2 { font-size: 1.35rem; margin-bottom: .4em; }
.legal__section p, .legal__section li { color: var(--ink); line-height: 1.7; }
.legal__section ul { padding-left: 22px; }
.legal__contact { margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--ink-soft); }
@media (max-width: 900px) { .legal__wrap { grid-template-columns: 1fr; } .legal__toc { position: static; } }

/* ---------- careers ---------- */
.roles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.role { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 26px; box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 10px; transition: transform .3s var(--ease), box-shadow .3s; }
.role:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.role__top { display: flex; align-items: center; gap: 12px; }
.role__avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--navy); color: var(--sun); font-family: var(--font-head); font-weight: 800; display: grid; place-items: center; }
.role__type { font-size: .8rem; font-weight: 700; color: var(--leaf); text-transform: uppercase; letter-spacing: .05em; }
.role h3 { margin: 0; font-size: 1.2rem; }
.role p { margin: 0; color: var(--ink-soft); }
.role__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
.role__tags span { font-size: .78rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--cream-2); color: var(--terracotta); }
.role .btn { align-self: flex-start; margin-top: 8px; }
@media (max-width: 1000px) { .roles { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .roles { grid-template-columns: 1fr; } }