/*
Theme Name: N.Y.R. Limited Partnership
Theme URI: https://nyr.co.th
Author: N.Y.R. Limited Partnership
Description: Custom-coded theme for the N.Y.R. Limited Partnership website redesign. Carries over the exact header/nav treatment, color palette, and fixed-size (no-reflow) layout validated in the static HTML/JS prototype. Do not swap in a page-builder (Elementor etc.) — per the project brief this stays a hand-coded theme with simple editable fields for products, news, and jobs.
Version: 0.1.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: nyr
*/

/* ==========================================================================
   Palette + base — copied 1:1 from the approved static prototype
   (Desktop/nyr-prototype/index.html) so the live site matches exactly.
   NOTE: --nyr-navy / --nyr-amber are still PLACEHOLDER brand colors per the
   requirements brief — swap for NYR's real hex codes + logo before launch,
   and nowhere else (do not restyle header/nav/buttons without an explicit
   request — see "Round 3" note in the project brief).
   ========================================================================== */
:root{
  --nyr-navy:#0b3a52;
  --nyr-navy-dark:#082a3d;
  --nyr-navy-light:#134a68;
  --nyr-amber:#d99a2b;
  --nyr-amber-dark:#b87f1c;
  --nyr-bg:#f6f8f9;
  --nyr-surface:#ffffff;
  --nyr-border:#e1e6e9;
  --nyr-text:#1c2b33;
  --nyr-text-soft:#54666f;
  --nyr-text-invert:#ffffff;
  --nav-height:72px;
  --container-w:1180px;
  --radius:6px;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans Thai", "Sarabun", Roboto, Helvetica, Arial, sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--font);
  background:var(--nyr-bg);
  color:var(--nyr-text);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
.container{max-width:var(--container-w);margin:0 auto;padding:0 24px;}
.screen-reader-text{position:absolute;left:-9999px;}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:50;
  height:var(--nav-height);
  background:var(--nyr-navy);
  border-bottom:3px solid var(--nyr-amber);
}
.site-header .container{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  height:44px;
}
.brand-mark{
  width:44px;height:44px;flex:0 0 44px;
  border-radius:var(--radius);
  background:#fff;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;padding:2px;
}
.brand-mark img{width:100%;height:100%;object-fit:contain;display:block;}
.brand-name{
  color:var(--nyr-text-invert);
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  height:44px;
}
.brand-name .full{
  font-size:15px;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.2;
}
.brand-name .tag{
  font-size:11.5px;
  color:#bcd2de;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.2;
}
nav.main-nav{
  display:flex;
  align-items:center;
  height:100%;
  flex:1;
  justify-content:center;
  overflow:hidden;
}
nav.main-nav ul{
  list-style:none;margin:0;padding:0;
  display:flex;align-items:center;height:100%;
  gap:2px;
}
nav.main-nav li{height:100%;display:flex;align-items:center;}
nav.main-nav a{
  display:flex;align-items:center;height:100%;
  padding:0 14px;
  font-size:14px;
  font-weight:600;
  color:#d7e4ea;
  white-space:nowrap;
  border-bottom:3px solid transparent;
  margin-bottom:-3px;
}
nav.main-nav a:hover{color:var(--nyr-text-invert);}
nav.main-nav li.current-menu-item a,
nav.main-nav a.active{
  color:var(--nyr-text-invert);
  border-bottom-color:var(--nyr-amber);
}
.header-actions{
  display:flex;align-items:center;gap:10px;flex:0 0 auto;
}
/* Thai / English switch — two-segment pill, current language filled amber. */
.lang-switch{
  display:inline-flex;align-items:center;gap:2px;flex:0 0 auto;
  height:36px;padding:3px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.55);
  background:rgba(255,255,255,0.10);
}
.lang-switch a{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;height:28px;padding:0 12px;
  border-radius:999px;
  color:var(--nyr-text-invert);
  font-size:13px;font-weight:700;letter-spacing:0.03em;line-height:1;
  text-decoration:none;white-space:nowrap;
  transition:background-color .15s ease,color .15s ease;
}
.lang-switch a:hover{background:rgba(255,255,255,0.18);}
.lang-switch a.is-current{background:var(--nyr-amber);color:var(--nyr-navy-dark);}
.lang-switch a:focus-visible{outline:2px solid var(--nyr-text-invert);outline-offset:2px;}
#nav-toggle{
  display:none;
  width:40px;height:40px;flex:0 0 40px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,0.35);
  background:transparent;
  color:var(--nyr-text-invert);
  font-size:18px;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:44px;padding:0 22px;
  border-radius:var(--radius);
  font-size:14px;font-weight:700;
  border:2px solid transparent;
  white-space:nowrap;
}
.btn-primary{background:var(--nyr-amber);color:var(--nyr-navy-dark);}
.btn-primary:hover{background:var(--nyr-amber-dark);}
.btn-outline{background:transparent;border-color:var(--nyr-navy);color:var(--nyr-navy);}
.btn-outline:hover{background:var(--nyr-navy);color:var(--nyr-text-invert);}
.btn-outline-invert{background:transparent;border-color:rgba(255,255,255,0.6);color:var(--nyr-text-invert);}
.btn-outline-invert:hover{background:rgba(255,255,255,0.15);}
.btn-sm{height:36px;padding:0 16px;font-size:13px;}

/* ---------- Footer ---------- */
footer.site-footer{
  background:var(--nyr-navy-dark);
  color:#c7d6dd;
  padding:48px 0 24px;
  margin-top:64px;
}
footer .foot-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:32px;
}
footer h4{color:var(--nyr-text-invert);font-size:14px;margin:0 0 14px;}
footer ul{list-style:none;margin:0;padding:0;}
footer li{margin-bottom:8px;font-size:13.5px;}
footer a:hover{color:var(--nyr-amber);}
.foot-social{display:flex;gap:10px;margin-top:14px;}
.foot-social a{
  width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,0.08);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;
}
.foot-bottom{
  border-top:1px solid rgba(255,255,255,0.12);
  margin-top:32px;padding-top:20px;
  font-size:12.5px;color:#93a8b1;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;
}

/* ---------------- Page content ---------------- */
.section{padding:56px 0;}
.container.section{padding-left:24px;padding-right:24px;}
.section-alt{background:var(--nyr-surface);border-top:1px solid var(--nyr-border);border-bottom:1px solid var(--nyr-border);}
.page-head{margin-bottom:32px;}
.page-head h1{font-size:30px;margin:0 0 10px;color:var(--nyr-navy-dark);}
.page-lede{color:var(--nyr-text-soft);max-width:720px;font-size:15.5px;margin:0;}
.section h2{font-size:20px;color:var(--nyr-navy-dark);margin:0 0 10px;}
.section-lede{color:var(--nyr-text-soft);max-width:720px;font-size:15px;}

.hero{
  background:linear-gradient(135deg, var(--nyr-navy) 0%, var(--nyr-navy-dark) 100%);
  color:var(--nyr-text-invert);
  padding:72px 0;
}
.hero-inner{max-width:760px;}
.hero-title{font-size:34px;line-height:1.25;margin:0 0 16px;font-weight:800;}
.hero-body{font-size:16px;color:#cfe0e8;margin:0 0 28px;max-width:640px;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;}

.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:20px;}
.cat-card{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  height:120px;border:1px solid var(--nyr-border);border-radius:var(--radius);
  background:var(--nyr-surface);text-align:center;padding:12px;
}
.cat-card:hover{border-color:var(--nyr-amber);}
.cat-icon{font-size:26px;color:var(--nyr-navy);}
.cat-name{font-size:13px;font-weight:600;color:var(--nyr-text);}

.brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px;}
.brand-card{
  height:64px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--nyr-border);border-radius:var(--radius);
  background:var(--nyr-surface);font-weight:700;color:var(--nyr-navy-dark);font-size:14px;
  text-align:center;padding:8px;
}
.brand-card:hover{border-color:var(--nyr-amber);}

.about-block{margin-bottom:36px;max-width:760px;}
.about-block p{color:var(--nyr-text-soft);font-size:15px;}
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px;}
.team-card{
  height:96px;border:1px solid var(--nyr-border);border-radius:var(--radius);
  background:var(--nyr-surface);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  font-size:13.5px;font-weight:600;text-align:center;padding:10px;
}
.team-icon{font-size:22px;color:var(--nyr-navy);}

.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.tabs .tab{
  height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--nyr-border);
  background:var(--nyr-surface);color:var(--nyr-text);font-size:13.5px;font-weight:600;
}
.tabs .tab.active{background:var(--nyr-navy);border-color:var(--nyr-navy);color:var(--nyr-text-invert);}
.filter-bar{display:flex;gap:12px;margin-bottom:24px;flex-wrap:wrap;}
.search-input,.select-input{
  height:42px;border:1px solid var(--nyr-border);border-radius:var(--radius);
  padding:0 14px;font-size:14px;font-family:inherit;background:var(--nyr-surface);color:var(--nyr-text);
}
.search-input{flex:1;min-width:220px;}
.select-input{min-width:220px;}

.cards-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.product-card{
  display:flex;flex-direction:column;
  height:356px;border:1px solid var(--nyr-border);border-radius:var(--radius);
  background:var(--nyr-surface);padding:14px;overflow:hidden;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.product-card:hover{border-color:var(--nyr-amber);box-shadow:0 4px 14px rgba(11,58,82,0.08);}
.product-thumb{
  height:168px;display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid var(--nyr-border);border-radius:var(--radius);
  margin-bottom:12px;flex:0 0 168px;overflow:hidden;padding:8px;
}
.product-thumb img{max-height:100%;max-width:100%;width:auto;height:auto;object-fit:contain;}
.product-icon{font-size:30px;color:var(--nyr-navy);}
.product-type{
  font-size:11px;text-transform:uppercase;letter-spacing:0.04em;
  color:var(--nyr-amber-dark);font-weight:700;margin-bottom:4px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:0 0 auto;
}
.product-name{
  font-size:14.5px;font-weight:600;color:var(--nyr-text);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  line-height:1.35;flex:0 0 auto;
}
.product-summary{
  margin-top:6px;font-size:12.5px;line-height:1.45;color:var(--nyr-text-soft);
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;
}
.detail-head{display:flex;gap:20px;align-items:flex-start;margin-bottom:28px;flex-wrap:wrap;}
.detail-thumb{width:96px;height:96px;flex:0 0 96px;}
.detail-thumb .product-icon{font-size:36px;}
.detail-name{font-size:26px;margin:6px 0 14px;color:var(--nyr-navy-dark);}
.specs-table{width:100%;border-collapse:collapse;margin-top:12px;max-width:560px;}
.specs-table th,.specs-table td{
  text-align:left;padding:10px 14px;border-bottom:1px solid var(--nyr-border);font-size:14px;
}
.specs-table th{width:220px;color:var(--nyr-text-soft);font-weight:600;}

.news-list{display:flex;flex-direction:column;gap:20px;max-width:680px;}
.news-item{border-bottom:1px solid var(--nyr-border);padding-bottom:18px;}
.news-date{font-size:12.5px;color:var(--nyr-text-soft);margin-bottom:4px;}
.news-item h3{margin:0 0 8px;font-size:16px;}
.link-more{font-size:13.5px;font-weight:600;color:var(--nyr-navy);}

.project-card{
  background:var(--nyr-surface);border:1px solid var(--nyr-border);border-radius:var(--radius);
  padding:28px;max-width:760px;margin-bottom:20px;
}
.project-card h2{margin-top:0;}

.jobs-list{display:flex;flex-direction:column;gap:12px;max-width:680px;}
.job-item{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  border:1px solid var(--nyr-border);border-radius:var(--radius);padding:16px 20px;background:var(--nyr-surface);
}
.job-item h3{margin:0;font-size:15px;}

.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:40px;}
.contact-row{margin-bottom:22px;}
.contact-row h3{font-size:13px;text-transform:uppercase;letter-spacing:0.04em;color:var(--nyr-text-soft);margin:0 0 6px;}
.contact-row p{margin:0;font-size:15px;}
.line-qr{
  width:96px;height:96px;border:1px dashed var(--nyr-border);border-radius:var(--radius);
  display:flex;align-items:center;justify-content:center;color:var(--nyr-text-soft);font-size:12px;
  margin:8px 0;
}
.line-qr img{max-width:100%;max-height:100%;}
.contact-form{display:flex;flex-direction:column;gap:14px;}
.contact-form label{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:600;color:var(--nyr-text);}
.contact-form input,.contact-form textarea{
  border:1px solid var(--nyr-border);border-radius:var(--radius);padding:10px 12px;
  font-family:inherit;font-size:14px;color:var(--nyr-text);
}
.contact-form .btn{align-self:flex-start;}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.form-msg{font-size:13.5px;color:var(--nyr-navy-dark);font-weight:600;min-height:18px;}
.form-msg.is-error{color:#b3261e;}

/* ---------- Products: brand-structured catalog ----------
   Grouping mirrors each manufacturer's own site (brand › category ›
   sub-category). Uses the existing tokens only — no new colors. */
.catalog-summary{font-size:13px;color:var(--nyr-text-soft);margin:-8px 0 16px;}
.catalog-summary a{color:var(--nyr-navy);font-weight:600;}
.catalog-jump{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px;}
.catalog-jump a{
  display:inline-flex;align-items:center;gap:6px;
  min-height:32px;padding:4px 12px;border-radius:999px;
  border:1px solid var(--nyr-border);background:var(--nyr-surface);
  font-size:12.5px;font-weight:600;color:var(--nyr-text);line-height:1.3;
}
.catalog-jump a:hover{border-color:var(--nyr-amber);}
.catalog-jump .n,.catalog-sub-title .n{
  font-variant-numeric:tabular-nums;color:var(--nyr-text-soft);font-weight:500;
}
.catalog-jump-brands{margin-bottom:36px;}
.catalog-brand{margin-bottom:56px;scroll-margin-top:calc(var(--nav-height) + 16px);}
.catalog-brand-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;
  border-bottom:3px solid var(--nyr-amber);padding-bottom:10px;margin-bottom:16px;
}
.section .catalog-brand-head h2{font-size:22px;margin:0;color:var(--nyr-navy-dark);}
.catalog-count{font-size:12.5px;color:var(--nyr-text-soft);font-weight:600;}
.catalog-group{margin-bottom:40px;scroll-margin-top:calc(var(--nav-height) + 16px);}
.catalog-group-title{
  display:flex;align-items:center;gap:10px;
  font-size:18px;color:var(--nyr-navy-dark);margin:0 0 4px;
}
.catalog-glyph{color:var(--nyr-navy);font-size:18px;line-height:1;}
.catalog-sub{margin-top:18px;scroll-margin-top:calc(var(--nav-height) + 16px);}
.catalog-sub-title{
  display:flex;align-items:center;gap:8px;
  font-size:12.5px;text-transform:uppercase;letter-spacing:0.04em;
  color:var(--nyr-text-soft);font-weight:700;margin:0 0 10px;
}
.catalog-sub-title::after{content:"";flex:1;height:1px;background:var(--nyr-border);}
html{scroll-behavior:smooth;}
/* ---------- Product detail ---------- */
.pd-head{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:36px;align-items:start;margin-bottom:28px;}
.pd-stage{
  aspect-ratio:4/3;background:#fff;border:1px solid var(--nyr-border);border-radius:var(--radius);
  display:flex;align-items:center;justify-content:center;overflow:hidden;padding:16px;
}
.pd-stage img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;}
.pd-icon{font-size:64px;}
.pd-thumbs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.pd-thumb{
  width:72px;height:72px;padding:4px;background:#fff;border:1px solid var(--nyr-border);
  border-radius:var(--radius);display:flex;align-items:center;justify-content:center;
}
.pd-thumb img{max-width:100%;max-height:100%;object-fit:contain;}
.pd-thumb.is-active,.pd-thumb:hover{border-color:var(--nyr-amber);}
.pd-intro .detail-name{margin-top:6px;}
.pd-summary{font-size:15.5px;color:var(--nyr-text-soft);margin:0 0 18px;}
.pd-actions{display:flex;flex-wrap:wrap;gap:10px;}
.pd-toc{
  position:sticky;top:var(--nav-height);z-index:5;display:flex;gap:6px;flex-wrap:wrap;
  background:var(--nyr-bg);padding:10px 0;margin-bottom:8px;border-bottom:1px solid var(--nyr-border);
}
.pd-toc a{font-size:13px;font-weight:600;color:var(--nyr-navy);padding:6px 12px;border:1px solid var(--nyr-border);border-radius:999px;background:var(--nyr-surface);}
.pd-toc a:hover{border-color:var(--nyr-amber);}
.pd-section{padding-top:20px;margin-bottom:28px;scroll-margin-top:calc(var(--nav-height) + 56px);}
.pd-section h2{font-size:20px;color:var(--nyr-navy-dark);margin:0 0 14px;padding-bottom:8px;border-bottom:2px solid var(--nyr-amber);display:inline-block;}
.pd-content{max-width:860px;}
.pd-content h3{font-size:16.5px;color:var(--nyr-navy);margin:22px 0 8px;}
.pd-content h4{font-size:15px;margin:18px 0 6px;}
.pd-content ul{padding-left:20px;}
.pd-content li{margin-bottom:4px;}
.pd-content figure{margin:16px 0;}
.pd-content img{max-width:100%;height:auto;border-radius:var(--radius);}
.pd-content .pd-figs{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;}
.pd-table-title{font-size:15px;color:var(--nyr-navy);margin:18px 0 6px;}
.pd-table-wrap{overflow-x:auto;margin-bottom:12px;}
.specs-table-wide{max-width:none;}
.specs-table-wide thead th{background:var(--nyr-navy);color:#fff;text-align:left;}
.pd-docs{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;}
.pd-docs a{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--nyr-surface);border:1px solid var(--nyr-border);border-radius:var(--radius);}
.pd-docs a:hover{border-color:var(--nyr-amber);}
.pd-doc-type{flex:0 0 auto;font-size:11px;font-weight:700;color:#fff;background:var(--nyr-navy);border-radius:4px;padding:4px 6px;}
.pd-doc-title{flex:1;font-size:14px;font-weight:600;color:var(--nyr-text);}
.pd-doc-size{flex:0 0 auto;font-size:12px;color:var(--nyr-text-soft);}
.pd-videos{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px;}
.pd-video{margin:0;}
.pd-video-frame{position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--radius);overflow:hidden;}
.pd-video-frame iframe,.pd-video-frame video{position:absolute;inset:0;width:100%;height:100%;border:0;}
.pd-video figcaption{font-size:13px;color:var(--nyr-text-soft);margin-top:6px;}
.pd-source{font-size:12.5px;color:var(--nyr-text-soft);border-top:1px solid var(--nyr-border);padding-top:14px;margin-top:32px;}
.pd-source a{color:var(--nyr-navy);font-weight:600;margin-left:6px;}

@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto;}}

@media (max-width: 860px){
  nav.main-nav{
    position:fixed;top:var(--nav-height);left:0;right:0;bottom:0;
    background:var(--nyr-navy);
    flex-direction:column;justify-content:flex-start;
    transform:translateX(100%);
    transition:transform .2s ease;
    overflow-y:auto;
  }
  nav.main-nav.open{transform:translateX(0);}
  nav.main-nav ul{flex-direction:column;width:100%;height:auto;gap:0;}
  nav.main-nav li{height:auto;width:100%;}
  nav.main-nav a{height:52px;width:100%;padding:0 24px;border-bottom:1px solid rgba(255,255,255,0.08);margin-bottom:0;}
  #nav-toggle{display:flex;align-items:center;justify-content:center;}
  footer .foot-grid{grid-template-columns:1fr;}
  .hero-title{font-size:26px;}
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .brand-grid{grid-template-columns:1fr;}
  .team-grid{grid-template-columns:1fr;}
  .cards-grid{grid-template-columns:repeat(2,1fr);}
  .pd-head{grid-template-columns:1fr;gap:20px;}
  .pd-videos{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .filter-bar{flex-direction:column;}
  .section .catalog-brand-head h2{font-size:19px;}
  .catalog-group-title{font-size:16px;}
  .search-input,.select-input{width:100%;}
}

@media (max-width: 480px){
  .cat-grid{grid-template-columns:1fr;}
  .cards-grid{grid-template-columns:1fr;}
  .product-card{height:auto;min-height:0;}
  .pd-docs{grid-template-columns:1fr;}
  .page-head h1{font-size:24px;}
}

/* NYR logo placeholder (products without a photo) */
.nyr-logo-ph{width:auto;height:72%;max-width:72%;object-fit:contain;opacity:.9;}
.pd-stage .nyr-logo-ph{height:55%;max-width:55%;}

/* 2026-10-14 home: categories grouped by brand; 4-up brand grid on desktop */
.home-brand-head{font-size:15px;margin:28px 0 0;color:var(--nyr-navy-dark);}
.home-brand-head a:hover{color:var(--nyr-amber);}
@media (min-width: 861px){
  .brand-grid.brand-grid-4{grid-template-columns:repeat(4,1fr);}
}

/* 2026-10-15: orange header bar — the old nyr.co.th header orange #EF950B
   (rgb 239,149,11), with the logo's ink #252122 for text (contrast ~6:1). Everything below the header (hero,
   sections, footer, mobile menu panel) keeps the navy/amber palette. */
:root{
  --nyr-orange:#EF950B;
  --nyr-orange-dark:#B86E00;
  --nyr-ink:#252122;
}
.site-header{background:var(--nyr-orange);border-bottom-color:#000;} /* 2026-10-15: strip under the header black (was orange-dark) */
.brand-name{color:var(--nyr-ink);}
.brand-name .tag{color:rgba(37,33,34,0.8);}
.lang-switch{border-color:rgba(37,33,34,0.55);background:rgba(255,255,255,0.22);}
.lang-switch a{color:var(--nyr-ink);}
.lang-switch a:hover{background:rgba(255,255,255,0.4);}
.lang-switch a.is-current{background:var(--nyr-ink);color:#fff;}
.lang-switch a:focus-visible{outline-color:var(--nyr-ink);}
#nav-toggle{border-color:rgba(37,33,34,0.55);color:var(--nyr-ink);}
@media (min-width: 861px){
  nav.main-nav a{color:rgba(37,33,34,0.85);}
  nav.main-nav a:hover{color:var(--nyr-ink);}
  nav.main-nav li.current-menu-item a,
  nav.main-nav a.active{color:var(--nyr-ink);border-bottom-color:var(--nyr-ink);}
}
/* Home brand row: one equal column per brand card (3 since 2026-10-15). */
@media (min-width: 861px){
  .brand-grid.brand-grid-4{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:1fr;}
}

/* 2026-10-15 (v0.2.9/v0.3.0) home: three full-width brand bands on photo banners
   (assets/img/home/, 1500x500). Each banner's left side is a solid deep tone
   so the copy sits there; buttons use the header orange #EF950B + ink.
   Under 861 px (phones, Fold cover + inner screen, tablets portrait) the band
   stacks a 16:10 photo crop (*-m.jpg) above the copy on the band colour. */
.btn-orange{background:var(--nyr-orange);color:var(--nyr-ink);border-color:var(--nyr-orange);}
.btn-orange:hover{background:#F7A934;border-color:#F7A934;color:var(--nyr-ink);}
.btn-orange:focus-visible{outline:2px solid #fff;outline-offset:2px;}
.home-band{
  --band:#541c22; --band-rgb:84,22,28;
  position:relative;
  display:flex;align-items:center;
  min-height:clamp(380px, 33.34vw, 600px);
  background-color:var(--band);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:right center;
  color:var(--nyr-text-invert);
  overflow:hidden;
}
.home-band-tecniplast{--band:#14422e; --band-rgb:20,66,46;}
.home-band-bmt{--band:#163462; --band-rgb:22,52,98;}
/* Keeps the copy on solid colour when the photo is scaled up (narrow desktops, long Thai text). */
.home-band::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg, rgba(var(--band-rgb),0.92) 0%, rgba(var(--band-rgb),0.80) 30%, rgba(var(--band-rgb),0) 58%);
}
.home-band + .home-band{border-top:1px solid rgba(255,255,255,0.12);}
.home-band-media{display:none;}
.home-band-inner{position:relative;width:100%;padding-top:48px;padding-bottom:48px;}
.home-band-copy{max-width:500px;}
.home-band-brand{
  margin:0 0 10px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--nyr-orange);
}
.home-band-title{font-size:30px;line-height:1.25;margin:0 0 14px;font-weight:800;color:#fff;}
.home-band-body{font-size:15.5px;line-height:1.65;color:rgba(255,255,255,0.9);margin:0 0 24px;}
@media (min-width: 861px) and (max-width: 1180px){
  .home-band-copy{max-width:440px;}
  .home-band::before{background:linear-gradient(90deg, rgba(var(--band-rgb),0.94) 0%, rgba(var(--band-rgb),0.86) 40%, rgba(var(--band-rgb),0) 70%);}
}
@media (max-width: 860px){
  .home-band{display:block;min-height:0;background-image:none !important;}
  .home-band::before{display:none;}
  .home-band-media{display:block;position:relative;width:100%;aspect-ratio:16/10;max-height:460px;overflow:hidden;}
  .home-band-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
  .home-band-media::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:28%;
    background:linear-gradient(180deg, rgba(var(--band-rgb),0) 0%, var(--band) 100%);
  }
  .home-band-inner{padding-top:8px;padding-bottom:40px;}
  .home-band-copy{max-width:640px;}
  .home-band-title{font-size:24px;}
  .home-band-body{font-size:15px;}
  .btn-orange{white-space:normal;height:auto;min-height:44px;padding:10px 20px;text-align:center;}
}
@media (max-width: 400px){
  .home-band-title{font-size:22px;}
  .btn-orange{width:100%;}
}

/* 2026-10-15 (v0.3.1): About NYR quality block, Special Projects gallery, Contact map */
.about-block ul{color:var(--nyr-text-soft);font-size:15px;padding-left:22px;}
.about-block li{margin-bottom:6px;}
.about-quality h2{font-size:20px;margin:0 0 14px;}
.about-iso{display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.about-iso img{width:300px;max-width:100%;height:auto;border:1px solid var(--nyr-border);border-radius:var(--radius);background:#fff;padding:8px;}
.about-iso p{margin:0;flex:1 1 220px;}
.sp-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 0 36px;max-width:1000px;}
.sp-gallery figure{margin:0;}
.sp-gallery img{display:block;width:100%;height:auto;aspect-ratio:500/357;object-fit:cover;border-radius:var(--radius);border:1px solid var(--nyr-border);}
.contact-map{margin-top:40px;border:1px solid var(--nyr-border);border-radius:var(--radius);overflow:hidden;background:var(--nyr-surface);}
.contact-map iframe{display:block;width:100%;height:420px;border:0;}
@media (max-width: 860px){
  .sp-gallery{grid-template-columns:1fr;max-width:520px;}
  .contact-map iframe{height:320px;}
}

/* 2026-10-16 (v0.3.2): product page on phones — the long brand/category line
   (nowrap) made the single grid column wider than the screen, pushing the
   photo, title and summary off the right edge. */
.pd-head > *{min-width:0;}
.pd-intro .product-type{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.5;}
.pd-summary,.pd-content{overflow-wrap:anywhere;}
.pd-content table{display:block;max-width:100%;overflow-x:auto;}
.pd-content iframe,.pd-content video{max-width:100%;}
.pd-section{min-width:0;}
@media (max-width: 860px){
  .pd-head{grid-template-columns:minmax(0,1fr);}
  .pd-stage{padding:10px;}
  .pd-thumbs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;scrollbar-width:thin;}
  .pd-thumb{flex:0 0 60px;width:60px;height:60px;}
  .detail-name{font-size:24px;}
}
@media (max-width: 480px){
  .product-detail.container.section{padding-left:16px;padding-right:16px;}
  .pd-actions .btn{flex:1 1 0;white-space:normal;height:auto;min-height:40px;padding-top:8px;padding-bottom:8px;text-align:center;}
  .pd-actions .btn-primary{flex-basis:100%;}
  .pd-summary{font-size:15px;}
}
.about-photo{margin:0 0 36px;max-width:570px;}
.about-photo img{display:block;width:100%;height:auto;border-radius:var(--radius);border:1px solid var(--nyr-border);}

/* 2026-10-16: products page — center brand tab text; stop the search box
   collapsing on phones (flex:1 on a column flex container zeroed its height). */
.tabs .tab{display:inline-flex;align-items:center;justify-content:center;line-height:1.2;text-align:center;text-decoration:none;}
@media (max-width: 860px){
  .filter-bar{align-items:stretch;}
  .search-input,.select-input{flex:0 0 auto;width:100%;min-width:0;height:46px;box-sizing:border-box;font-size:16px;}
}

/* 2026-10-16: partner brand logos in the footer (Thermo Fisher Scientific, Tecniplast, BMT). */
.foot-partners{margin-top:32px;padding-top:24px;border-top:1px solid rgba(255,255,255,0.12);}
.foot-partner-logos{display:flex;flex-wrap:wrap;gap:16px;align-items:center;}
.foot-partner-logos li{margin:0;}
.foot-partner-logos a{display:flex;align-items:center;justify-content:center;height:64px;padding:0 20px;background:#fff;border-radius:6px;}
.foot-partner-logos a:hover{background:#fff;box-shadow:0 0 0 2px var(--nyr-amber);}
.foot-partner-logos img{display:block;height:auto;max-height:40px;width:auto;max-width:100%;}
.foot-partner-logos li:first-child img{max-height:48px;}
.foot-partner-logos li:last-child img{height:48px;width:33px;}
@media (max-width:860px){
  .foot-partner-logos li{flex:1 1 calc(50% - 8px);}
  .foot-partner-logos a{padding:0 12px;}
}

/* 2026-10-16: footer "Site" menu column removed — two columns remain (about, contact). */
footer .foot-grid{grid-template-columns:1.4fr 1fr;}
@media (max-width:860px){footer .foot-grid{grid-template-columns:1fr;}}

/* 2026-10-19 (v0.3.6): home hero lined up with the brand-band copy column.
   .hero-inner had max-width:760px, which (with the container's auto margins)
   centred the hero text in a 760 px box, so it started ~210 px right of the
   band copy on wide screens. Now the hero uses the full container like the
   bands, and the title/intro share the band copy's width, size and line height. */
.hero-inner{max-width:var(--container-w);}
.hero-title,.hero-body{max-width:500px;}
.hero-title{font-size:30px;line-height:1.25;margin:0 0 14px;}
.hero-body{font-size:15.5px;line-height:1.65;margin:0;}
@media (min-width: 861px) and (max-width: 1180px){
  .hero-title,.hero-body{max-width:440px;}
}
@media (max-width: 860px){
  .hero{padding:48px 0 40px;}
  .hero-title,.hero-body{max-width:640px;}
  .hero-title{font-size:24px;}
  .hero-body{font-size:15px;}
}
@media (max-width: 400px){
  .hero-title{font-size:22px;}
}

/* 2026-10-19 (v0.3.8): home hero — fixed 480 px height at every window width (min-height: it only grows if a
   device font makes the copy taller than 432 px); the dial art
   is scaled to that height and cropped from the left as the window narrows (it does not need
   to show in full). Readability: a navy scrim sits between the art and the copy —
   desktop: solid behind the text column, fading out to its right;
   under 861 px (copy spans the full width): an even navy veil over the whole art. */
.hero{
  position:relative;display:flex;align-items:center;
  min-height:480px;height:auto;padding:24px 0;box-sizing:border-box;
  background:
    linear-gradient(90deg,
      rgba(9,45,64,0.94) 0,
      rgba(9,45,64,0.94) max(490px, calc(50% - 40px)),
      rgba(9,45,64,0) calc(max(490px, calc(50% - 40px)) + 200px)),
    url('assets/img/home/home-hero.png') no-repeat right center / auto 100%,
    linear-gradient(135deg, var(--nyr-navy) 0%, var(--nyr-navy-dark) 100%);
}
.hero-inner{position:relative;width:100%;}
.hero-body{color:rgba(255,255,255,0.92);}
@media (max-width: 860px){
  .hero{
    display:flex;min-height:480px;padding:24px 0;
    background:
      linear-gradient(rgba(9,45,64,0.80), rgba(9,45,64,0.80)),
      url('assets/img/home/home-hero.png') no-repeat right center / auto 100%,
      linear-gradient(135deg, var(--nyr-navy) 0%, var(--nyr-navy-dark) 100%);
  }
  .hero-title,.hero-body{text-shadow:0 1px 2px rgba(4,24,36,0.7);}
}
@media (max-width: 480px){
  .hero{
    background:
      linear-gradient(rgba(9,45,64,0.80), rgba(9,45,64,0.80)),
      url('assets/img/home/home-hero-m.png') no-repeat right bottom / auto 100%,
      linear-gradient(135deg, var(--nyr-navy) 0%, var(--nyr-navy-dark) 100%);
  }
}
/* 2026-10-19 (v0.3.9): small phones — keeps the hero at 480 px down to ~300 px wide (English copy is longest). */
@media (max-width: 400px){
  .hero{padding:16px 0;}
  .hero-body{font-size:14.5px;line-height:1.6;}
}