/* ============================================================
   YUEYI CNC — WordPress layer
   Adds what a static page never needs: admin-bar offsets, nav
   dropdowns, page heroes, Contact Form 7 styling, blog cards.
   Loaded after site.css, so it can safely override it.
   ============================================================ */

/* ---------- accessibility ---------- */
.skip{position:absolute;left:-9999px;top:0;z-index:200}
.skip:focus{left:16px;top:12px;background:#fff;color:var(--blue);padding:10px 18px;border-radius:9px;
  font-weight:700;box-shadow:var(--shadow);outline:2px solid var(--accent)}

/* ---------- admin bar ---------- */
body.admin-bar header{top:32px}
body.admin-bar .mnav{top:104px}
@media(max-width:782px){
  body.admin-bar header{top:46px}
  body.admin-bar .mnav{top:118px}
}

/* ---------- desktop navigation ---------- */
nav .navitem{position:relative;display:flex;align-items:center}
nav .navitem > a{white-space:nowrap}
nav .has-sub > a:after{content:"\25BE";font-size:9px;margin-left:6px;opacity:.6;display:inline-block;vertical-align:1px}
nav .sub{position:absolute;top:calc(100% + 14px);left:-16px;min-width:274px;background:#fff;
  border:1px solid var(--line);border-radius:13px;box-shadow:0 18px 40px -14px rgba(11,28,61,.3);
  padding:9px;display:none;gap:1px;z-index:60}
nav .sub:before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px}
nav .has-sub:hover .sub,nav .has-sub:focus-within .sub{display:grid}
nav .sub a{font-size:13.4px;font-weight:600;color:var(--ink2);padding:9px 12px;border-radius:8px;
  border-bottom:none;white-space:nowrap;transition:.12s}
nav .sub a:hover{background:var(--bg2);color:var(--blue)}
nav .navitem.on > a{color:var(--blue);border-bottom-color:var(--accent)}

/* language switcher reuses the same dropdown mechanics */
.lang.has-sub{position:relative;display:flex;align-items:center;cursor:default}
.lang.has-sub > span{white-space:nowrap}
.lang .sub{position:absolute;top:calc(100% + 12px);left:auto;right:-8px;min-width:150px;display:none}
.lang .sub a{padding:8px 12px}
.lang.has-sub:hover .sub,.lang.has-sub:focus-within .sub{display:grid}

/* ---------- mobile drawer ---------- */
.mnav{display:none}
.mnav.open{display:block}
.mnav details{border-bottom:1px solid var(--line)}
.mnav summary{padding:14px 0;font-size:16px;font-weight:600;color:var(--ink2);cursor:pointer;list-style:none;
  display:flex;justify-content:space-between;align-items:center}
.mnav summary::-webkit-details-marker{display:none}
.mnav summary:after{content:"+";font-weight:700;color:var(--muted)}
.mnav details[open] summary:after{content:"\2212"}
.mnav details a{padding:11px 0 11px 14px;border-bottom:1px solid #f1f5fa;font-size:15px;font-weight:500;display:block}
.mnav details a:last-child{border-bottom:none}
.mnav details .sub-first{color:var(--blue);font-weight:600}

/* ---------- landing wrapper ---------- */
.landing{display:flow-root}
.landing > section:first-child{margin-top:0}

/* ---------- page hero (inner pages) ---------- */
.phero .sub{font-size:16px;color:#c3d2ea;line-height:1.7;max-width:700px}
.phero .crumb{margin-bottom:16px}
.phero .chips{margin:22px 0 0}

/* ---------- generic prose pages ---------- */
.prose{max-width:820px}
.prose h2:first-child,.prose h3:first-child{margin-top:0}
.prose table{font-size:13.8px}
.prose .tbl-wrap + h2{margin-top:34px}
.prose blockquote{border-left:3px solid var(--accent);background:var(--bg2);border-radius:0 10px 10px 0;
  padding:18px 22px;margin:24px 0;color:var(--ink2)}
.prose img{border-radius:12px;margin:22px 0}
.prose iframe{max-width:100%;border-radius:12px}
.prose hr{border:none;border-top:1px solid var(--line);margin:34px 0}
.prose .btn,.prose a.btn{border-bottom:none;color:#fff}
.prose a.btn-line{color:var(--blue)}

/* Elementor-built pages keep their own layout */
.elementor-host{padding:0}
.elementor-host .elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px}
.elementor-host .elementor-widget-text-editor p{color:inherit}
.elementor-host .elementor-button{border-radius:9px}

/* ---------- cards / grids used by 404 + archives ---------- */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px 22px;transition:.18s}
.card:hover{box-shadow:var(--shadow);transform:translateY(-2px);border-color:#d5e0f0}
.card h3{font-size:17px;font-weight:800;margin-bottom:8px;letter-spacing:-.2px}
.card p{font-size:14px;color:var(--ink2);line-height:1.65}

/* ---------- blog ---------- */
.postgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.postcard{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:.18s}
.postcard:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.postcard .thumb{display:block;aspect-ratio:16/10;background:var(--bg2);overflow:hidden}
.postcard .thumb img{width:100%;height:100%;object-fit:cover}
.postcard .thumb-ph{display:flex;align-items:center;justify-content:center;height:100%;font-weight:800;
  letter-spacing:.22em;color:#c3d0e6;font-size:13px}
.pc-body{padding:20px 20px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.pc-meta{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700}
.pc-body h2{font-size:17.5px;line-height:1.35;letter-spacing:-.2px;font-weight:800}
.pc-body h2 a:hover{color:var(--blue)}
.pc-body p{font-size:14px;color:var(--ink2);line-height:1.65}
.pc-more{margin-top:auto;font-size:13.5px;font-weight:700;color:var(--blue)}
.pager{margin-top:36px;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.pager .page-numbers{padding:9px 15px;border:1px solid var(--line);border-radius:9px;font-size:13.5px;font-weight:600;color:var(--ink2)}
.pager .page-numbers.current{background:var(--navy);color:#fff;border-color:var(--navy)}
.pager .page-numbers:hover{border-color:var(--blue);color:var(--blue)}

/* ---------- closing CTA ---------- */
.cta{background:linear-gradient(100deg,#0b1c3d 0%,#0f2a5c 62%,#123a8f 100%);color:#fff;padding:64px 0}
.cta .wrap{display:grid;grid-template-columns:1fr auto;gap:44px;align-items:center}
.cta h2{font-size:31px;line-height:1.2;letter-spacing:-.7px;font-weight:800;margin-bottom:12px;max-width:620px}
.cta p{font-size:15.5px;color:#c3d2ea;line-height:1.7;max-width:620px;margin-bottom:20px}
.cta .chips{margin-bottom:0}
.cta-act{display:flex;flex-direction:column;gap:10px;align-items:stretch;min-width:260px}
.cta-act .btn{justify-content:center}

/* ---------- Contact Form 7 ---------- */
.wpcf7{max-width:100%}
.wpcf7 form{margin:0}
.wpcf7-form p{margin:0 0 15px;font-size:12px;font-weight:700;color:var(--ink2);letter-spacing:.01em;line-height:1.5}
.wpcf7-form .wpcf7-form-control-wrap{display:block;margin-top:6px}
.wpcf7-form .wpcf7-form-control:not(.wpcf7-submit){
  display:block;width:100%;border:1px solid #d8e1ee;border-radius:9px;background:#fff;padding:11px 13px;
  font-family:inherit;font-size:14px;font-weight:400;line-height:1.5;color:var(--ink);transition:.15s;
  box-shadow:none;-webkit-appearance:none
}
.wpcf7-form textarea.wpcf7-form-control{min-height:112px;resize:vertical}
.wpcf7-form select.wpcf7-form-control{background-image:none}
.wpcf7-form .wpcf7-form-control:focus{border-color:var(--blue-l);box-shadow:0 0 0 3px rgba(42,95,212,.1);outline:none}
.wpcf7-form .wpcf7-not-valid{border-color:#e0a19a}
.wpcf7-form input[type="file"].wpcf7-form-control{
  border:1.5px dashed #c3d0e6;background:#f8fafd;padding:20px 14px;cursor:pointer;border-radius:11px;
  font-size:13px;color:var(--muted);font-weight:600
}
.wpcf7-form input[type="file"].wpcf7-form-control:hover{border-color:var(--blue-l);background:#f4f8ff}
.wpcf7-form input.wpcf7-submit{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;
  background:var(--accent);color:#fff;border:none;border-radius:9px;padding:15px 26px;
  font-family:inherit;font-size:15.5px;font-weight:700;cursor:pointer;transition:.18s;
}
.wpcf7-form input.wpcf7-submit:hover{background:var(--accent-d)}
.wpcf7-form input.wpcf7-submit:disabled{opacity:.7;cursor:progress}
.wpcf7-spinner{position:absolute;left:50%;margin-left:-12px;margin-top:6px;background:transparent}
.wpcf7-form .wpcf7-spinner:before{background-color:var(--accent)}
.wpcf7-not-valid-tip{display:block;color:#c0392b;font-size:12px;font-weight:600;margin-top:6px}
.wpcf7-response-output{margin:18px 0 0!important;padding:13px 16px!important;border-radius:10px!important;
  border:1px solid var(--line)!important;font-size:13.5px;font-weight:500;line-height:1.6;color:var(--ink2);background:var(--bg2)}
.wpcf7 form.sent .wpcf7-response-output{background:#eaf7f1;border-color:#bfe6d3!important;color:#0f6b46}
.wpcf7 form.invalid .wpcf7-response-output,.wpcf7 form.failed .wpcf7-response-output,.wpcf7 form.aborted .wpcf7-response-output{
  background:#fdecea;border-color:#f3c9c2!important;color:#a12a1c}
.wpcf7 form.spam .wpcf7-response-output{background:#fff6e6;border-color:#f1dcb4!important;color:#8a5a10}
.wpcf7-list-item{margin:0}
.wpcf7-acceptance .wpcf7-list-item-label{font-size:13px;font-weight:500;color:var(--ink2);line-height:1.6}

/* ---------- multi-file uploader (3 CF7 slots merged into one picker) ---------- */
.wpcf7-form.yy-mf-on .yy-mf-slot{display:none}
.yy-mf{position:relative;margin-top:6px}
.yy-mf-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
.yy-mf-drop{display:flex;align-items:center;gap:11px;width:100%;text-align:left;cursor:pointer;
  border:1.5px dashed #c3d0e6;background:#f8fafd;border-radius:11px;padding:16px 15px;
  font-family:inherit;transition:.15s}
.yy-mf-drop:hover,.yy-mf.is-over .yy-mf-drop{border-color:var(--blue-l);background:#f4f8ff}
.yy-mf-plus{position:relative;flex:0 0 30px;width:30px;height:30px;border-radius:9px;
  background:#e8eefb;display:block}
.yy-mf-plus:before,.yy-mf-plus:after{content:"";position:absolute;left:50%;top:50%;
  background:var(--blue-l);border-radius:2px;transform:translate(-50%,-50%)}
.yy-mf-plus:before{width:13px;height:2px}
.yy-mf-plus:after{width:2px;height:13px}
.yy-mf-lead{display:block;font-size:13px;font-weight:600;color:var(--ink2);line-height:1.45}
.yy-mf-lead b{font-weight:800;color:var(--blue)}
.yy-mf-sub{display:block;font-size:11.5px;font-weight:500;color:var(--muted);margin-top:3px}
.yy-mf-list{list-style:none;margin:9px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.yy-mf.is-empty .yy-mf-list{display:none}
.yy-mf-list li{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--ink2);
  background:#f2f6fd;border:1px solid #e0e8f4;border-radius:8px;padding:8px 10px}
.yy-mf-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.yy-mf-size{flex:0 0 auto;color:var(--muted);font-variant-numeric:tabular-nums}
.yy-mf-x{flex:0 0 auto;border:0;background:none;cursor:pointer;color:var(--muted);font-size:17px;
  line-height:1;padding:0 2px;font-family:inherit}
.yy-mf-x:hover{color:#c0392b}
.yy-mf-note{margin:8px 0 0;font-size:12px;font-weight:600;color:#a12a1c;line-height:1.5}
.yy-mf-note:empty{display:none}

/* RFQ page: form column + sticky facts */
.qpage .wpcf7-form input[type="file"].wpcf7-form-control{padding:22px 14px}
.qpage .wpcf7-form p:last-of-type{margin-bottom:0}

/* ---------- small screens ---------- */
@media(max-width:960px){
  nav .sub{display:none!important}
  .cta .wrap{grid-template-columns:1fr;gap:26px}
  .cta-act{min-width:0;flex-direction:row;flex-wrap:wrap}
  .cta h2{font-size:26px}
  .grid3{grid-template-columns:1fr}
  .postgrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
  .postgrid{grid-template-columns:1fr}
  .phero h1{font-size:26px}
  .cta-act .btn{width:100%}
}

/* anchor offset for the sticky header */
html{scroll-padding-top:96px}
.yy-file-tip{display:block;margin-top:8px;font-size:12px;font-weight:600;color:#0f6b46}

/* GTranslate selector inside the header */
.lang.gtwrap{display:flex;align-items:center;position:relative;max-width:120px}
.lang.gtwrap .gtranslate_wrapper{width:auto!important}
.lang.gtwrap .gt_switcher{width:auto!important;font-family:inherit!important;line-height:1.2!important}
.lang.gtwrap .gt_selected{background:transparent!important}
.lang.gtwrap .gt_selected a{display:flex!important;align-items:center;gap:6px;border:1px solid var(--line);
  border-radius:8px;padding:7px 10px;background:#fff;font-size:13px!important;font-weight:600;color:var(--ink2)!important;
  white-space:nowrap}
.lang.gtwrap .gt_selected a:hover{border-color:var(--blue-l);color:var(--blue)!important}
.lang.gtwrap .gt_selected a img,
.lang.gtwrap .gt_option a img{display:none!important}
.lang.gtwrap .gt_option{left:auto!important;right:0!important;width:170px!important;max-height:60vh;overflow:auto;
  border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);background:#fff}
.lang.gtwrap .gt_option a{font-size:13px!important;padding:8px 12px!important;color:var(--ink2)!important}
.lang.gtwrap .gt_option a:hover{background:var(--bg2)!important;color:var(--blue)!important}
.lang.gtwrap .gt_current{font-weight:700}

/* ============================================================
   Cookie consent
   A single card, centred over a light scrim. Type, spacing and the
   two buttons follow the client's reference design; the palette
   comes from the site tokens so it does not look pasted on.
   ============================================================ */
.yy-ck{position:fixed;inset:0;z-index:9999999;display:flex;align-items:center;justify-content:center;
  padding:24px;opacity:0;visibility:hidden;transition:opacity .22s ease,visibility .22s}
.yy-ck[hidden]{display:none}
.yy-ck.is-open{opacity:1;visibility:visible}
.yy-ck-scrim{position:absolute;inset:0;background:rgba(8,21,44,.38);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.yy-ck-card{position:relative;width:100%;max-width:660px;background:#fff;border-radius:8px;
  padding:30px 34px 24px;color:#101726;font-size:14.5px;line-height:1.72;
  box-shadow:0 34px 80px -24px rgba(6,18,40,.55),0 2px 6px rgba(6,18,40,.12);
  transform:translateY(10px) scale(.995);transition:transform .24s cubic-bezier(.2,.7,.3,1);max-height:calc(100vh - 48px);overflow:auto}
.yy-ck.is-open .yy-ck-card{transform:none}

.yy-ck-text{margin:0;font-size:14.5px;line-height:1.75;color:#101726}
.yy-ck-card a{color:#101726;text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
.yy-ck-card a:hover{color:var(--accent-d)}

.yy-ck-actions{display:flex;justify-content:center;gap:16px;margin-top:26px}
.yy-ck-btn{min-width:212px;height:44px;padding:0 22px;border-radius:5px;font-size:14.5px;font-weight:600;
  letter-spacing:.01em;cursor:pointer;transition:background .15s,border-color .15s,color .15s;
  display:inline-flex;align-items:center;justify-content:center}
.yy-ck-btn.is-line{background:#fff;border:1.5px solid #15233c;color:#101726}
.yy-ck-btn.is-line:hover{background:#f2f5fa;border-color:#000}
.yy-ck-btn.is-accent{background:var(--accent);border:1.5px solid var(--accent);color:#fff}
.yy-ck-btn.is-accent:hover{background:var(--accent-d);border-color:var(--accent-d)}
.yy-ck-card:focus,.yy-ck-card:focus-visible{outline:none}
.yy-ck-btn:focus-visible,.yy-ck-reject:focus-visible,.yy-ck-open:focus-visible,.yy-ck-sw input:focus-visible + i{
  outline:2px solid var(--blue-l);outline-offset:2px}

.yy-ck-reject{display:block;margin:12px auto 0;background:none;border:0;padding:4px 2px;cursor:pointer;
  font-size:12.5px;font-weight:600;color:#6b7a90;text-decoration:underline;text-underline-offset:2px}
.yy-ck-reject:hover{color:#101726}

/* preferences panel */
.yy-ck-h{font-size:19px;line-height:1.3;font-weight:800;letter-spacing:-.2px;margin:0 0 6px}
.yy-ck-sub{font-size:13.5px;color:#5c6a80;line-height:1.65;margin:0 0 18px}
.yy-ck-rows{border-top:1px solid #e6ecf4}
.yy-ck-row{display:flex;gap:18px;align-items:center;justify-content:space-between;
  padding:15px 0;border-bottom:1px solid #e6ecf4}
.yy-ck-rowtext b{display:block;font-size:14px;font-weight:700;margin-bottom:3px}
.yy-ck-rowtext span{display:block;font-size:12.5px;line-height:1.6;color:#6b7a90;max-width:470px}
.yy-ck-always{flex:0 0 auto;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:#0f6b46;background:#e8f6ee;border-radius:99px;padding:4px 10px}
.yy-ck-sw{position:relative;flex:0 0 46px;width:46px;height:26px;display:block;cursor:pointer}
.yy-ck-sw input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.yy-ck-sw i{position:absolute;inset:0;border-radius:99px;background:#ccd6e4;transition:background .18s;pointer-events:none}
.yy-ck-sw i:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(6,18,40,.3);transition:transform .18s}
.yy-ck-sw input:checked + i{background:var(--accent)}
.yy-ck-sw input:checked + i:after{transform:translateX(20px)}

/* footer trigger */
.yy-ck-open{background:none;border:0;padding:0;cursor:pointer;font:inherit;color:inherit;
  text-decoration:underline;text-underline-offset:2px}
.yy-ck-open:hover{color:#fff}

body.yy-ck-lock{overflow:hidden}

@media (max-width:640px){
  .yy-ck{padding:12px;align-items:flex-end}
  .yy-ck-card{padding:24px 20px 20px;font-size:13.5px;border-radius:10px}
  .yy-ck-text{font-size:13.5px;line-height:1.7}
  .yy-ck-actions{gap:10px;margin-top:20px}
  .yy-ck-btn{min-width:0;flex:1 1 0;height:44px;padding:0 12px;font-size:13.5px}
  .yy-ck-rowtext span{font-size:12px}
}

/* Footer legal row: privacy, cookies, and the consent re-open trigger. */
.fbot .flegal{display:inline-flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:center}
.fbot .flegal a,
.fbot .flegal .yy-ck-open{font-size:11.5px;letter-spacing:.01em;color:#8ea3c2}
.fbot .flegal a:hover,
.fbot .flegal .yy-ck-open:hover{color:#fff}


/* Legal pages: keep the hero text on the same left edge as the body copy. */
.phero.phero-wide .wrap{max-width:1200px}
