/* Public landing page (R1). Migrated VERBATIM from the mockup's inline <style>
   blocks (Mockups::PagesController#landing view + mockups/shared/_talent_card_styles).
   Scoped under .page-tastellers / .ts-card so it cannot leak to other public pages. */

:root {
  --g1:#C4A559;--g2:#D4BC7A;--g3:#E5D4A0;--g4:#EFE2B8;
  --dark:#18140C;--dark2:#1E1A12;--white:#FFFFFF;--warm:#F8F5F0;
  --t1:#18140C;--t2:#6B6560;--t3:#A09890;
}
@keyframes su{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
@keyframes sd{0%{transform:translateY(-50%)}100%{transform:translateY(0)}}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes fu{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes jc-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.page-tastellers { overflow-x: hidden; }
.page-tastellers *{margin:0;padding:0;box-sizing:border-box}
.gt{background:linear-gradient(135deg,var(--g1),var(--g2),var(--g3),var(--g4));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-style:normal;font-weight:700}

/* HERO */
.hero{padding:28px 40px 24px;max-width:1280px;margin:-20px auto 0;display:grid;grid-template-columns:1fr 560px;gap:40px;align-items:start}
.hero>div:first-child{align-self:start}
.hero>.hc{margin-top:-16px;height:700px}
.hero-badge{position:relative;font-family:'Geist',sans-serif;font-size:11px;line-height:1;font-weight:400;letter-spacing:0;color:#3a342e;margin-bottom:14px;display:inline-block;white-space:nowrap;padding:7px 14px;border-radius:100px;background:#F8F4ED;background-clip:padding-box;border:0.5px solid transparent;opacity:0;animation:fu .7s ease .1s forwards}
.hero-badge::before{content:"";position:absolute;inset:0;border-radius:100px;padding:0.5px;background:linear-gradient(99deg,#BD9733 0%,#E5D29F 25%,#E8CC6E 50%,#E5D29F 75%,#FFF4C2 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.hero-badge b{font-weight:700;color:#3a342e}
.hero h1{font-family:'Geist',sans-serif;font-size:56px;font-weight:700;line-height:1.08;letter-spacing:-1.5px;color:var(--t1);margin-bottom:20px;opacity:0;animation:fu .7s ease .2s forwards}
.hero-sub{font-size:14.5px;color:var(--t2);line-height:1.65;margin-bottom:30px;max-width:420px;opacity:0;animation:fu .7s ease .3s forwards}
.btn-g{display:inline-flex;align-items:center;justify-content:center;padding:13px 28px;background:linear-gradient(135deg,#C4A559 0%,#D4BC7A 40%,#E5D4A0 70%,#EFE2B8 100%);color:#fff;font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;text-decoration:none;border-radius:50px;transition:all .3s;opacity:0;animation:fu .7s ease .4s forwards;text-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 2px 10px rgba(184,145,42,.28)}
.btn-g:hover{transform:translateY(-2px);box-shadow:0 4px 18px rgba(184,145,42,.42)}
.btn-g svg{width:15px;height:15px}
.hero-stats{display:flex;gap:44px;padding:16px 40px 48px;max-width:1280px;margin:0 auto;border-top:1px solid rgba(0,0,0,.07);opacity:0;animation:fu .7s ease .5s forwards;justify-content:space-between}
.hero-stats>div{flex:1;text-align:center}
.st-n{font-family:'Geist',sans-serif;font-size:34px;font-weight:700;font-style:normal;background:linear-gradient(135deg,var(--g1),var(--g2),var(--g3),var(--g4));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.5px}
.st-l{font-size:12.5px;color:var(--t2);margin-top:2px}

/* SCROLL CARDS */
.hc{position:relative;height:620px;overflow:hidden;mask-image:linear-gradient(to bottom,transparent,#000 5%,#000 95%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 5%,#000 95%,transparent)}
.hc-in{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sc{display:flex;flex-direction:column;gap:12px}
.sc-u{animation:su 32s linear infinite}
.sc-d{animation:sd 32s linear infinite}
.hc:hover .sc{animation-play-state:paused}
.page-tastellers .pc{font-family:'Geist',sans-serif;background:#FFFFFF;border-radius:16px;overflow:hidden;box-shadow:0 2px 16px rgba(0,0,0,.07);border:none;flex-shrink:0;width:236px;min-height:341px;display:flex;flex-direction:column}
.pc-ph{width:100%;height:190px;position:relative;border-radius:16px 16px 0 0;overflow:hidden}
.pc-ph img{width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0;z-index:1}
.pc-ph.a{background:linear-gradient(160deg,#d8d0c4,#c0b8a8,#d5cfc5)}
.pc-ph.b{background:linear-gradient(160deg,#4a4038,#3a3028,#5a5048)}
.pc-ph.c{background:linear-gradient(160deg,#c9b896,#b8a882,#d4c8ac)}
.pc-ph.d{background:linear-gradient(160deg,#a8b0a0,#8a9480,#b0baa8)}
.pc-bd{position:absolute;top:8px;left:8px;display:flex;gap:4px;z-index:2}
.vb{display:inline-flex;justify-content:center;align-items:center;gap:6px;height:20px;padding:4px 8px;background:linear-gradient(135deg,#A38543 0%,#CDB563 50%,#B19136 100%);color:#242424;border-radius:4px;font-family:'Geist',system-ui,sans-serif;font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;line-height:1;box-sizing:border-box}
.vb::before{content:"";width:10px;height:12px;background:url("/images/verified-t.svg") no-repeat center/contain;display:inline-block;flex-shrink:0}
.vb::after{content:"VERIFIED"}
.vb>*{display:none}
.pb{display:none !important}
.pc-fl{position:absolute;top:8px;right:8px;display:inline-flex;align-items:center;justify-content:center;background:rgba(0,0,0,.45);padding:3px 5px;border-radius:6px;z-index:2;line-height:0}
.pc-fl img{width:18px;height:14px;display:block;border-radius:2px;object-fit:cover}
.pc-rt{position:absolute;bottom:8px;left:8px;background:rgba(0,0,0,.55);color:#fff;padding:4px 10px;border-radius:6px;font-size:11px;font-weight:500;z-index:2}
.pc-sc{position:absolute;bottom:8px;right:8px;z-index:2;display:flex;align-items:center;background:#FFFFFF;padding:4px 9px;border-radius:20px;box-shadow:0 1px 6px rgba(0,0,0,.12);font-size:12px;font-weight:600;color:#0A0A0A;gap:3px}
.pc-sc svg{width:12px;height:12px;fill:#F59E0B}
.pc-bo{padding:12px 14px 14px;display:flex;flex-direction:column}
.page-tastellers .pc-nm{font-weight:700;font-size:14px;color:#0A0A0A;line-height:1.2}
.pc-rl{font-size:12.5px;color:#BC9E5C;font-weight:500;margin-top:2px}
.pc-me{display:flex;align-items:center;gap:10px;margin-top:8px;font-size:12px}
.pc-av{display:inline-flex;align-items:center;gap:5px;font-weight:500;color:#16A34A}
.pc-av::before{content:'';width:6px;height:6px;background:#16A34A;border-radius:50%}
.page-tastellers .pc-lo{display:inline-flex;align-items:center;gap:5px;color:#6B7280}
.page-tastellers .pc-lo::before{content:'';width:6px;height:6px;background:#EF4444;border-radius:50%}
.pc-lo svg{display:none}
.pc-tg{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.page-tastellers .pc-t{font-size:11px;padding:3px 9px;border-radius:20px;background:#F3F4F6;border:none;color:#374151;font-weight:500;line-height:1.3}

/* CTA CARDS */
.tcta{max-width:1280px;margin:0 auto 90px;padding:0 40px;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:stretch}
.cc{border-radius:22px;padding:36px 32px;min-height:380px;display:flex;flex-direction:column;justify-content:stretch;position:relative;overflow:hidden;color:#fff;height:100%}
.cc-bg{position:absolute;inset:0}
.cc-bg img{width:100%;height:100%;object-fit:cover}
.cc-bg::after{content:'';position:absolute;inset:0}
.cc-t .cc-bg::after{background:linear-gradient(to bottom,rgba(60,45,20,.3) 0%,rgba(40,30,10,.75) 50%,rgba(24,20,12,.92) 100%)}
.cc-r .cc-bg::after{background:linear-gradient(to bottom,rgba(20,18,14,.2) 0%,rgba(20,18,14,.7) 45%,rgba(20,18,14,.94) 100%)}
.cc-e .cc-bg::after{background:linear-gradient(to bottom,rgba(20,18,14,.25) 0%,rgba(20,18,14,.72) 50%,rgba(20,18,14,.94) 100%)}
.cc-inner{position:relative;z-index:2;display:flex;flex-direction:column;flex:1;padding-top:0;margin-top:0}
.cc-inner>*:first-child{margin-top:0!important;padding-top:0!important}
.cc h3{font-family:'Geist',sans-serif;font-size:38px;line-height:1.05;font-weight:700;letter-spacing:-0.02em;margin:0 0 10px;color:#fff;padding-top:0;min-height:84px;display:block;text-align:center}
.cc h3 .gt{background:linear-gradient(135deg,var(--g1),var(--g2),var(--g3),var(--g4));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700}
.cc p{font-size:13.5px;line-height:1.55;opacity:.75;margin-bottom:16px;color:#fff;max-width:340px}
.cc .cc-sub,.cc .cc-sub-neutral{font-family:'Geist',sans-serif;font-size:15px;font-weight:600;letter-spacing:0.02em;margin-bottom:18px;opacity:1;max-width:none;min-height:72px;line-height:1.5;display:block;font-style:normal;text-align:center;background:linear-gradient(99deg,#BD9733 0%,#E5D29F 25%,#E8CC6E 50%,#E5D29F 75%,#FFF4C2 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.cp{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:22px;margin-top:0;align-content:flex-start;justify-content:flex-start;min-height:140px}
.cp span{flex:1 1 auto;text-align:center;font-size:11.5px;font-weight:500;padding:5px 13px;border-radius:18px;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.85);backdrop-filter:blur(4px);white-space:nowrap}
.b-dk{display:inline-flex;align-items:center;justify-content:center;width:240px;height:39px;padding:0 24px;background:var(--dark);color:#fff;font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:1px;text-decoration:none;border-radius:50px;transition:all .3s;align-self:center;margin-top:auto;position:relative;z-index:4;white-space:nowrap;text-align:center}
.b-dk:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.3)}
.b-gd{display:inline-flex;align-items:center;justify-content:center;width:240px;height:39px;padding:0 24px;background:linear-gradient(to right,var(--g1) 0%,var(--g2) 30%,var(--g3) 70%,var(--g4) 100%);color:var(--dark);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:1.2px;text-decoration:none;border-radius:50px;transition:all .3s;align-self:center;margin-top:auto;position:relative;z-index:4;white-space:nowrap;text-align:center}
.b-gd:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(184,145,42,.4)}
@media (max-width:768px){
  .tcta{grid-template-columns:1fr;gap:24px;margin-bottom:60px}
  .cc h3{font-size:28px}
  .cc .cc-sub,.cc .cc-sub-neutral{font-size:13px}
}

/* CINEMATIC */
.cine{max-width:1280px;margin:0 auto 90px;padding:0 40px;clear:both;position:relative;z-index:1}
.cine-wrap{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:21/9;background:#0a0a08}
.cine-wrap img{width:100%;height:100%;object-fit:cover;object-position:right 30%}
.cine-wrap::after{content:'';position:absolute;inset:0;background:linear-gradient(to right,rgba(24,20,12,.5),transparent 60%)}
.cine-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,.12);backdrop-filter:blur(8px);border:2px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s}
.cine-play:hover{background:rgba(255,255,255,.22);transform:translate(-50%,-50%) scale(1.06)}
.cine-play svg{width:22px;height:22px;fill:#fff;margin-left:2px}
.cine-bar{position:absolute;bottom:0;left:0;right:0;z-index:3;padding:10px 16px 8px;background:linear-gradient(to top,rgba(0,0,0,.5),transparent);display:flex;align-items:center;gap:10px}
.cine-prog{flex:1;height:3px;background:rgba(255,255,255,.18);border-radius:2px;position:relative;overflow:hidden}
.cine-prog::after{content:'';position:absolute;top:0;left:0;width:35%;height:100%;background:var(--g2);border-radius:2px}
.cine-time{font-size:10px;color:rgba(255,255,255,.55);font-weight:500;font-family:'Inter',sans-serif}

/* NETWORK */
.net{background:var(--dark);padding:90px 40px;color:#fff}
.net-in{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr 420px;gap:48px;align-items:center}
.net-text{}
.net-img{border-radius:20px;overflow:hidden;height:480px}
.net-img img{width:100%;height:100%;object-fit:cover}
@media(max-width:900px){.net-in{grid-template-columns:1fr;}.net-img{height:320px}}
.sbg{font-size:10.5px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--g2);margin-bottom:14px}
.net h2{font-family:'Geist',sans-serif;font-size:44px;font-weight:700;line-height:1.15;margin-bottom:14px}
.net h2 em{font-style:normal;font-weight:700;background:linear-gradient(135deg,var(--g1),var(--g3),var(--g4));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.net-sub{font-size:15px;color:rgba(255,255,255,.45);line-height:1.7;max-width:580px;margin-bottom:36px}
.rp{display:flex;flex-wrap:wrap;gap:9px}
.rp span{font-size:12.5px;font-weight:500;padding:7px 16px;border-radius:22px;border:1px solid rgba(255,255,255,.13);color:rgba(255,255,255,.65);transition:all .2s}
.rp span:hover{border-color:var(--g2);color:var(--g3);background:rgba(200,165,74,.07)}

/* TRUST V2 */
.trust-v2{padding:90px 0 16px;background:#FFFFFF;overflow:hidden;font-family:'Geist',sans-serif;position:relative}
.trust-v2-title{font-family:'Geist',sans-serif;font-size:30px;font-weight:700;letter-spacing:-0.6px;color:#0A0A0A;text-align:center;margin:0 0 40px;padding:0 24px}
.trust-v2-wrap{position:relative}
.trust-v2-row{display:flex;flex-wrap:nowrap;align-items:stretch;gap:24px;padding:0 0 16px;overflow:hidden;width:max-content;animation:trust-marquee 40s linear infinite}
.trust-v2-wrap:hover .trust-v2-row{animation-play-state:paused}
@keyframes trust-marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.tcol{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:0;width:248px}
.tconn{width:2px;height:28px;background:linear-gradient(180deg,rgba(163,133,67,0.3),rgba(163,133,67,0.15));margin:0 auto}
.tcard{width:248px;box-sizing:border-box;background:#FFFFFF;border:1px solid rgba(0,0,0,0.07);border-radius:24px;padding:20px;box-shadow:0 2px 16px rgba(0,0,0,0.06);font-family:'Geist',sans-serif;transition:transform .3s ease, box-shadow .3s ease;display:flex;flex-direction:column;min-height:220px;flex:1}
.tcard:hover{transform:translateY(-3px);box-shadow:0 8px 32px rgba(0,0,0,0.10)}
.tcard-top{display:flex;gap:12px;align-items:flex-start}
.tcard-ph{width:60px;height:78px;border-radius:12px;object-fit:cover;flex-shrink:0;display:block}
.tcard-rt{display:flex;flex-direction:column;gap:8px;min-width:0;flex:1}
.tcard-bd{display:inline-block;align-self:flex-start;background:#FAF7F2;border:1px solid #E2CFA0;color:#A38543;font-size:10px;font-weight:600;padding:3px 9px;border-radius:20px;white-space:nowrap;line-height:1.2}
.tcard-q{margin:0;font-size:12.5px;line-height:1.65;color:#374151;font-style:italic}
.tcard-bot{margin-top:auto;padding-top:12px;border-top:1px solid rgba(0,0,0,0.05)}
.tcard-nm{font-size:12.5px;font-weight:700;color:#A38543;line-height:1.2}
.tcard-rl{font-size:11.5px;color:#6B7280;margin-top:1px;line-height:1.3}
.ev-card{position:relative;width:240px;min-width:240px;max-width:240px;height:340px;padding:20px;border-radius:16px;display:flex;flex-direction:column;align-items:flex-start;gap:32px;overflow:hidden;cursor:pointer;transition:transform .3s ease, box-shadow .35s ease;flex:0 0 240px;box-sizing:border-box}
.ev-card:hover{transform:translateY(-5px);box-shadow:0 28px 64px rgba(0,0,0,.32)}
.ev-photo{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .5s ease;z-index:0}
.ev-card:hover .ev-photo{transform:scale(1.04)}
.ev-overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(102,102,102,0) 0%, #000000 100%);z-index:1;pointer-events:none}
.ev-info{position:relative;z-index:2;margin-top:auto;display:flex;flex-direction:column;gap:8px;width:100%}
.ev-info-logo{width:42px;height:42px;border-radius:50%;background:#F8F4ED;object-fit:contain;padding:5px;margin-bottom:2px;display:block;box-shadow:0 3px 10px rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.6)}
.ev-name{color:#FFFFFF;font-size:22px;font-weight:700;letter-spacing:-0.4px;line-height:1.2}
.ev-meta{display:flex;align-items:center;gap:8px;font-size:13px}
.ev-type{color:rgba(255,255,255,0.72);font-weight:500}
.ev-dot{width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,0.35);display:inline-block}
.ev-group{color:rgba(255,255,255,0.45);font-weight:400}
.ev-loc{display:flex;align-items:center;gap:5px;color:rgba(255,255,255,0.5);font-size:12.5px}
.ev-loc svg{flex-shrink:0}

/* FEATURES */
.feats{padding:16px 40px 90px;max-width:1280px;margin:0 auto}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-bottom:90px}
.fr.rv{direction:rtl}.fr.rv>*{direction:ltr}
.fm{border-radius:18px;overflow:hidden;min-height:360px}
.fm img{width:100%;height:100%;object-fit:cover;min-height:360px}
.fc h3{font-family:'Geist',sans-serif;font-size:36px;font-weight:700;line-height:1.2;margin-bottom:14px}
.fc h3 em{font-style:normal;background:linear-gradient(135deg,var(--g1),var(--g2),var(--g3),var(--g4));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700}
.fc>p{font-size:14.5px;color:var(--t2);line-height:1.7;margin-bottom:28px}
.fl{display:flex;flex-direction:column;gap:18px;margin-bottom:32px}
.fi{display:flex;gap:12px;align-items:flex-start}
.fi h4{font-size:14px;font-weight:600;margin-bottom:2px}
.fi p{font-size:12.5px;color:var(--t2);line-height:1.5}
.bn{font-size:8.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--g2);background:rgba(200,165,74,.1);padding:2px 5px;border-radius:2px;margin-left:5px;vertical-align:middle}

/* JOIN CTA */
.join-cta{background:#1A1A18;padding:96px 40px 80px;display:flex;flex-direction:column;align-items:center;font-family:'Geist',sans-serif;overflow-x:hidden}
.join-cta-title{width:100%;max-width:558px;text-align:center;margin:0;font-family:'Geist',sans-serif;font-size:72px;font-weight:400;line-height:110%;letter-spacing:-1.44px;font-style:normal}
.join-cta-title .jc-l1{background:linear-gradient(99deg,#BD9733 0%,#E5D29F 25%,#E8CC6E 50%,#E5D29F 75%,#FFF4C2 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.join-cta-title .jc-l2{color:#FFFFFF}
.join-cta-sub{margin-top:24px;text-align:center;font-size:15px;color:rgba(255,255,255,.55);font-family:'Geist',sans-serif}
.join-cta-sub strong{font-weight:700;color:rgba(255,255,255,.85)}
.join-cta-btns{display:flex;gap:16px;margin-top:36px;flex-wrap:wrap;justify-content:center}
.join-cta-intern{margin-top:20px;text-align:center;font-size:13px;color:rgba(255,255,255,.55);font-family:'Geist',sans-serif}
.join-cta-intern a{color:#E5D29F;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.join-cta-intern a:hover{color:#FFF4C2}
.jc-btn{min-width:236px;height:44px;padding:0 30px;border-radius:9999px;display:inline-flex;align-items:center;justify-content:center;font-family:'Geist',sans-serif;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;transition:transform .2s,box-shadow .2s;white-space:nowrap}
.jc-btn-dark{background:#0A0A0A;border:1px solid rgba(255,255,255,.14);color:#FFFFFF;box-shadow:0 2px 10px rgba(0,0,0,.18)}
.jc-btn-dark:hover{border-color:rgba(255,255,255,.26);transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.28)}
.jc-btn-gold{background:linear-gradient(135deg,#C4A559 0%,#D4BC7A 40%,#E5D4A0 70%,#EFE2B8 100%);border:none;color:#FFFFFF;text-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 2px 10px rgba(184,145,42,.28)}
.jc-btn-gold:hover{transform:translateY(-2px);box-shadow:0 4px 18px rgba(184,145,42,.42)}
.join-cta-grid{display:flex;gap:16px;align-items:flex-start;justify-content:center;margin-top:52px;width:100%;padding:0 24px;box-sizing:border-box}
.jc-col{display:flex;flex-direction:column;gap:16px;width:160px;flex-shrink:0}
.jc-col-offset{padding-top:40px}
.jc-d{background:#2a2827;border:1px solid rgba(255,255,255,.08);border-radius:14px;box-shadow:0 8px 32px rgba(0,0,0,.5);overflow:hidden;width:160px;transition:transform .3s ease,box-shadow .3s ease}
.jc-d:hover{transform:translateY(-4px);box-shadow:0 16px 48px rgba(0,0,0,.6)}
.jc-d-cover{position:relative;width:100%;height:110px;overflow:hidden}
.jc-d-cover img{width:100%;height:100%;object-fit:cover;display:block}
.jc-d-vb{position:absolute;top:6px;left:6px;display:inline-flex;align-items:center;gap:4px;height:17px;padding:0 6px;border-radius:4px;background:linear-gradient(135deg,#A38543,#CDB563,#B19136);color:#242424;font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;line-height:1}
.jc-d-flag{position:absolute;top:6px;right:6px;background:rgba(0,0,0,.55);border-radius:4px;padding:1px 5px;font-size:11px;line-height:1.2}
.jc-d-tag{position:absolute;bottom:6px;left:6px;background:rgba(0,0,0,.65);color:#fff;font-size:8.5px;padding:2px 6px;border-radius:4px;line-height:1}
.jc-d-rate{position:absolute;bottom:6px;right:6px;background:#fff;color:#0A0A0A;font-size:8.5px;font-weight:700;padding:2px 5px;border-radius:20px;display:inline-flex;align-items:center;gap:2px;line-height:1}
.jc-d-star{color:#F59E0B}
.jc-d-body{padding:7px 9px 9px}
.jc-d-name{color:#fff;font-size:10.5px;font-weight:700;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jc-d-role{color:#BC9E5C;font-size:9.5px;margin-top:1px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jc-d-loc{display:flex;align-items:center;gap:4px;color:rgba(255,255,255,.38);font-size:8.5px;margin-top:4px;line-height:1.2}
.jc-d-dot{width:5px;height:5px;border-radius:50%;background:#22c55e;display:inline-block}
@media (max-width:768px){
  .join-cta{padding:64px 20px 56px}
  .join-cta-title{font-size:44px;letter-spacing:-.88px}
  .join-cta-btns{gap:12px}
  .jc-btn{min-width:unset;width:100%;max-width:320px;height:40px}
  .join-cta-depth{margin-top:36px;gap:12px}
}

/* Hero H1 -- Figma exact */
.hero h1.hero-h1-fig,.hero h1.hero-h1-fig *{font-family:'Geist',sans-serif !important;font-weight:400 !important;font-style:normal !important;font-size:64px !important;line-height:110% !important;letter-spacing:-0.5px !important;-webkit-font-smoothing:antialiased}
.hero h1.hero-h1-fig{color:#0A0A0A !important;max-width:586px;margin:0 0 20px 0 !important;padding:0 !important;opacity:0;animation:fu .7s ease .2s forwards}
.hero-h1-gold{background:linear-gradient(90deg,#BC9E5C,#D4B87A);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#BC9E5C}
/* CMS rich-text accent: bold text in the hero title renders gold (Trix has no colour button) */
.hero h1.hero-h1-fig strong{background:linear-gradient(90deg,#BC9E5C,#D4B87A);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#BC9E5C;font-weight:inherit !important}
@media (max-width:900px){.hero h1.hero-h1-fig,.hero h1.hero-h1-fig *{font-size:44px !important;}}
@media (max-width:768px){
  .hero{grid-template-columns:1fr;padding:100px 20px 50px}
  .hc{display:none}
  .hero-stats{flex-direction:column;gap:20px;align-items:center;text-align:center}
  .hero-stats>div{display:flex;flex-direction:column;align-items:center}
  .cp{display:none !important}
}

/* Retours 03/06 : les sections sombres (.net, .join-cta) RESTENT noires (design voulu).
   Seul le fond de page passe en blanc pur (#FFFFFF) — cf layout mockup_public. */

/* Lisere sur les cards du carrousel hero pour les distinguer du fond blanc */
.page-tastellers .pc{border:1px solid rgba(0,0,0,.08);box-shadow:0 4px 20px rgba(0,0,0,.06)}

/* Hero "comme le Lovable" : photo en portrait 4:5 (forme/taille de la ref) */
.page-tastellers .fr{align-items:center}
.page-tastellers .fm{aspect-ratio:4/5;min-height:0;height:auto}
.page-tastellers .fm img{min-height:0;height:100%}

/* Section "Pret a rejoindre" : ts-cards (partial partage) en colonnes 2-1-2-1 centrees vert.
   Largeur EXACTE de talent_search (267px) pour des paddings/marges identiques. */
.page-tastellers .join-cta-grid{display:flex;flex-wrap:nowrap;gap:20px;justify-content:center;align-items:center;margin-top:52px;width:100%;padding:0 24px;box-sizing:border-box;overflow:hidden}
.page-tastellers .join-cta-grid .jc-col{display:flex;flex-direction:column;gap:20px;width:267px;flex-shrink:0;padding-top:0}
.page-tastellers .join-cta-grid .ts-card{width:267px;cursor:default}

/* ts-card dans le carrousel hero : largeur 267px comme talent_search */
.page-tastellers .hc-in .ts-card{width:267px;cursor:default}
.page-tastellers .hc-in .sc{gap:14px}
/* panneau hero assez large pour 2 colonnes de 267px (sinon la col droite est coupee) */
.page-tastellers .hero{grid-template-columns:1fr 566px}
.page-tastellers .hc-in{gap:16px}

/* Page d'accueil : cards en mode vitrine -> on masque les boutons (apercu/shortlist/voir profil) */
.page-tastellers .ts-card-preview-btn,
.page-tastellers .ts-card-actions{display:none !important}
/* sans boutons, un peu d'air sous les tags */
.page-tastellers .ts-card-info{padding-bottom:16px}

/* ===================================================================
   Talent card (Lovable-style) — migrated from mockups/shared/_talent_card_styles
   =================================================================== */
.ts-card,.ts-grid{--ts-gold:#A38543;--ts-gold-deep:#8B6F33;--ts-ink:#0A0A0A;--ts-ink-soft:#5B5B5B;--ts-ink-mute:#8A8A8A;}
.ts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 20px;
}
.ts-card {
  background: #fff;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.05);
  overflow: hidden;
  box-shadow: 0 2px 14px rgba(0,0,0,0.05);
  transition: all 0.3s ease;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.ts-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 30px rgba(0,0,0,0.1);
}
.ts-card-photo {
  position: relative;
  aspect-ratio: 1/1;
  overflow: hidden;
  border-radius: 14px 14px 0 0;
}
.ts-card-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ts-card-photo-gradient {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 50%;
  background: linear-gradient(0deg, rgba(0,0,0,0.55), transparent);
  pointer-events: none;
}
.ts-card-verified {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,0.18);
}
.ts-card-verified svg {
  width: 13px;
  height: 13px;
  display: block;
}
.ts-card-verified span {
  font-size: 10px;
  font-weight: 700;
  color: #2E7D32;
  letter-spacing: .2px;
}
.ts-card-role-tag {
  position: absolute;
  bottom: 10px;
  left: 10px;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(8px);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px 4px 6px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: calc(100% - 20px);
}
.ts-card-role-tag .flag {
  font-size: 14px;
  line-height: 1;
}
.ts-card-info {
  padding: 12px 14px 0;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.ts-card-name-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.ts-card-name-left {
  display: flex;
  align-items: center;
  gap: 5px;
  flex: 1;
  min-width: 0;
  padding-top: 2px;
}
.ts-card-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--ts-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ts-card-role {
  font-size: 12px;
  font-weight: 500;
  color: var(--ts-gold);
  margin-top: 1px;
}
.ts-card-status {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
  font-size: 11px;
  color: var(--ts-ink-soft);
  flex-wrap: wrap;
}
.ts-card-status .avail-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #2E7D32;
  display: inline-block;
}
.ts-card-current {
  font-size: 11px;
  color: var(--ts-ink-soft);
  margin-top: 4px;
}
.ts-card-current strong {
  font-weight: 600;
  color: var(--ts-ink);
}

/* Recent jobs mini-carousel */
.ts-card-jobs {
  margin-top: 8px;
}
.ts-card-jobs-label {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--ts-ink-mute);
  text-transform: uppercase;
  margin-bottom: 5px;
}
.ts-card-job-row {
  display: flex;
  align-items: center;
  gap: 6px;
}
.ts-card-job-box {
  flex: 1;
  min-width: 0;
  padding: 6px 10px;
  border: 1px solid rgba(163,133,67,0.22);
  border-radius: 6px;
  background: linear-gradient(180deg, #FFFDF6 0%, #FBF6E4 100%);
}
.ts-card-job-title {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--ts-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ts-card-job-title .stars {
  color: var(--ts-gold);
  font-size: 9px;
}
.ts-card-job-place {
  font-size: 9.5px;
  color: var(--ts-ink-soft);
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ts-card-job-nav {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid rgba(163,133,67,0.35);
  background: linear-gradient(180deg, #FFFDF6 0%, #F5E9C2 100%);
  color: var(--ts-gold-deep);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  transition: all 0.15s;
}
.ts-card-job-nav:hover {
  background: linear-gradient(135deg, #C4A559, #D4BC7A, #E5D4A0, #EFE2B8);
  color: #3A2C12;
}
.ts-card-job-counter {
  flex-shrink: 0;
  font-size: 9px;
  font-weight: 600;
  color: var(--ts-ink-mute);
  min-width: 22px;
  text-align: right;
}

/* Creds */
.ts-card-creds {
  display: flex;
  gap: 6px;
  margin-top: 8px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.ts-card-cred {
  font-size: 10px;
  font-weight: 500;
  color: var(--ts-ink-soft);
  padding: 2px 8px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 4px;
}

/* Quick preview button */
.ts-card-preview-btn {
  margin-top: auto;
  width: 100%;
  padding: 8px 12px;
  border: 1px solid #D4BC7A;
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(201,165,74,.10), rgba(232,204,110,.05));
  color: #7A5E1F;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.3px;
  white-space: nowrap;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: all 0.15s;
  font-family: inherit;
}
.ts-card-preview-btn:hover {
  filter: brightness(1.03);
  border-color: #C9A84C;
}

/* Card actions */
.ts-card-actions {
  padding: 8px 12px 12px;
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.ts-btn {
  flex: 1;
  padding: 9px 0;
  border-radius: 8px;
  border: none;
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.ts-btn.gold {
  background: linear-gradient(135deg, #C4A559 0%, #D4BC7A 40%, #E5D4A0 70%, #D4BC7A 100%);
  color: #fff;
}
.ts-btn.gold:hover {
  filter: brightness(1.05);
}
.ts-btn.dark {
  background: none;
  border: none;
  color: #9A7A28;
  letter-spacing: 0.3px;
}
.ts-btn.dark:hover {
  color: #7A5E1F;
}

/* Badge "T VERIFIED" Tastellers — positionne sur la photo */
.ts-card-photo .vb {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 5;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  height: 20px;
  padding: 4px 8px;
  background: linear-gradient(135deg, #A38543 0%, #CDB563 50%, #B19136 100%);
  color: #242424;
  border-radius: 4px;
  font-family: 'Geist', system-ui, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  line-height: 1;
  box-sizing: border-box;
}
.ts-card-photo .vb::before {
  content: "";
  width: 10px;
  height: 12px;
  background: url("/images/verified-t.svg") no-repeat center/contain;
  display: inline-block;
  flex-shrink: 0;
}
.ts-card-photo .vb::after { content: "VERIFIED"; }
.ts-card-photo .vb > * { display: none; }