/*
Theme Name: Pan Yadana Models
Theme URI: https://example.com
Author: Pan Yadana Models
Author URI: https://example.com
Description: Editorial WordPress theme for a modeling agency, inspired by Burmese lacquerware motifs. Includes a custom front page, model roster, portfolio, and application form.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: pan-yadana-models
*/

:root{
  --bg:#14120f;
  --bg-alt:#1d1a15;
  --ink:#efe8db;
  --ink-dim:#a89f8d;
  --lacquer:#8a2a30;
  --lacquer-bright:#b8434b;
  --gold:#c9a24b;
  --jade:#46614f;
  --line: rgba(201,162,75,0.25);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Noto Sans Myanmar','Fraunces',serif;
  font-weight:400;
  line-height:1.7;
  overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}
.wrap{max-width:1240px; margin:0 auto; padding:0 32px;}
a{color:inherit; text-decoration:none;}
img{display:block; max-width:100%;}

/* ---------- NAV ---------- */
header.site-header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:22px 0;
  background:linear-gradient(to bottom, rgba(20,18,15,0.9), transparent);
}
nav.main-nav{display:flex; align-items:center; justify-content:space-between;}
.brand{
  font-family:'Fraunces',serif; font-weight:600; font-style:italic;
  font-size:22px; letter-spacing:0.5px; color:var(--ink);
}
.brand span{color:var(--gold); font-style:normal;}

.nav-right{display:flex; align-items:center; gap:36px;}

.nav-links{display:flex; gap:34px; font-size:15px; color:var(--ink-dim); list-style:none;}
.nav-links li{display:inline-block; position:relative;}
.nav-links a{transition:color .25s ease; position:relative;}
.nav-links a:hover, .nav-links a:focus-visible{color:var(--gold);}
.nav-links a:focus-visible{outline:1px solid var(--gold); outline-offset:4px;}
.nav-toggle{display:none; background:none; border:none; color:var(--ink); font-size:26px; cursor:pointer;}

.btn.btn-nav-cta{padding:11px 22px; font-size:13.5px; white-space:nowrap;}

/* ---------- Dropdown submenus (Men / Women) ---------- */
.nav-links li.menu-item-has-children > a::after{
  content:""; display:inline-block; width:6px; height:6px;
  border-right:1px solid currentColor; border-bottom:1px solid currentColor;
  transform:rotate(45deg); margin-left:7px; margin-bottom:1px;
}
.nav-links .sub-menu{
  list-style:none; position:absolute; top:calc(100% + 18px); left:50%;
  transform:translateX(-50%) translateY(6px);
  min-width:180px; background:var(--bg-alt); border:1px solid var(--line);
  padding:8px 0; opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .22s ease, transform .22s ease; z-index:50;
}
.nav-links li.menu-item-has-children:hover > .sub-menu,
.nav-links li.menu-item-has-children:focus-within > .sub-menu,
.nav-links li.menu-item-has-children.sub-open > .sub-menu{
  opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0);
}
.nav-links .sub-menu li{display:block;}
.nav-links .sub-menu a{
  display:block; padding:10px 20px; font-size:14px; white-space:nowrap; color:var(--ink-dim);
}
.nav-links .sub-menu a:hover{background:#242019; color:var(--gold);}

@media (max-width:820px){
  .nav-right{
    position:fixed; inset:0 0 auto 0; top:0; height:100vh; width:100%;
    background:var(--bg); flex-direction:column; justify-content:center;
    align-items:center; gap:28px;
    transform:translateX(100%); transition:transform .4s ease;
    overflow-y:auto; padding:100px 24px 60px;
  }
  .nav-right.open{transform:translateX(0);}
  .nav-links{flex-direction:column; align-items:center; gap:22px; font-size:19px;}
  .nav-links li{display:block; text-align:center;}
  .nav-links .sub-menu{
    position:static; transform:none; opacity:1; visibility:visible; pointer-events:auto;
    background:transparent; border:none; padding:14px 0 0; min-width:0;
    display:none;
  }
  .nav-links li.sub-open > .sub-menu{display:block;}
  .nav-links .sub-menu a{text-align:center; font-size:16px; padding:8px 0; color:var(--ink-dim);}
  .btn-nav-cta{margin-top:6px;}
  .nav-toggle{display:block; position:relative; z-index:110;}
}

/* ---------- lacquer divider (signature element) ---------- */
.divider{width:100%; height:64px; display:flex; align-items:center; justify-content:center; opacity:0.9;}
.divider svg path{
  stroke-dasharray: 900; stroke-dashoffset:900;
  transition: stroke-dashoffset 1.6s cubic-bezier(.2,.7,.2,1);
}
.divider.in-view svg path{stroke-dashoffset:0;}

/* ---------- HERO ---------- */
.hero{
  position:relative; min-height:100vh; display:flex; align-items:flex-end;
  background:#0f0d0b;
}
.hero-img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  object-position:center 20%;
  filter:grayscale(35%) contrast(1.05) brightness(0.75);
}
.hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(15,13,11,0.95) 5%, rgba(15,13,11,0.2) 55%, rgba(15,13,11,0.55));
}
.hero-content{position:relative; z-index:2; padding:0 32px 90px; width:100%;}
.hero-eyebrow{
  font-size:14px; letter-spacing:3px; color:var(--gold); text-transform:uppercase;
  display:flex; align-items:center; gap:12px; margin-bottom:22px;
}
.hero-eyebrow::before{content:""; width:34px; height:1px; background:var(--gold);}
.hero h1{
  font-family:'Fraunces',serif; font-weight:500;
  font-size:clamp(40px, 8vw, 96px); line-height:1.05; max-width:900px;
  color:var(--ink);
}
.hero h1 .myn{font-family:'Noto Sans Myanmar', serif; font-weight:600;}
.hero p.lead{
  margin-top:24px; max-width:560px; color:var(--ink-dim); font-size:18px;
}
.hero-ctas{display:flex; gap:18px; margin-top:40px; flex-wrap:wrap;}
.btn{
  display:inline-block; padding:15px 30px; font-size:15px; border-radius:2px;
  transition:all .3s ease; border:1px solid var(--gold); letter-spacing:0.5px;
}
.btn-solid{background:var(--gold); color:#14120f; font-weight:600;}
.btn-solid:hover{background:var(--lacquer-bright); border-color:var(--lacquer-bright); color:var(--ink);}
.btn-outline{color:var(--ink); border-color:var(--line);}
.btn-outline:hover{border-color:var(--gold); color:var(--gold);}

/* ---------- SECTION shared ---------- */
section{padding:120px 0;}
.eyebrow{
  font-size:13px; letter-spacing:3px; text-transform:uppercase; color:var(--gold);
  display:flex; align-items:center; gap:12px; margin-bottom:20px;
}
.eyebrow::before{content:""; width:28px; height:1px; background:var(--gold);}
h2.section-title{
  font-family:'Noto Sans Myanmar',serif; font-weight:700;
  font-size:clamp(30px, 4.2vw, 52px); max-width:760px; color:var(--ink);
}
.section-sub{color:var(--ink-dim); max-width:600px; margin-top:18px; font-size:16px;}

/* ---------- ABOUT ---------- */
.about-grid{
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:80px; align-items:center; margin-top:70px;
}
.about-text p{color:var(--ink-dim); margin-bottom:18px; font-size:16.5px;}
.stats{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:44px;}
.stat{border-top:1px solid var(--line); padding-top:16px;}
.stat .num{font-family:'Fraunces',serif; font-size:40px; color:var(--gold); font-weight:500;}
.stat .lbl{font-size:13.5px; color:var(--ink-dim); margin-top:6px;}
.about-media{position:relative;}
.about-media img{width:100%; height:520px; object-fit:cover; filter:grayscale(30%) contrast(1.05);}
.about-media::before{
  content:""; position:absolute; top:-20px; left:-20px; width:120px; height:120px;
  border-top:2px solid var(--lacquer); border-left:2px solid var(--lacquer); z-index:1;
}
@media (max-width:900px){ .about-grid{grid-template-columns:1fr; gap:44px;} .about-media img{height:360px;} }

/* ---------- SERVICES ---------- */
.services-section{background:var(--bg-alt);}
.services-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:64px;
  background:var(--line);
}
.service{
  background:var(--bg-alt); padding:40px 30px; transition:background .3s ease;
}
.service:hover{background:#242019;}
.service .mark{font-family:'Fraunces',serif; font-style:italic; color:var(--lacquer-bright); font-size:15px; margin-bottom:26px; display:block;}
.service h3{font-size:19px; margin-bottom:12px; font-weight:600;}
.service p{color:var(--ink-dim); font-size:14.5px;}
@media (max-width:900px){ .services-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .services-grid{grid-template-columns:1fr;} }

/* ---------- TALENT ---------- */
.talent-head{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:20px;}
.talent-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:60px;
}
.talent-grid .card:nth-child(2){margin-top:56px;}
.talent-grid .card:nth-child(4){margin-top:28px;}
.card{position:relative; overflow:hidden; cursor:pointer;}
.card .frame{aspect-ratio:3/4; overflow:hidden; background:#232019;}
.card img{width:100%; height:100%; object-fit:cover; filter:grayscale(45%) contrast(1.05); transition:transform .6s ease, filter .5s ease;}
.card:hover img{transform:scale(1.06); filter:grayscale(0%) contrast(1.05);}
.card .info{padding:16px 4px 0;}
.card .info .name{font-weight:600; font-size:16.5px;}
.card .info .role{color:var(--ink-dim); font-size:13.5px; margin-top:3px;}
@media (max-width:900px){
  .talent-grid{grid-template-columns:1fr 1fr;}
  .talent-grid .card:nth-child(2), .talent-grid .card:nth-child(4){margin-top:0;}
}
@media (max-width:560px){ .talent-grid{grid-template-columns:1fr;} }

/* ---------- PORTFOLIO (horizontal scroll) ---------- */
.portfolio-section{background:var(--bg-alt);}
.scroll-row{
  display:flex; gap:22px; margin-top:60px; overflow-x:auto; padding-bottom:20px;
  scrollbar-width:thin; scrollbar-color:var(--gold) transparent;
}
.scroll-row::-webkit-scrollbar{height:5px;}
.scroll-row::-webkit-scrollbar-thumb{background:var(--gold);}
.plate{flex:0 0 auto; width:320px;}
.plate .frame{width:320px; height:420px; overflow:hidden; background:#232019;}
.plate img{width:100%; height:100%; object-fit:cover; filter:grayscale(30%);}
.plate .cap{margin-top:14px; font-size:14px; color:var(--ink-dim);}
.plate .cap b{color:var(--ink); font-weight:600;}

/* ---------- JOIN / APPLY ---------- */
.join-grid{display:grid; grid-template-columns:1fr 1fr; gap:80px; margin-top:60px; align-items:start;}
.field{margin-bottom:22px;}
.field label{display:block; font-size:13.5px; color:var(--ink-dim); margin-bottom:8px; letter-spacing:0.5px;}
.field input, .field select, .field textarea{
  width:100%; background:transparent; border:none; border-bottom:1px solid var(--line);
  color:var(--ink); font-family:'Noto Sans Myanmar',serif; font-size:16px; padding:10px 2px;
  transition:border-color .25s ease;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--gold);
}
.field textarea{resize:vertical; min-height:90px;}
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.note{font-size:14px; color:var(--ink-dim); margin-top:6px;}
.apply-side p{color:var(--ink-dim); margin-bottom:16px;}
.apply-side ul{margin-top:24px; padding-left:0; list-style:none;}
.apply-side li{
  padding:16px 0; border-top:1px solid var(--line); color:var(--ink-dim); font-size:15px;
  display:flex; gap:14px;
}
.apply-side li span.n{color:var(--gold); font-family:'Fraunces',serif; font-style:italic;}
@media (max-width:900px){ .join-grid{grid-template-columns:1fr; gap:44px;} .two-col{grid-template-columns:1fr;} }

/* ---------- CONTACT / FOOTER ---------- */
footer.site-footer{background:#0f0d0b; padding:90px 0 30px; border-top:1px solid var(--line);}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:50px;}
.footer-brand .brand{font-size:26px;}
.footer-brand p{color:var(--ink-dim); margin-top:16px; max-width:280px; font-size:14.5px;}
.fcol h4{font-size:14px; letter-spacing:1px; color:var(--gold); margin-bottom:18px;}
.fcol a, .fcol p{display:block; color:var(--ink-dim); font-size:14.5px; margin-bottom:10px;}
.fcol a:hover{color:var(--ink);}
.foot-bottom{
  margin-top:70px; padding-top:24px; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  color:var(--ink-dim); font-size:13px;
}
@media (max-width:900px){ .footer-grid{grid-template-columns:1fr 1fr; row-gap:36px;} }
@media (max-width:560px){ .footer-grid{grid-template-columns:1fr;} }

/* fade-in-on-scroll */
.reveal{opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s ease;}
.reveal.in-view{opacity:1; transform:translateY(0);}

/* ---------- Generic inner page (page.php) ---------- */
.page-hero{padding:180px 0 60px; border-bottom:1px solid var(--line);}
.page-hero h1{font-family:'Noto Sans Myanmar',serif; font-weight:700; font-size:clamp(32px,5vw,56px);}
.page-content{padding:80px 0; max-width:800px; margin:0 auto;}
.page-content p{color:var(--ink-dim); margin-bottom:18px; font-size:16.5px;}
.page-content img{margin:30px 0; filter:grayscale(25%);}
