/* FILE: freelancer.css | VERSION: 1 | DATE: 2026-10-25 | HEYVN Freelancer.
   Shared native controls/cards remain canonical. Logical geometry supports all four locales. */
.freelancer-page { --freelance-space: clamp(2rem,5vw,4rem); }
.freelancer-page p:not(.eyebrow):not(.freelancer-studio-heading):not(.freelancer-studio-footer) { text-align: justify; text-align-last: start; }
.freelancer-hero { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,.8fr); gap: clamp(2rem,5vw,5rem); align-items: center; padding-block: var(--freelance-space); }
.freelancer-hero-copy h1 { margin: .8rem 0 1.5rem; max-width: 14ch; font-size: clamp(2.8rem,5.6vw,5.8rem); font-weight: 780; line-height: 1.04; letter-spacing: -.055em; }
.freelancer-hero-copy h1 span { display: block; color: var(--heyvn-primary); }
.freelancer-lead { max-width: 40rem; font-size: 1.13rem; line-height: 1.8; color: var(--heyvn-muted); }
.freelancer-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-block: 1.75rem 1rem; }
.freelancer-page .freelancer-actions > .heyvn-button { flex: 1 1 13rem; inline-size: 100%; }
.freelancer-note { max-width: 40rem; font-size: .85rem; line-height: 1.7; color: var(--heyvn-muted); }
.freelancer-studio { position: relative; overflow: hidden; min-width: 0; padding: clamp(1.5rem,3vw,2.5rem); border-radius: 1.7rem; color: var(--heyvn-surface); background: var(--heyvn-navy); box-shadow: 0 24px 60px rgba(var(--heyvn-navy-rgb),.16); }
.freelancer-studio::after { content: ''; position: absolute; width: 18rem; height: 18rem; border: 1px solid rgba(var(--heyvn-surface-rgb),.14); border-radius: 50%; inset-inline-end: -9rem; inset-block-end: -9rem; pointer-events: none; }
.freelancer-studio-top { display: flex; gap: .6rem; align-items: center; font-size: .8rem; }
.freelancer-studio-top > :last-child { margin-inline-start: auto; font-size: 1.3rem; }
.freelancer-studio-dot { width: .5rem; height: .5rem; border-radius: 50%; background: var(--heyvn-soft-strong); }
.freelancer-mark { display: block; width: 100%; height: auto; max-height: 13rem; margin-block: 1.25rem; color: var(--heyvn-soft-strong); }
.freelancer-studio-heading { position: relative; margin: 0 0 1.5rem; font-size: clamp(1.8rem,3vw,2.6rem); font-weight: 700; line-height: 1.16; letter-spacing: -.025em; }
.freelancer-studio-tags { display: flex; flex-wrap: wrap; gap: .4rem; }
.freelancer-studio-tags span { border: 1px solid rgba(var(--heyvn-surface-rgb),.3); border-radius: 2rem; padding: .35rem .7rem; font-size: .75rem; }
.freelancer-studio-footer { margin-block: 2rem 0; font-size: .75rem; color: var(--heyvn-light-text); }
.freelancer-page .market-section { padding-block: var(--freelance-space); }
.freelancer-fields { border-block-start: 1px solid var(--heyvn-line); }
.freelancer-field-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.freelancer-field { margin: 0; padding: 1.5rem; border: 1px solid var(--heyvn-line); border-radius: 1rem; box-shadow: none; background: var(--heyvn-surface); }
.freelancer-field-number { display: block; margin-block-end: 1.5rem; color: var(--heyvn-primary); font-size: .85rem; font-variant-numeric: tabular-nums; }
.freelancer-field h3 { margin: 0 0 .6rem; font-size: 1.2rem; }
.freelancer-field p { margin: 0; color: var(--heyvn-muted); line-height: 1.8; font-size: .95rem; }
.freelancer-process { border-block: 1px solid var(--heyvn-line); }
.freelancer-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 2rem; padding: 0; margin: 2rem 0 0; list-style: none; counter-reset: freelance-step; }
.freelancer-steps li { counter-increment: freelance-step; }
.freelancer-steps li::before { content: '0' counter(freelance-step); display: block; color: var(--heyvn-primary); font-weight: 750; padding-block-end: 1.2rem; border-block-end: 2px solid var(--heyvn-soft-strong); }
.freelancer-steps h3 { margin-block: 1.2rem .65rem; font-size: 1.2rem; }
.freelancer-steps p { margin: 0; line-height: 1.85; color: var(--heyvn-muted); }
.freelancer-empty { padding: 2rem; border: 1px dashed var(--heyvn-line-strong); border-radius: 1rem; background: var(--heyvn-soft); }
.freelancer-empty p { max-width: 48rem; margin-block: 0 1.25rem; line-height: 1.8; }
.freelancer-client { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: clamp(1.5rem,4vw,3rem); background: var(--heyvn-soft); border-radius: 1.3rem; }
.freelancer-client > div { max-width: 46rem; }
.freelancer-client h2 { margin-block: .5rem 1rem; font-size: clamp(1.7rem,3.4vw,2.8rem); line-height: 1.15; letter-spacing: -.035em; }
.freelancer-client p:not(.eyebrow) { margin: 0; line-height: 1.8; color: var(--heyvn-muted); }
.freelancer-client > .heyvn-button { flex-shrink: 0; }
.freelancer-faq { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.6fr); gap: 3rem; }
.freelancer-faq > h2 { margin: 0; font-size: clamp(2rem,3.5vw,3rem); line-height: 1.15; letter-spacing: -.035em; }
.freelancer-faq section { padding-block: 0 1.5rem; margin-block-end: 1.5rem; border-block-end: 1px solid var(--heyvn-line); }
.freelancer-faq h3 { margin: 0 0 .8rem; font-size: 1.05rem; }
.freelancer-faq p { margin: 0; line-height: 1.85; color: var(--heyvn-muted); }
.freelancer-final { margin-block-end: var(--freelance-space); padding: clamp(2rem,5vw,4rem); border-radius: 1.4rem; background: var(--heyvn-soft-strong); }
.freelancer-final h2 { max-width: 25ch; margin-block: .75rem 1rem; font-size: clamp(2rem,4vw,3.4rem); line-height: 1.1; letter-spacing: -.04em; }
.freelancer-final p:not(.eyebrow) { max-width: 45rem; margin-block: 0 1.5rem; line-height: 1.8; }
[dir="rtl"] .freelancer-hero-copy h1,[dir="rtl"] .freelancer-studio-heading { letter-spacing: normal; }
@media (max-width: 900px) { .freelancer-hero { grid-template-columns: minmax(0,1fr) minmax(0,.8fr); gap: 1.5rem; } .freelancer-actions { flex-direction: column; } .freelancer-page .freelancer-actions > .heyvn-button { flex: 0 0 auto; } .freelancer-client { align-items: start; flex-direction: column; } }
@media (max-width: 640px) { .freelancer-hero,.freelancer-faq { grid-template-columns: minmax(0,1fr); gap: 2rem; } .freelancer-hero-copy h1 { max-width: 17ch; font-size: clamp(2.7rem,11vw,3.8rem); } .freelancer-studio { border-radius: 1.2rem; } .freelancer-mark { max-height: 9rem; } .freelancer-field-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: .65rem; } .freelancer-field { padding: 1rem; } .freelancer-field h3 { font-size: 1.05rem; } .freelancer-steps { grid-template-columns: minmax(0,1fr); gap: 1.5rem; } .freelancer-steps li::before { padding-block-end: .7rem; } .freelancer-page .freelancer-final .heyvn-button,.freelancer-page .freelancer-empty .heyvn-button,.freelancer-page .freelancer-client > .heyvn-button { inline-size: 100%; } }
@media (max-width: 360px) { .freelancer-field-grid { grid-template-columns: minmax(0,1fr); } }
