/* assets/css/style.css — ThaiQueens 공통 스타일 */

/* ===== Reset & Base ===== */
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px}
body{font-family:'Mitr','Jost',sans-serif;min-height:100vh;background:#FFF0F5;-webkit-text-size-adjust:100%;overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%}
button{cursor:pointer;transition:all .18s;font-family:'Mitr','Jost',sans-serif;border:none}
button:hover{opacity:.88}
input,textarea,select{font-family:'Mitr','Jost',sans-serif}

/* ===== Utility ===== */
.w{margin:0 auto;padding:0 16px}
.hide-scrollbar{-ms-overflow-style:none;scrollbar-width:none}
.hide-scrollbar::-webkit-scrollbar{display:none}

/* ===== Grid ===== */
.sg{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.sg2{display:grid;grid-template-columns:1fr;gap:8px}
.fg3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ftips{display:grid;grid-template-columns:1fr 1fr;gap:8px}

/* ===== Slider Animation ===== */
@keyframes slideScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.slider-track:hover{animation-play-state:paused}

/* ===== Side Menu ===== */
.side-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:2000;opacity:0;pointer-events:none;transition:opacity .3s}
.side-overlay.open{opacity:1;pointer-events:auto}
.side-menu{position:fixed;top:0;right:-280px;width:280px;height:100%;background:#fff;z-index:2001;transition:right .3s;box-shadow:-4px 0 20px rgba(0,0,0,.1);overflow-y:auto}
.side-menu.open{right:0}
.side-menu-header{background:linear-gradient(135deg,#FE76A6,#FF9EC0);padding:24px 20px 20px;color:#fff}
.side-menu-item{display:flex;align-items:center;gap:10px;padding:14px 20px;font-size:14px;font-weight:500;color:#1f2937;border-bottom:1px solid #f5f5f5;transition:background .15s}
.side-menu-item:hover{background:#fff5f8}
.side-menu-item.active{color:#FE76A6;font-weight:700}
.side-divider{height:1px;background:#f0f0f0;margin:4px 0}

/* ===== Language Switcher ===== */
.lang-btn{padding:6px 12px;border-radius:6px;font-size:11px;font-weight:700;cursor:pointer;transition:all .15s}
.lang-btn.on{background:#FE76A6;color:#fff}
.lang-btn.off{background:#f5f5f5;color:#9ca3af}

/* ===== Hamburger ===== */
.hamburger{width:32px;height:32px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer;background:none;padding:0}
.hamburger span{display:block;width:20px;height:2px;background:#1f2937;border-radius:2px;transition:all .3s}

/* ===== Job Card ===== */
.jcard{position:relative;z-index:1;background:#fff;border:1.5px solid #f3e8f0;border-radius:20px;padding:20px;cursor:pointer;transition:all .25s;overflow:visible}
.jcard:hover{border-color:#f9a8d4;transform:translateY(-2px);box-shadow:0 8px 24px rgba(254,118,166,.15)}
.jcard-top{display:flex;gap:16px;align-items:center;margin-bottom:14px}
.jcard-thumb-wrap{position:relative;flex-shrink:0}
.jcard-thumb{width:80px;height:80px;border-radius:20px;object-fit:cover;border:3px solid #fce7f3;box-shadow:0 4px 16px rgba(254,118,166,.2)}
.jcard-thumb-badge{display:none}
.jcard-head{flex:1;min-width:0}
.jcard-company{font-family:'Mitr',sans-serif;font-size:17px;font-weight:700;color:#F9A8D4;margin-bottom:4px}
.jcard-title{font-family:'Mitr',sans-serif;font-size:19px;font-weight:800;color:#FE76A6;line-height:1.4;white-space:normal;overflow:visible;text-overflow:unset}
.jcard-bottom{display:flex;align-items:center;gap:8px;padding-top:12px;border-top:1.5px solid #fdf2f8}
.jcard-tag{font-family:'Mitr',sans-serif;font-size:12px;font-weight:700;padding:6px 16px;border-radius:20px;letter-spacing:.3px}
.jcard-tag.pink{background:#fce7f3;color:#db2777}
.jcard-tag.violet{background:#ede9fe;color:#7c3aed}
.jcard-tag.sky{background:#e0f2fe;color:#0284c7}
.jcard-tag.mint{background:#ccfbf1;color:#0d9488}
.jcard-tag.amber{background:#fef3c7;color:#d97706}
.jcard-loc{font-family:'Mitr',sans-serif;font-size:14px;color:#9ca3af}
.jcard-loc::before{content:'📍';font-size:13px;margin-right:3px}
.jcard-salary{margin-left:auto;font-family:'Outfit','Jost',sans-serif;font-size:24px;font-weight:900;background:linear-gradient(135deg,#ec4899,#f472b6);-webkit-background-clip:text;-webkit-text-fill-color:transparent}

/* ===== Job List Wrap ===== */
.job-list-wrap{background:linear-gradient(180deg,#fdf2f8,#fce7f3,#f9d4e8);border-radius:20px;padding:12px;position:relative;overflow:hidden}
.job-list-wrap::before{content:'';position:absolute;top:-60px;right:-40px;width:200px;height:200px;background:radial-gradient(circle,rgba(236,72,153,.12),transparent 70%);border-radius:50%}
.job-list-wrap::after{content:'';position:absolute;bottom:-50px;left:-30px;width:180px;height:180px;background:radial-gradient(circle,rgba(168,85,247,.08),transparent 70%);border-radius:50%}
.job-list-inner{display:flex;flex-direction:column;gap:8px}

/* ===== Safety & Disclaimer ===== */
.safety-card{background:#fafafa;border-radius:14px;padding:20px 16px;text-align:center;border:1px solid #ECEDF2;transition:all .2s}
.safety-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.06);transform:translateY(-1px)}
.disclaimer-section{background:#f8f8f8;border-top:1px solid #eee;padding:28px 16px}
.disclaimer-section h3{font-size:13px;font-weight:700;color:#333;margin:0 0 8px}
.disclaimer-section p{font-size:11px;color:#888;line-height:1.7;margin:0 0 12px}
.disclaimer-section a{color:#FE76A6;text-decoration:underline}

/* ===== Responsive ===== */
@media(min-width:768px){
  body{max-width:540px;margin:0 auto;background:#FFF0F5}
}