:root {
    /* Color Palette */
    --ink: #202d2b;
    --muted: #6d7874;
    --paper: #f6f3ed;
    --cream: #ebe5d9;
    --white: #fffdfa;
    --coral: #ef765b;
    --yellow: #f7c862;
    --mint: #b9d9c8;
    --lilac: #d8d0e8;
    --line: rgba(32, 45, 43, 0.14);
    --shadow: 0 18px 40px rgba(52, 53, 45, 0.12);
    
    /* Typography */
    --font-serif: Georgia, 'Times New Roman', serif;
    --font-sans: Arial, sans-serif;
    --font-size-xs: 10px;
    --font-size-sm: 11px;
    --font-size-base: 13px;
    --font-size-lg: 16px;
    --font-size-xl: 20px;
    --font-size-2xl: 25px;
    --font-size-3xl: 39px;
    --font-weight-regular: 400;
    --font-weight-bold: 700;
    
    /* Spacing */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 12px;
    --spacing-lg: 16px;
    --spacing-xl: 20px;
    --spacing-2xl: 24px;
    --spacing-3xl: 30px;
    --spacing-4xl: 35px;
    --spacing-5xl: 45px;
    --spacing-6xl: 60px;
    
    /* Border Radius */
    --radius-none: 0;
    --radius-sm: 2px;
    --radius-md: 3px;
    --radius-lg: 4px;
    --radius-full: 50%;
    
    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;
}

/* Skip to content link for accessibility */
.skip-to-content {
    position: absolute;
    top: -9999px;
    left: -9999px;
    z-index: 999;
    padding: 12px 20px;
    background: var(--ink);
    color: var(--white);
    text-decoration: none;
    border-radius: 4px;
    font: 700 13px Arial, sans-serif;
}

.skip-to-content:focus {
    top: 20px;
    left: 20px;
    outline: 2px solid var(--coral);
    outline-offset: 2px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--paper); color: var(--ink); font-family: Georgia, 'Times New Roman', serif; line-height: 1.5; }
button, input, textarea { font: inherit; }
a { color: inherit; text-decoration: none; }
.container, .header-container, .hero, .search-strip, .featured-jobs { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.header { padding: 24px 0; position: relative; z-index: 10; }
.header-container { display: flex; align-items: center; justify-content: space-between; }
.logo { display: flex; align-items: center; gap: 10px; }
.logo-mark { width: 30px; height: 30px; border: 2px solid var(--ink); border-radius: 50%; position: relative; transform: rotate(-30deg); }
.logo-mark span { position: absolute; width: 9px; height: 2px; background: var(--ink); left: 8px; top: 9px; }
.logo-mark span:last-child { top: 15px; left: 12px; width: 6px; }
.logo-text { font-size: 20px; letter-spacing: -0.5px; }
.nav-toggle { display: none; }
.nav-menu ul { display: flex; align-items: center; gap: 30px; list-style: none; font: 600 13px Arial, sans-serif; }
.nav-link { color: var(--muted); transition: color .2s ease; }
.nav-link:hover { color: var(--ink); }
.nav-link:last-child { background: var(--ink); color: var(--white); padding: 11px 17px; border-radius: 4px; }
.hero { min-height: 550px; display: grid; grid-template-columns: .95fr 1.05fr; gap: 45px; align-items: center; padding: 55px 0 75px; }
.hero-copy { animation: reveal .7s ease both; }
.eyebrow { color: var(--coral); font: 700 11px Arial, sans-serif; letter-spacing: 1.7px; text-transform: uppercase; margin-bottom: 20px; }
.hero-title { max-width: 560px; font-size: clamp(48px, 6vw, 76px); font-weight: 400; letter-spacing: -4px; line-height: .98; }
.hero-title em { color: var(--coral); font-style: italic; }
.hero-subtitle { max-width: 450px; color: var(--muted); font: 16px/1.7 Arial, sans-serif; margin: 26px 0 30px; }
.hero-actions { display: flex; align-items: center; gap: 24px; }
.btn { border: 0; border-radius: 3px; cursor: pointer; font: 700 13px Arial, sans-serif; min-height: 48px; padding: 0 22px; transition: transform .2s ease, background .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: var(--coral); color: var(--white); }
.btn-primary:hover { background: #dd624b; }
.btn span { margin-left: 13px; font-size: 17px; }
.text-link { border-bottom: 1px solid var(--ink); font: 700 13px Arial, sans-serif; padding-bottom: 3px; }
.text-link span { margin-left: 8px; }
.hero-proof { align-items: center; color: var(--muted); display: flex; font: 12px Arial, sans-serif; gap: 12px; margin-top: 56px; }
.proof-avatars { display: flex; }
.proof-avatars b { align-items: center; background: var(--yellow); border: 2px solid var(--paper); border-radius: 50%; color: var(--ink); display: flex; font: 700 9px Arial, sans-serif; height: 29px; justify-content: center; margin-left: -6px; width: 29px; }
.proof-avatars b:first-child { margin-left: 0; background: var(--mint); }
.proof-avatars b:last-child { background: var(--lilac); }
.hero-visual { min-height: 410px; position: relative; }
.visual-sun { background: var(--yellow); border-radius: 50%; height: 300px; position: absolute; right: 8%; top: 18px; width: 300px; }
.visual-sun:after { border: 1px solid rgba(32,45,43,.25); border-radius: 50%; content: ''; inset: 18px; position: absolute; }
.job-preview { background: var(--white); box-shadow: var(--shadow); position: absolute; z-index: 2; }
.job-preview-main { border-radius: 3px; left: 8%; padding: 24px; top: 90px; transform: rotate(-4deg); width: min(390px, 80%); }
.job-preview-top, .job-preview-bottom, .role-card-top, .role-card-bottom { align-items: center; display: flex; justify-content: space-between; }
.job-preview-top { color: var(--muted); font: 10px Arial, sans-serif; }
.company-dot { align-items: center; background: var(--coral); border-radius: 50%; color: white; display: flex; height: 27px; justify-content: center; width: 27px; }
.save-icon, .role-bookmark { color: var(--muted); font: 24px Arial, sans-serif; }
.job-preview h3 { font-size: 25px; font-weight: 400; line-height: 1.15; margin: 28px 0 8px; }
.job-preview p, .role-card p { color: var(--muted); font: 12px Arial, sans-serif; }
.job-tags { display: flex; gap: 7px; margin: 26px 0; }
.job-tags span, .role-type { background: #f1eee8; border-radius: 2px; color: var(--muted); font: 10px Arial, sans-serif; padding: 7px 9px; }
.job-preview-bottom { border-top: 1px solid var(--line); padding-top: 16px; }
.job-preview-bottom strong { color: var(--coral); font-size: 20px; font-weight: 400; }
.job-preview-bottom strong span { color: var(--muted); font: 11px Arial, sans-serif; }
.job-preview-bottom > span { color: var(--muted); font: 10px Arial, sans-serif; }
.job-preview-float { align-items: center; border-radius: 50%; bottom: 28px; display: flex; flex-direction: column; height: 145px; justify-content: center; right: 3%; transform: rotate(7deg); width: 145px; }
.float-icon { color: var(--coral); font: 25px Arial, sans-serif; }
.job-preview-float strong { font-size: 20px; margin-top: 4px; }
.job-preview-float small { color: var(--muted); font: 10px Arial, sans-serif; }
.visual-sticker { background: var(--coral); border-radius: 50%; color: var(--white); font: 700 10px/1.15 Arial, sans-serif; height: 80px; padding-top: 28px; position: absolute; right: 10%; text-align: center; top: 12px; transform: rotate(12deg); width: 80px; z-index: 3; }
.search-strip { background: var(--white); box-shadow: 0 10px 30px rgba(52,53,45,.08); display: grid; grid-template-columns: 1fr 1fr auto; margin-bottom: 100px; padding: 13px; }
.search-field { align-items: center; border-right: 1px solid var(--line); display: flex; gap: 13px; padding: 8px 25px; }
.search-field > span { color: var(--coral); font: 30px Arial, sans-serif; }
.search-field small, .search-field strong { display: block; font-family: Arial, sans-serif; }
.search-field small { color: var(--muted); font-size: 10px; margin-bottom: 4px; }
.search-field strong { font-size: 13px; }
.btn-dark { background: var(--ink); color: var(--white); margin-left: 12px; }
.featured-jobs { padding-bottom: 110px; }
.section-heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 30px; }
.section-heading .eyebrow { margin-bottom: 10px; }
.section-heading h2 { font-size: 39px; font-weight: 400; letter-spacing: -1.8px; }
.role-grid { display: grid; gap: 16px; grid-template-columns: repeat(3, 1fr); }
.role-card { background: var(--white); border: 1px solid transparent; min-height: 220px; padding: 22px; transition: transform .2s ease, box-shadow .2s ease; }
.role-card:hover { box-shadow: var(--shadow); transform: translateY(-4px); }
.role-card-featured { border-color: var(--coral); }
.role-logo { align-items: center; border-radius: 50%; display: flex; font: 700 18px Arial, sans-serif; height: 42px; justify-content: center; width: 42px; }
.role-logo-lilac { background: var(--lilac); }.role-logo-yellow { background: var(--yellow); }.role-logo-mint { background: var(--mint); }
.role-card h3 { font-size: 22px; font-weight: 400; margin: 31px 0 7px; }
.role-card p span { padding: 0 4px; }
.role-card-bottom { border-top: 1px solid var(--line); margin-top: 24px; padding-top: 14px; }
.role-card-bottom strong { font: 700 12px Arial, sans-serif; }
.role-type { background: transparent; padding: 0; }
.form-status { color: var(--muted); font: 12px/1.5 Arial, sans-serif; margin-top: 14px; text-align: center; }
.form-status.success { color: #32815c; }
.form-status.failure { color: var(--coral); }
.testimonials { background: var(--paper); padding: 0 0 110px; }
.testimonial-grid { display: grid; gap: 16px; grid-template-columns: repeat(3, 1fr); }
.testimonial-card { background: var(--white); border-top: 3px solid var(--mint); min-height: 245px; padding: 24px; }
.testimonial-card-accent { border-top-color: var(--coral); }
.testimonial-mark { color: var(--coral); font: 48px/0.6 Georgia, serif; }
.testimonial-card blockquote { font-size: 19px; line-height: 1.35; margin: 22px 0 28px; }
.testimonial-card figcaption { display: flex; flex-direction: column; font: 11px Arial, sans-serif; gap: 3px; }
.testimonial-card figcaption span { color: var(--muted); }
.benefits, .privacy-notice, .contact-section, .social-section { padding: 85px 0; }
.benefits { background: var(--cream); }
.benefits .container, .contact-section .container, .privacy-notice .container, .social-section .container { max-width: 860px; }
.section-title { font-size: 39px; font-weight: 400; letter-spacing: -1.5px; margin-bottom: 35px; }
.benefits-grid { display: grid; gap: 15px; grid-template-columns: repeat(4, 1fr); }
.benefit-card { background: var(--white); padding: 24px; }.benefit-icon { font-size: 28px; margin-bottom: 30px; }.benefit-card h3 { font-size: 19px; font-weight: 400; }.benefit-card p { color: var(--muted); font: 13px/1.6 Arial, sans-serif; }
.privacy-notice { background: var(--ink); color: var(--white); }.privacy-notice h3 { font-size: 25px; font-weight: 400; }.privacy-notice p { color: #bec8c1; font: 13px/1.7 Arial, sans-serif; }
.contact-section { background: var(--paper); }.contact-intro { color: var(--muted); font: 14px/1.7 Arial, sans-serif; margin: -18px 0 28px; max-width: 680px; }.contact-form { background: var(--white); padding: 35px; }.form-group { margin-bottom: 20px; }.form-group label { display: block; font: 700 12px Arial, sans-serif; margin-bottom: 8px; }
.required { color: var(--coral); }
.optional { color: var(--muted); font-weight: 400; font-size: 11px; }
.form-group input[type="text"], .form-group input[type="email"], .form-group input[type="tel"], .form-group textarea { border: 1px solid var(--line); border-radius: 0; padding: 12px; width: 100%; }.form-group input:focus, .form-group textarea:focus { border-color: var(--coral); outline: 0; }.checkbox-group { display: flex; flex-wrap: wrap; gap: 15px; }.checkbox-label { align-items: center; display: flex; font: 13px Arial, sans-serif; gap: 7px; }.checkbox-label input { accent-color: var(--coral); }.error-message { color: var(--coral); display: none; font: 11px Arial, sans-serif; margin-top: 5px; }.error-message.show { display: block; }
/* Cloudflare Turnstile CAPTCHA Styling */
.cf-turnstile { margin: 12px 0; padding: 10px; border-radius: 4px; }
.cf-turnstile[data-theme="dark"] { background: var(--ink); padding: 12px; border-radius: 4px; }
@media (max-width: 600px) { .cf-turnstile { transform: scale(0.86); transform-origin: 0 0; } }
.form-note { color: var(--muted); font: 11px Arial, sans-serif; margin-top: 12px; text-align: center; }.btn-large { width: 100%; }.social-section { background: var(--cream); text-align: center; }.social-section h3 { font-size: 26px; font-weight: 400; }.social-buttons { margin: auto; max-width: 300px; }.btn-secondary { background: var(--ink); color: var(--white); width: 100%; }.footer { background: var(--ink); color: var(--white); padding: 45px 0 20px; }.footer-content { display: flex; justify-content: space-between; margin: auto; width: min(1180px, calc(100% - 48px)); }.footer-section h4 { font-size: 20px; font-weight: 400; }.footer-section p, .footer-links, .footer-bottom { color: #aebbb3; font: 12px Arial, sans-serif; }.footer-section p { max-width: 270px; }.footer-links ul { display: flex; gap: 20px; list-style: none; }.footer-links a:hover { color: var(--white); }.footer-bottom { border-top: 1px solid rgba(255,255,255,.15); margin: 35px auto 0; padding-top: 17px; text-align: center; width: min(1180px, calc(100% - 48px)); }
+@keyframes reveal { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width:760px) {
    .container, .header-container, .hero, .search-strip, .featured-jobs { width:min(100% - 32px,600px); }
    .header { padding:17px 0; }
    .nav-toggle { background:transparent; border:0; display:flex; flex-direction:column; gap:4px; padding:8px; }
    .nav-toggle span { background:var(--ink); display:block; height:2px; width:22px; }
    .nav-menu { display:none; left:16px; position:absolute; right:16px; top:65px; }
    .nav-menu.active { background:var(--white); box-shadow:var(--shadow); display:block; padding:10px; }
    .nav-menu ul { align-items:stretch; flex-direction:column; gap:3px; }
    .nav-menu a { display:block; padding:12px; }
    .nav-link:last-child { background:transparent; color:var(--muted); padding:12px; }
    .hero { display:block; padding:50px 0 30px; }
    .hero-title { font-size:53px; }
    .hero-visual { margin-top:25px; min-height:340px; }
    .visual-sun { height:245px; right:5%; width:245px; }
    .job-preview-main { left:4%; top:70px; width:83%; }
    .job-preview-float { bottom:0; height:120px; width:120px; }
    .visual-sticker { right:0; }
    .search-strip { display:block; margin-bottom:70px; padding:7px; }
    .search-field { border-bottom:1px solid var(--line); border-right:0; padding:15px 10px; }
    .btn-dark { margin:8px 0 0; width:100%; }
    .section-heading { align-items:start; display:block; }
    .section-heading .text-link { display:inline-block; margin-top:18px; }
    .section-heading h2, .section-title { font-size:34px; }
    .testimonial-grid { grid-template-columns:1fr; }
    .testimonials { padding-bottom:70px; }
    .role-grid, .benefits-grid { grid-template-columns:1fr; }
    .featured-jobs { padding-bottom:70px; }
    .benefits, .privacy-notice, .contact-section, .social-section { padding:60px 0; }
    .contact-form { padding:22px; }
    .footer-content { align-items:start; flex-direction:column; gap:30px; width:calc(100% - 32px); }
    .footer-bottom { width:calc(100% - 32px); }
}