/* Y'MEK MARINE PROJECT — shared production styles
   (page bodies keep the design's inline styles; this file adds responsive
    header/footer, hover/focus behavior hooks, reveal fallback, media helpers) */

*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:#F5F2EC;}
img{max-width:100%;display:block;}
::selection{background:rgba(176,141,87,0.25);}

@keyframes ymek-kenburns{from{transform:scale(1.02)}to{transform:scale(1.13)}}

/* ---------- fullbleed hero images ---------- */
.hero-bg{position:absolute;inset:0;margin:0;overflow:hidden;background:#0E1B2A;}
.hero-bg img.kb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:ymek-kenburns 24s ease-in-out infinite alternate;}
.hero-bg .stripe{position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,0.05) 0,rgba(255,255,255,0.05) 1px,transparent 1px,transparent 14px);pointer-events:none;}

/* ---------- card image placeholders -> real photos ---------- */
.ph-img{position:relative;margin:0;width:100%;overflow:hidden;background:#0E1B2A;border:1px solid rgba(31,42,55,0.08);}
.ph-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,0,.2,1);}
.ph-img.zoom:hover img{transform:scale(1.05);}

/* ---------- header ---------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;display:flex;align-items:center;justify-content:space-between;height:70px;padding:0 clamp(20px,5vw,56px);box-sizing:border-box;background:transparent;border-bottom:1px solid transparent;transition:background .4s ease,border-color .4s ease;}
.site-header.is-solid{background:rgba(14,27,42,0.94);-webkit-backdrop-filter:saturate(140%) blur(8px);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid rgba(255,255,255,0.12);}
.brand{display:flex;align-items:baseline;gap:8px;text-decoration:none;color:#F5F2EC;line-height:1;}
.brand-mark{font-family:'Jost',sans-serif;font-weight:500;font-size:19px;letter-spacing:.14em;}
.brand-sub{font-family:'Jost',sans-serif;font-weight:300;font-size:11px;letter-spacing:.28em;color:#B08D57;padding-bottom:1px;}
.site-nav{display:flex;align-items:center;gap:clamp(20px,2.4vw,38px);}
.nav-link{position:relative;font-family:'Zen Kaku Gothic New',sans-serif;font-size:13.5px;font-weight:400;letter-spacing:.04em;color:rgba(245,242,236,0.78);text-decoration:none;padding:8px 2px;white-space:nowrap;}
.nav-link:hover{color:#F5F2EC;}
.nav-link .nav-underline{position:absolute;left:0;right:0;bottom:2px;height:1px;background:#B08D57;transform:scaleX(0);transform-origin:left center;transition:transform .35s ease;}
.nav-link:hover .nav-underline,.nav-link.is-current .nav-underline{transform:scaleX(1);}
.nav-link.is-current{color:#F5F2EC;}
.nav-cta{font-family:'Jost',sans-serif;font-size:12px;font-weight:400;letter-spacing:.12em;color:#F5F2EC;background:transparent;border:1px solid rgba(245,242,236,0.45);padding:10px 20px;text-decoration:none;white-space:nowrap;transition:background .3s,color .3s,border-color .3s;}
.nav-cta:hover,.nav-cta.is-current{color:#0E1B2A;background:#B08D57;border-color:#B08D57;}
.nav-burger{display:none;flex-direction:column;gap:6px;width:46px;height:46px;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;}
.nav-burger span{display:block;width:22px;height:1.5px;background:#F5F2EC;}
.mobile-menu{position:fixed;inset:0;z-index:1100;background:#0E1B2A;display:none;flex-direction:column;align-items:center;justify-content:center;gap:30px;}
.mobile-menu.open{display:flex;}
.mm-close{position:absolute;top:22px;right:20px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;}
.mm-link{font-family:'Shippori Mincho',serif;font-size:22px;font-weight:500;letter-spacing:.06em;color:#F5F2EC;text-decoration:none;}
.mm-link.is-current{color:#B08D57;}
.mm-legal{position:absolute;bottom:34px;left:0;right:0;display:flex;justify-content:center;gap:28px;}
.mm-legal a{font-family:'Jost',sans-serif;font-size:11px;letter-spacing:.16em;color:#5B6672;text-decoration:none;}
@media (max-width:919px){.site-nav{display:none;}.nav-burger{display:flex;}}

/* ---------- accessibility ---------- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #B08D57;outline-offset:3px;}
.skip-link{position:absolute;left:-9999px;top:0;z-index:2000;background:#0E1B2A;color:#F5F2EC;padding:12px 18px;font-size:13px;text-decoration:none;}
.skip-link:focus{left:12px;top:12px;}

@media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important;}}