:root {
	--wd-text-font: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: #767676;
	--wd-text-font-size: 14px;
	--wd-title-font: var(--wd-text-font);
	--wd-title-font-weight: 600;
	--wd-title-color: #242424;
	--wd-entities-title-font: var(--wd-title-font);
	--wd-entities-title-font-weight: 500;
	--wd-entities-title-color: #333333;
	--wd-entities-title-color-hover: rgb(51 51 51 / 65%);
	--wd-alternative-font: var(--wd-text-font);
	--wd-widget-title-font: var(--wd-title-font);
	--wd-widget-title-font-weight: 600;
	--wd-widget-title-transform: uppercase;
	--wd-widget-title-color: #333;
	--wd-widget-title-font-size: 16px;
	--wd-header-el-font: var(--wd-text-font);
	--wd-header-el-font-weight: 700;
	--wd-header-el-transform: uppercase;
	--wd-header-el-font-size: 13px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(7,47,90);
	--wd-alternative-color: rgb(250,184,21);
	--btn-default-bgcolor: #f7f7f7;
	--btn-default-bgcolor-hover: #efefef;
	--btn-accented-bgcolor: rgb(250,184,21);
	--btn-accented-bgcolor-hover: rgb(4,18,35);
	--wd-form-brd-width: 2px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: #333333;
	--wd-link-color-hover: #242424;
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: #111111;
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: rgb(4,18,35);
	background-image: none;
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}
:root{
--wd-container-w: 1222px;
--wd-form-brd-radius: 0px;
--btn-default-color: #333;
--btn-default-color-hover: #333;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 5px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-accented-bottom-active: -1px;
--btn-accented-brd-radius: 0px;
--btn-accented-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .15);
--btn-accented-box-shadow-hover: inset 0 -2px 0 rgba(0, 0, 0, .15);
--wd-brd-radius: 0px;
}

@media (min-width: 1222px) {
section.elementor-section.wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


.wd-page-title {
background-color: #0a0a0a;
}

/* =====================================================================
   ZINGA HOMEPAGE — COMPLETE STYLES (visual + layout)
   Paste in: Woodmart → Theme Settings → Custom CSS  (or Appearance → Customize → Additional CSS)
   No !important on colors/fonts → anything you change in Elementor panel still wins.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@700;800&family=Inter:wght@400;600;700&display=swap');

/* ---------- BASE ---------- */
:is(.zg-hero,.zg-apps,.zg-dark,.zg-compare,.zg-bar,.zg-cta){font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
:is(.zg-hero,.zg-apps,.zg-dark,.zg-compare,.zg-bar,.zg-cta)>.elementor-container{max-width:1200px;margin-left:auto;margin-right:auto}
:is(.zg-hero,.zg-apps,.zg-dark,.zg-compare,.zg-bar,.zg-cta) .elementor-heading-title{font-family:Archivo,Inter,sans-serif;font-weight:800;text-transform:uppercase;line-height:1.1;letter-spacing:-.01em;margin:0}
:is(.zg-hero,.zg-apps,.zg-dark,.zg-compare,.zg-bar,.zg-cta) .elementor-widget-text-editor p{margin:0}
:is(.zg-hero,.zg-apps,.zg-dark,.zg-compare,.zg-cta) .elementor-icon-box-title{margin:0 0 4px}
:is(.zg-hero,.zg-apps,.zg-dark,.zg-compare,.zg-cta) .elementor-icon i,:is(.zg-hero,.zg-apps,.zg-dark,.zg-compare,.zg-cta) .elementor-icon svg{width:1em;height:1em}
:is(.zg-hero,.zg-apps,.zg-dark,.zg-compare,.zg-bar,.zg-cta) .elementor-icon svg,:is(.zg-hero,.zg-apps,.zg-dark,.zg-compare,.zg-bar,.zg-cta) .elementor-icon-list-icon svg{fill:currentColor}

/* section backgrounds + spacing */
.zg-hero{background:#06122A url("https://zinganew.seocompanyjapan.com/wp-content/uploads/2026/10/herobannerbg.jpg") center center/cover no-repeat;padding:110px 0 170px}
.zg-hero>.elementor-container{min-height:420px;align-items:center}
.zg-apps{background-color:#D7DDE6;padding:0 0 90px}
.zg-dark{background-color:#06122A;padding:100px 0}
.zg-compare{background-color:#F4F6F9;padding:100px 0}
.zg-bar{background-color:#F6B417;padding:22px 0}
.zg-cta{background-color:#0C2B57;padding:100px 0;text-align:center}

/* ---------- BUTTONS ---------- */
:is(.zg-hero,.zg-apps,.zg-cta) .elementor-button{display:inline-flex;align-items:center;gap:10px;font-family:Inter,sans-serif;font-size:12.5px;font-weight:700;line-height:1;letter-spacing:1px;text-transform:uppercase;border-radius:3px;padding:16px 24px;background-color:#F6B417;color:#0A1628;border:2px solid transparent;transition:background-color .2s,color .2s,transform .2s,border-color .2s}
:is(.zg-hero,.zg-apps,.zg-cta) .elementor-button:hover{background-color:#FFC83D;color:#0A1628;transform:translateY(-1px)}
:is(.zg-hero,.zg-apps,.zg-cta) .elementor-button .elementor-button-content-wrapper{display:inline-flex;align-items:center;gap:10px;flex-direction:row}
:is(.zg-hero,.zg-apps,.zg-cta) .elementor-button .elementor-button-icon{order:2;margin:0;display:inline-flex}
:is(.zg-hero,.zg-apps,.zg-cta) .elementor-button .elementor-button-icon svg{width:14px;height:14px;fill:currentColor}
:is(.zg-hero,.zg-apps,.zg-cta) .elementor-button:hover .elementor-button-icon{transform:translateX(3px);transition:transform .2s}
/* hero: 2 buttons side by side, 2nd = outline */
.zg-hero .elementor-widget-button{width:auto;max-width:100%;margin-bottom:0}
.zg-hero .elementor-widget-button:not(.zg-btn-gap) .elementor-button{background-color:transparent;color:#FFFFFF;border-color:#FFFFFF;padding:14px 24px}
.zg-hero .elementor-widget-button:not(.zg-btn-gap) .elementor-button:hover{background-color:#FFFFFF;color:#06122A}
/* applications: dark button */
.zg-apps .elementor-widget-button .elementor-button{background-color:#06122A;color:#F6B417;padding:14px 24px}
.zg-apps .elementor-widget-button .elementor-button:hover{background-color:#0D2F5E;color:#F6B417}
.zg-apps .elementor-widget-button,.zg-cta .elementor-widget-button{text-align:center}
.zg-apps .elementor-button-wrapper,.zg-cta .elementor-button-wrapper{text-align:center}

/* ---------- HERO TEXT ---------- */
.zg-hero .zg-tag .elementor-heading-title{font-family:Inter,sans-serif;font-size:12px;font-weight:700;letter-spacing:1.2px;line-height:1;color:#0A1628}
.zg-hero h1.elementor-heading-title{font-size:54px;color:#FFFFFF;text-align:left}
.zg-hero .elementor-widget-text-editor{max-width:560px;color:rgba(255,255,255,.95);font-size:16.5px;line-height:1.6}
.zg-hero .elementor-widget-text-editor p{color:inherit}

/* hero right panel (icon boxes) */
.zg-panel .elementor-icon-box-wrapper{display:flex;gap:18px;align-items:flex-start}
.zg-panel .elementor-icon-box-icon{flex:none;margin:2px 0 0;line-height:1}
.zg-panel .elementor-icon{font-size:36px;color:#FFFFFF}
.zg-panel .elementor-widget-icon-box:nth-child(2) .elementor-icon{color:#F6B417}
.zg-panel .elementor-icon-box-title{font-family:Archivo,sans-serif;font-size:15px;font-weight:800;text-transform:uppercase;line-height:1.3;color:#FFFFFF}
.zg-panel .elementor-icon-box-title a{color:inherit}
.zg-panel .elementor-icon-box-description{font-family:Inter,sans-serif;font-size:13.5px;line-height:1.5;color:rgba(255,255,255,.85);margin:0}

/* ---------- STATS CARD ---------- */
.zg-stats{margin-top:-75px}
.zg-stats .elementor-icon-box-wrapper{display:flex;gap:16px;align-items:center}
.zg-stats .elementor-icon-box-icon{flex:none;margin:0;line-height:1}
.zg-stats .elementor-icon{font-size:40px;color:#06122A}
.zg-stats .elementor-column:nth-child(2) .elementor-icon{color:#F6B417}
.zg-stats .elementor-column:nth-child(4) .elementor-icon{color:#1FAE6A}
.zg-stats .elementor-icon-box-title{font-family:Archivo,sans-serif;font-size:16px;font-weight:800;text-transform:uppercase;line-height:1.25;color:#06122A}
.zg-stats .elementor-icon-box-description{font-size:13px;line-height:1.45;color:#6B7686;margin:0}
.zg-stats .elementor-widget{margin-bottom:0}

/* ---------- SECTION TITLES ---------- */
.zg-apps h2.elementor-heading-title,.zg-compare h2.elementor-heading-title{font-size:36px;color:#0D2F5E;text-align:center}
.zg-center{max-width:720px;margin-left:auto;margin-right:auto;text-align:center;color:#3A4555;font-size:15px;line-height:1.6}
.zg-center p{text-align:center}

/* application cards text */
.zg-appcard .elementor-icon{font-size:26px;color:#F6B417}
.zg-appcard .elementor-icon-box-icon{flex:none;margin:0 14px 0 0;line-height:1}
.zg-appcard .elementor-icon-box-title{font-family:Archivo,sans-serif;font-size:14px;font-weight:800;text-transform:uppercase;line-height:1.25;color:#FFFFFF}
.zg-appcard .elementor-icon-box-title a,.zg-appcard .elementor-icon-box-title a:hover{color:#FFFFFF;text-decoration:none}

/* ---------- DARK SECTION ---------- */
.zg-dark h2.elementor-heading-title{font-size:22px;color:#FFFFFF;text-align:left}
.zg-dark h6.elementor-heading-title{font-family:Inter,sans-serif;font-size:12px;font-weight:700;letter-spacing:1px;color:#FFFFFF;text-align:center}
.zg-dark .elementor-icon-list-item{display:flex;align-items:center;padding:7px 0}
.zg-dark .elementor-icon-list-icon{flex:none;margin-right:12px;color:#F6B417}
.zg-dark .elementor-icon-list-icon i{color:#F6B417;font-size:15px}
.zg-dark .elementor-icon-list-icon svg{width:15px;height:15px;fill:#F6B417}
.zg-dark .elementor-icon-list-text{font-family:Inter,sans-serif;font-size:14px;font-weight:600;color:#FFFFFF}
.zg-dark .zg-video .elementor-custom-embed-play{width:66px;height:66px;border-radius:50%;background:#F6B417;display:grid;place-items:center;animation:zgPulse 2.2s infinite}
.zg-dark .zg-video .elementor-custom-embed-play i{font-size:28px;color:#06122A !important;text-shadow:none;margin-left:3px}
.zg-dark .zg-video .elementor-custom-embed-play svg{width:28px;height:28px;fill:#06122A !important;filter:none;margin-left:3px}
.zg-dark .zg-video .elementor-custom-embed-image-overlay{background-size:cover;background-position:60% center}
@keyframes zgPulse{0%{box-shadow:0 0 0 0 rgba(246,180,23,.55)}70%{box-shadow:0 0 0 18px rgba(246,180,23,0)}100%{box-shadow:0 0 0 0 rgba(246,180,23,0)}}

/* ---------- COMPARE CARDS ---------- */
.zg-cmpcard h3.elementor-heading-title{font-size:17px;line-height:1.3;color:#0D2F5E;text-align:center}
.zg-cmpcard .elementor-widget-heading{margin-bottom:20px}
.zg-cmpcard .elementor-icon-list-item{display:flex;align-items:flex-start;padding:7px 0}
.zg-cmpcard .elementor-icon-list-icon{flex:none;margin:2px 12px 0 0}
.zg-cmpcard .elementor-icon-list-icon i{font-size:16px;color:#1FAE6A}
.zg-cmpcard .elementor-icon-list-icon svg{width:16px;height:16px;fill:#1FAE6A}
.zg-cmpcard.zg-bad .elementor-icon-list-icon i{color:#E23B3B}
.zg-cmpcard.zg-bad .elementor-icon-list-icon svg{fill:#E23B3B}
.zg-cmpcard .elementor-icon-list-text{font-family:Inter,sans-serif;font-size:14px;font-weight:600;line-height:1.45;color:#0D2F5E}

/* ---------- BENEFIT BAR ---------- */
.zg-barlist .elementor-icon-list-items{display:flex;flex-wrap:wrap;gap:12px 18px;margin:0;padding:0;list-style:none}
.zg-barlist .elementor-icon-list-item{display:flex;align-items:center;margin:0}
.zg-barlist .elementor-icon-list-item::after{display:none}
.zg-barlist .elementor-icon-list-icon{margin-right:8px}
.zg-barlist .elementor-icon-list-icon i{font-size:16px;color:#06122A}
.zg-barlist .elementor-icon-list-icon svg{width:16px;height:16px;fill:#06122A}
.zg-barlist .elementor-icon-list-text{font-family:Inter,sans-serif;font-size:12.5px;color:#06122A;white-space:nowrap}
.zg-bar .elementor-widget{margin-bottom:0}

/* ---------- CTA ---------- */
.zg-cta h2.elementor-heading-title{font-size:40px;color:#FFFFFF;text-align:center}

/* ---------- RESPONSIVE TYPE ---------- */
@media(max-width:1024px){
  .zg-hero{padding:80px 0 150px}
  .zg-hero h1.elementor-heading-title{font-size:42px}
  .zg-apps h2.elementor-heading-title,.zg-compare h2.elementor-heading-title{font-size:30px}
  .zg-cta h2.elementor-heading-title{font-size:34px}
}
@media(max-width:767px){
  .zg-hero{padding:56px 0 130px}
  .zg-hero h1.elementor-heading-title{font-size:32px}
  .zg-hero .elementor-widget-button{width:100%}
  .zg-hero .elementor-button{width:100%;justify-content:center}
  .zg-apps h2.elementor-heading-title,.zg-compare h2.elementor-heading-title{font-size:24px}
  .zg-cta h2.elementor-heading-title{font-size:26px}
  .zg-dark,.zg-compare,.zg-cta{padding:70px 0}
  .zg-barlist .elementor-icon-list-text{white-space:normal}
}


/* ===================== LAYOUT & EFFECTS ===================== */
/* ===== ZINGA HOMEPAGE — structure & effects only. Text, colors, fonts, links = edit in Elementor panel. ===== */
.zg-css{position:absolute !important;width:0;height:0;overflow:hidden;margin:0 !important}

/* ---- HERO ---- */
.zg-hero .zg-tag .elementor-heading-title{display:inline-block;background:#F6B417;padding:10px 16px;border-radius:2px}
.zg-hero .zg-tag{margin-bottom:22px !important}
.zg-hero .zg-shadow .elementor-heading-title,.zg-hero .zg-shadow p{text-shadow:0 2px 4px rgba(0,0,0,.45),0 4px 24px rgba(0,0,0,.55)}
.zg-hero .zg-shadow{margin-bottom:24px !important}
.zg-hero .zg-btn-gap{margin-right:14px}
.zg-panel>.elementor-widget-wrap{background:linear-gradient(160deg,rgba(8,24,52,.38),rgba(6,16,36,.28));-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.16);border-radius:10px;padding:6px 28px !important;box-shadow:0 20px 50px rgba(0,0,0,.35)}
.zg-panel .elementor-widget-icon-box{margin:0 !important;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.zg-panel .elementor-widget-icon-box:last-child{border-bottom:0}
.zg-panel .elementor-icon-box-title,.zg-panel .elementor-icon-box-description{text-shadow:0 1px 6px rgba(0,0,0,.55)}
.zg-panel .elementor-icon-box-wrapper{text-align:left}
.zg-y{display:block;color:#F6B417;font-weight:600;margin-top:2px}
.zg-chips{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:8px;font-size:11px}
.zg-chips span::before{content:"✓";display:inline-grid;place-items:center;width:13px;height:13px;border-radius:50%;background:#1FAE6A;color:#fff;font-size:8px;margin-right:4px;vertical-align:1px}
@media(max-width:767px){.zg-panel>.elementor-widget-wrap{padding:4px 18px !important}.zg-hero .zg-btn-gap{margin:0 0 12px}}

/* ---- STATS CARD ---- */
.zg-stats{position:relative;z-index:3}
.zg-stats>.elementor-container{background:#fff;border-radius:8px;box-shadow:0 18px 45px rgba(6,18,42,.18);padding:20px 10px}
.zg-stats .elementor-column+.elementor-column{border-left:1px solid #E3E7EE}
.zg-stats .elementor-icon-box-wrapper{text-align:left}
@media(max-width:1024px){.zg-stats .elementor-column{border-left:0 !important}}

/* ---- CENTER TEXT BLOCKS ---- */
.zg-center{margin-left:auto !important;margin-right:auto !important}
.zg-center.elementor-widget{display:block}

/* ---- APPLICATION CARDS (full card clickable) ---- */
.zg-apptrack{position:relative}
.zg-apptrack>.elementor-container{flex-wrap:nowrap !important;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:10px 0 22px}
.zg-apptrack>.elementor-container::-webkit-scrollbar{display:none}
.zg-apptrack>.elementor-container>.elementor-column{width:25% !important;flex:0 0 25%;padding:0 12px;scroll-snap-align:start}
@media(max-width:1024px){.zg-apptrack>.elementor-container>.elementor-column{width:50% !important;flex-basis:50%}}
@media(max-width:767px){.zg-apptrack>.elementor-container>.elementor-column{width:84% !important;flex-basis:84%}}
.zg-appcard>.elementor-widget-wrap{position:relative;background:#06122A;border-radius:8px;overflow:hidden;padding:0 !important;box-shadow:0 8px 22px rgba(6,18,42,.18);transition:transform .25s,box-shadow .25s;align-content:flex-start}
.zg-appcard:hover>.elementor-widget-wrap{transform:translateY(-6px);box-shadow:0 18px 36px rgba(6,18,42,.3)}
.zg-appcard .elementor-widget{margin:0 !important}
.zg-appcard .zg-cardimg{overflow:hidden}
.zg-appcard .zg-cardimg img{display:block;width:100%;height:170px;object-fit:cover;transition:transform .5s}
.zg-appcard:hover .zg-cardimg img{transform:scale(1.06)}
.zg-appcard .zg-cardbox{padding:22px 20px;min-height:90px;border-bottom:3px solid transparent;transition:border-color .25s}
.zg-appcard:hover .zg-cardbox{border-color:#F6B417}
.zg-appcard .zg-cardbox .elementor-icon-box-wrapper{display:flex;align-items:center;text-align:left}
.zg-appcard .zg-cardbox .elementor-icon-box-title{margin:0 !important}
.zg-appcard .zg-cardbox .elementor-icon-box-description{display:none}
/* stretched link: icon-box link covers whole card */
.zg-appcard .zg-cardbox,.zg-appcard .zg-cardbox .elementor-widget-container,.zg-appcard .zg-cardbox .elementor-icon-box-wrapper,.zg-appcard .zg-cardbox .elementor-icon-box-content,.zg-appcard .zg-cardbox .elementor-icon-box-title{position:static !important}
.zg-appcard .zg-cardbox .elementor-icon-box-title a::after{content:"";position:absolute;inset:0;z-index:5}
.zg-appcard .zg-cardbox .elementor-icon-box-title a:focus-visible{outline:none}
.zg-appcard:focus-within>.elementor-widget-wrap{outline:3px solid #F6B417;outline-offset:3px}
/* arrows (added by script) */
.zg-arrow{position:absolute;top:50%;transform:translateY(-60%);z-index:6;width:46px;height:46px;border-radius:50%;border:0;background:#06122A;color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 16px rgba(0,0,0,.25);transition:background .2s,opacity .2s;padding:0}
.zg-arrow svg{width:20px;height:20px}
.zg-arrow:hover{background:#F6B417;color:#06122A}
.zg-arrow[disabled]{opacity:.35;cursor:default}
.zg-prev{left:-50px}.zg-next{right:-50px}
@media(max-width:1320px){.zg-prev{left:-4px}.zg-next{right:-4px}}

/* ---- DARK SECTION ---- */
.zg-dark .elementor-widget-heading{margin-bottom:22px !important}
.zg-dark .zg-video{border-radius:6px;overflow:hidden;margin-bottom:16px !important}
.zg-dark .zg-video .elementor-custom-embed-play i,.zg-dark .zg-video .elementor-custom-embed-play svg{color:#F6B417;fill:#F6B417;opacity:1;text-shadow:none}
.zg-badges>.elementor-widget-wrap{display:grid !important;grid-template-columns:repeat(3,1fr);gap:14px;align-content:start}
.zg-badges .elementor-widget{margin:0 !important}
.zg-badges .elementor-widget-heading{grid-column:1/-1;margin-bottom:8px !important}
.zg-badge .elementor-widget-container{min-height:86px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);border-radius:6px;padding:12px 8px;display:flex;align-items:center;justify-content:center;text-align:center;transition:border-color .2s,background .2s}
.zg-badge:hover .elementor-widget-container{border-color:#F6B417;background:rgba(246,180,23,.06)}
.zg-badge p{margin:0;font:400 11px/1.35 Inter,sans-serif;color:rgba(255,255,255,.75)}
.zg-badge strong{display:block;font:800 14px/1.15 Archivo,sans-serif;color:#F6B417;text-transform:uppercase;margin-bottom:4px}
.zg-badge img{max-width:100%;max-height:60px;object-fit:contain}
@media(max-width:1024px){.zg-badges>.elementor-widget-wrap{grid-template-columns:repeat(6,1fr)}}
@media(max-width:767px){.zg-badges>.elementor-widget-wrap{grid-template-columns:repeat(3,1fr)}}

/* ---- COMPARE ---- */
.zg-cmp .elementor-column{padding:0 20px}
.zg-cmpcard>.elementor-widget-wrap{background:#fff;border-top:4px solid #1FAE6A;border-radius:6px;box-shadow:0 10px 30px rgba(6,18,42,.07);padding:44px 34px 40px !important;align-content:flex-start}
.zg-cmpcard.zg-bad>.elementor-widget-wrap{border-top-color:#E23B3B}
.zg-diag{border:1px solid #E3E7EE;border-radius:6px;padding:22px 20px;margin:10px 0 8px}
.zg-layer{position:relative;font:700 11.5px/1 Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#fff;padding:0 20px;display:flex;align-items:center}
.zg-top{height:58px;background:#97A3B6;border-radius:4px 4px 0 0}
.zg-paint{background:#E23B3B}
.zg-steel{height:74px;background:#4A5568;color:rgba(255,255,255,.85);border-radius:0 0 4px 4px}
.zg-rust{background:radial-gradient(60px 26px at 74% 0%,rgba(226,59,59,.75),transparent 70%),#4A5568}
.zg-notch{position:absolute;right:22%;top:-1px;width:38px;height:calc(100% + 14px);background:#fff;clip-path:polygon(0 0,100% 0,50% 100%);z-index:2}
.zg-spark{position:absolute;top:50%;transform:translateY(-50%);color:#F6B417;font-size:14px;z-index:3}
.zg-spark.l{right:calc(22% + 50px)}.zg-spark.r{right:calc(22% - 30px)}
@media(max-width:767px){
  .zg-cmp .elementor-column{padding:0 0 24px}
  .zg-cmpcard>.elementor-widget-wrap{padding:34px 20px 30px !important}
  .zg-diag{padding:16px 12px}.zg-layer{padding:0 12px;font-size:10.5px}
  .zg-notch{right:10%}.zg-spark.l{right:calc(10% + 44px)}.zg-spark.r{display:none}
}

/* ---- BENEFIT BAR ---- */
.zg-barlist .elementor-icon-list-items{justify-content:space-between}
.zg-barlist .elementor-icon-list-text{text-transform:uppercase;letter-spacing:.03em;font-weight:700}
@media(max-width:1024px){.zg-barlist .elementor-icon-list-items{justify-content:center}}
@media(max-width:767px){.zg-barlist .elementor-icon-list-items{flex-direction:column;align-items:flex-start}}

/* ---- CTA ---- */
.zg-cta .elementor-heading-title span{display:block;color:#F6B417;margin-top:4px}
.zg-cta>.elementor-container{position:relative}
.zg-cta{overflow:hidden}

@media(prefers-reduced-motion:reduce){.zg-appcard *,.zg-apptrack *{transition:none !important;scroll-behavior:auto !important}}


/* =====================================================================
   ZINGA — RAILWAY STRUCTURES PAGE  (complete styles, all scoped to .zgr-)
   Paste BELOW the homepage CSS in: Woodmart → Theme Settings → Custom CSS
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@700;800&family=Inter:wght@400;600;700&display=swap');

/* ---------- BASE ---------- */
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip){font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip)>.elementor-container{max-width:1440px;margin-left:auto;margin-right:auto}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-heading-title{font-family:Archivo,Inter,sans-serif;font-weight:800;text-transform:uppercase;line-height:1.15;margin:0}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-widget-text-editor p{margin:0}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-icon-box-wrapper{display:flex;align-items:flex-start;gap:18px;text-align:left}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-icon-box-icon{flex:none;margin:0;line-height:1;display:inline-flex}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-icon{display:inline-flex;align-items:center;justify-content:center;line-height:1}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-icon i,:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-icon svg{width:1em;height:1em;font-size:inherit}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-icon svg{fill:currentColor}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-icon-box-title{font-family:Archivo,Inter,sans-serif;font-weight:800;text-transform:uppercase;line-height:1.3;margin:0 0 4px}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-icon-box-title a{color:inherit;text-decoration:none}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-icon-box-description{font-family:Inter,sans-serif;line-height:1.45;margin:0}
:is(.zgr-hero,.zgr-info,.zgr-apps,.zgr-strip) .elementor-icon-box-content{flex:1;min-width:0}
/* text-style buttons */
:is(.zgr-hero,.zgr-apps) .elementor-button{font-family:Inter,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.6px;line-height:1;border-radius:3px;transition:background-color .2s,color .2s,transform .2s}
:is(.zgr-hero,.zgr-apps) .elementor-button-content-wrapper{display:inline-flex;align-items:center;gap:10px;flex-direction:row}
:is(.zgr-hero,.zgr-apps) .elementor-button-icon{order:2;margin:0;display:inline-flex;transition:transform .2s}
:is(.zgr-hero,.zgr-apps) .elementor-button-icon svg{width:1em;height:1em;fill:currentColor}
:is(.zgr-hero,.zgr-apps) .elementor-button:hover .elementor-button-icon{transform:translateX(4px)}

/* ---------- 1. HERO ---------- */
.zgr-hero{position:relative;padding:30px 30px 40px;min-height:330px;background:linear-gradient(90deg,rgba(6,18,42,.94) 25%,rgba(6,18,42,0) 70%),#06122A url("https://zinganew.seocompanyjapan.com/wp-content/uploads/2026/10/railway-hero.jpg") right center/cover no-repeat}
.zgr-hero>.elementor-container{min-height:260px;align-items:stretch}
.zgr-hero .elementor-widget{margin-bottom:12px}
.zgr-crumb{font-size:14px;color:#FFFFFF;margin-bottom:18px !important}
.zgr-crumb a{color:#FFFFFF;text-decoration:none}
.zgr-crumb a:hover{color:#F6B417}
.zgr-crumb .zgr-sep{margin:0 8px}
.zgr-h1 .elementor-heading-title{font-size:56px;line-height:1.05;color:#FFFFFF;letter-spacing:-.01em;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.zgr-sub .elementor-heading-title{font-size:26px;color:#F6B417;line-height:1.2}
.zgr-lead{max-width:640px;font-size:16.5px;line-height:1.5;color:#FFFFFF;text-shadow:0 1px 6px rgba(0,0,0,.4)}
/* docs card */
.zgr-doccard{display:flex;justify-content:flex-end;align-items:flex-end}
.zgr-doccard>.elementor-widget-wrap{max-width:360px;margin-left:auto;background:rgba(6,18,42,.92);border-radius:8px;padding:26px 26px 22px !important;box-shadow:0 18px 40px rgba(0,0,0,.35);align-content:flex-start}
.zgr-doccard .elementor-widget{margin-bottom:10px}
.zgr-docbox .elementor-icon{font-size:40px;color:#FFFFFF}
.zgr-docbox .elementor-icon-box-title{font-size:18px;color:#FFFFFF;margin-bottom:12px}
.zgr-docbox .elementor-icon-box-description{font-size:15px;color:#FFFFFF}
.zgr-docbox .elementor-icon-box-wrapper{flex-wrap:wrap}
.zgr-doclink .elementor-button{background:transparent;color:#F6B417;padding:4px 0 0;font-size:16px;font-family:Archivo,sans-serif;font-weight:800}
.zgr-doclink .elementor-button:hover{background:transparent;color:#FFC83D}

/* ---------- 2. THREE INFO COLUMNS ---------- */
.zgr-info{background:#FFFFFF;padding:30px 30px}
.zgr-info .elementor-widget{margin-bottom:14px}
.zgr-col>.elementor-widget-wrap{padding:6px 26px !important;align-content:flex-start}
.zgr-col+.zgr-col>.elementor-widget-wrap{border-left:1px solid #E1E6EE}
/* section heading + yellow underline */
.zgr-h .elementor-heading-title,.zgr-h2s .elementor-heading-title{font-size:22px;color:#1A3FB8;position:relative;padding-bottom:14px}
.zgr-h .elementor-heading-title::after{content:"";position:absolute;left:0;bottom:0;width:56px;height:4px;background:#F6B417;border-radius:2px}
.zgr-h{margin-bottom:12px !important}
.zgr-intro{font-size:16.5px;line-height:1.4;color:#1A3FB8}
/* challenge items: yellow circle icons */
.zgr-chal{margin-bottom:12px !important}
.zgr-chal .elementor-icon{width:52px;height:52px;border-radius:50%;background:#F6B417;color:#06122A;font-size:24px}
.zgr-chal .elementor-icon-box-wrapper{align-items:center;gap:22px}
.zgr-chal .elementor-icon-box-title{font-size:14.5px;color:#1A3FB8}
.zgr-chal .elementor-icon-box-description{font-size:14.5px;color:#3A4555}
.zgr-callout{background:#EEF3FB;border-radius:6px;padding:14px 16px;margin-top:6px}
.zgr-callout .elementor-icon-box-wrapper{align-items:center;gap:16px}
.zgr-callout .elementor-icon-box-icon{padding-right:16px;border-right:2px solid #1A3FB8}
.zgr-callout .elementor-icon{font-size:30px;color:#1A3FB8}
.zgr-callout .elementor-icon-box-title{font-family:Inter,sans-serif;text-transform:none;font-size:15px;font-weight:700;color:#1A3FB8;margin:0}
.zgr-callout .elementor-icon-box-description{display:none}
/* engineered items: navy square icons */
.zgr-eng{margin-bottom:22px !important}
.zgr-eng .elementor-icon{width:78px;height:72px;border-radius:6px;background:#0C2350;color:#FFFFFF;font-size:34px}
.zgr-eng .elementor-icon-box-wrapper{gap:28px}
.zgr-eng .elementor-icon-box-title{font-size:15px;color:#1A3FB8}
.zgr-eng .elementor-icon-box-description{font-size:14.5px;color:#3A4555}
/* where zinga protects */
.zgr-where-inner{margin:6px 0 10px}
.zgr-where-inner .elementor-widget-wrap{padding:0 !important}
.zgr-zones-h{margin-bottom:0 !important}
.zgr-zones-h .elementor-heading-title{font-size:14px;color:#1A3FB8}
.zgr-zones-sub{font-size:14px;color:#3A4555;margin-bottom:12px !important}
.zgr-zones .elementor-icon-list-items{margin:0;padding:0;list-style:none}
.zgr-zones .elementor-icon-list-item{display:flex;align-items:center;padding:3px 0;margin:0}
.zgr-zones .elementor-icon-list-icon{flex:none;margin-right:12px;display:inline-flex}
.zgr-zones .elementor-icon-list-icon i{font-size:7px;color:#06122A}
.zgr-zones .elementor-icon-list-icon svg{width:7px;height:7px;fill:#06122A}
.zgr-zones .elementor-icon-list-text{font-size:15px;color:#3A4555}
.zgr-rail svg{display:block;width:100%;height:auto;max-width:440px;margin-left:auto;overflow:visible}
.zgr-note{background:#EEF3FB;border-radius:6px;padding:16px 18px}
.zgr-note .elementor-icon-box-wrapper{align-items:center;gap:20px}
.zgr-note .elementor-icon{font-size:32px;color:#1A3FB8}
.zgr-note .elementor-icon-box-title{display:none}
.zgr-note .elementor-icon-box-description{font-size:15px;color:#1A3FB8}

/* ---------- 3. PROVEN APPLICATIONS + CTA ---------- */
.zgr-apps{background:#FFFFFF;padding:10px 30px 30px;border-top:1px solid #E1E6EE}
.zgr-apps>.elementor-container{align-items:stretch}
.zgr-proven>.elementor-widget-wrap{padding:10px 20px 0 10px !important;align-content:flex-start}
.zgr-headrow{margin-bottom:8px}
.zgr-headrow .elementor-widget-wrap{padding:0 !important}
.zgr-h2s .elementor-heading-title{font-size:22px;padding-bottom:0}
.zgr-links>.elementor-widget-wrap{justify-content:flex-end;gap:28px;flex-wrap:nowrap}
.zgr-links .elementor-widget{width:auto;margin:0 !important}
.zgr-textlink .elementor-button,.zgr-caselink .elementor-button{background:transparent;color:#1A3FB8;padding:6px 0;font-size:12.5px}
.zgr-textlink .elementor-button:hover,.zgr-caselink .elementor-button:hover{background:transparent;color:#06122A}
/* case slider */
.zgr-slider{position:relative;width:100%;max-width:100%;min-width:0}
.zgr-headrow,.zgr-where-inner{width:100%;min-width:0}
.zgr-slider>.elementor-container{flex-wrap:nowrap !important;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:6px 2px 14px;gap:0}
.zgr-slider>.elementor-container::-webkit-scrollbar{display:none}
.zgr-slider>.elementor-container>.elementor-column{width:33.333% !important;flex:0 0 33.333%;padding:0 12px 0 0;scroll-snap-align:start}
.zgr-case>.elementor-widget-wrap{position:relative;background:#FFFFFF;border:1px solid #E1E6EE;border-radius:6px;overflow:hidden;padding:0 0 16px !important;align-content:flex-start;transition:transform .25s,box-shadow .25s}
.zgr-case:hover>.elementor-widget-wrap{transform:translateY(-4px);box-shadow:0 14px 30px rgba(6,18,42,.12)}
.zgr-case .elementor-widget{margin-bottom:6px}
.zgr-caseimg{margin-bottom:12px !important;overflow:hidden}
.zgr-caseimg img{display:block;width:100%;height:120px;object-fit:cover;transition:transform .5s}
.zgr-case:hover .zgr-caseimg img{transform:scale(1.05)}
.zgr-case-h,.zgr-case-p,.zgr-caselink{padding:0 16px}
.zgr-case-h .elementor-heading-title{font-size:13.5px;line-height:1.3;color:#06122A}
.zgr-case-p{font-size:13px;line-height:1.45;color:#3A4555}
.zgr-caselink .elementor-button{padding:4px 0 0}
/* whole case card clickable via its "View case study" link */
.zgr-caselink,.zgr-caselink .elementor-widget-container,.zgr-caselink .elementor-button-wrapper{position:static !important}
.zgr-caselink .elementor-button::after{content:"";position:absolute;inset:0;z-index:4}
.zgr-case:focus-within>.elementor-widget-wrap{outline:3px solid #F6B417;outline-offset:2px}
/* slider arrows (added by zinga-carousel.js) */
.zgr-slider .zg-arrow{position:absolute;top:42%;transform:translateY(-50%);z-index:6;width:42px;height:42px;border-radius:50%;border:0;background:#06122A;color:#FFFFFF;display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 16px rgba(0,0,0,.25);padding:0;transition:background .2s,opacity .2s}
.zgr-slider .zg-arrow svg{width:20px;height:20px}
.zgr-slider .zg-arrow:hover{background:#F6B417;color:#06122A}
.zgr-slider .zg-arrow[disabled]{opacity:.3;cursor:default}
.zgr-slider .zg-prev{left:-14px}
.zgr-slider .zg-next{right:-6px}
/* CTA box */
.zgr-cta>.elementor-widget-wrap{background:#0C2350;border-radius:8px;padding:28px 30px !important;align-content:center;margin:10px 0}
.zgr-cta .elementor-widget{margin-bottom:16px}
.zgr-ctabox .elementor-icon{font-size:44px;color:#FFFFFF}
.zgr-ctabox .elementor-icon-box-wrapper{gap:22px}
.zgr-ctabox .elementor-icon-box-title{font-size:19px;color:#FFFFFF;line-height:1.35;margin-bottom:10px}
.zgr-ctabox .elementor-icon-box-description{font-size:14.5px;color:#FFFFFF}
.zgr-ctabtn{padding-left:66px}
.zgr-ctabtn .elementor-button{background:#F6B417;color:#0A1628;padding:14px 22px;font-size:13px}
.zgr-ctabtn .elementor-button:hover{background:#FFC83D;color:#0A1628;transform:translateY(-1px)}

/* ---------- 4. BENEFITS STRIP ---------- */
.zgr-strip{background:#0C2350;padding:28px 30px}
.zgr-strip .elementor-widget{margin-bottom:0}
.zgr-bencol>.elementor-widget-wrap{padding:6px 26px !important}
.zgr-bencol+.zgr-bencol>.elementor-widget-wrap{border-left:1px solid rgba(246,180,23,.55)}
.zgr-ben .elementor-icon-box-wrapper{align-items:center;gap:24px}
.zgr-ben .elementor-icon{font-size:48px;color:#F6B417}
.zgr-ben .elementor-icon-box-title{font-size:14px;color:#FFFFFF;margin-bottom:6px}
.zgr-ben .elementor-icon-box-description{font-size:13.5px;color:rgba(255,255,255,.85)}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1024px){
  .zgr-hero{background:linear-gradient(180deg,rgba(6,18,42,.9),rgba(6,18,42,.75)),#06122A url("https://zinganew.seocompanyjapan.com/wp-content/uploads/2026/10/railway-hero.jpg") center/cover no-repeat}
  .zgr-h1 .elementor-heading-title{font-size:46px}
  .zgr-sub .elementor-heading-title{font-size:22px}
  .zgr-doccard{justify-content:flex-start}
  .zgr-doccard>.elementor-widget-wrap{margin:16px 0 0}
  .zgr-col+.zgr-col>.elementor-widget-wrap{border-left:0;border-top:1px solid #E1E6EE;padding-top:26px !important;margin-top:16px}
  .zgr-slider>.elementor-container>.elementor-column{width:50% !important;flex-basis:50%}
  .zgr-bencol:nth-child(3)>.elementor-widget-wrap{border-left:0}
  .zgr-bencol>.elementor-widget-wrap{padding:14px 20px !important}
}
@media(max-width:767px){
  .zgr-h1 .elementor-heading-title{font-size:34px}
  .zgr-sub .elementor-heading-title{font-size:19px}
  .zgr-sub br{display:none}
  .zgr-col>.elementor-widget-wrap{padding:6px 6px !important}
  .zgr-chal .elementor-icon{width:44px;height:44px;font-size:20px}
  .zgr-chal .elementor-icon-box-wrapper{gap:16px}
  .zgr-eng .elementor-icon{width:60px;height:56px;font-size:26px}
  .zgr-eng .elementor-icon-box-wrapper{gap:18px}
  .zgr-where-inner .elementor-column{width:100% !important}
  .zgr-rail svg{margin:10px auto 0}
  .zgr-links>.elementor-widget-wrap{justify-content:flex-start}
  .zgr-slider>.elementor-container>.elementor-column{width:85% !important;flex-basis:85%}
  .zgr-ctabtn{padding-left:0}
  .zgr-ctabtn .elementor-button{width:100%;justify-content:center}
  .zgr-bencol+.zgr-bencol>.elementor-widget-wrap{border-left:0;border-top:1px solid rgba(246,180,23,.4)}
  .zgr-ben .elementor-icon{font-size:38px}
}
@media(prefers-reduced-motion:reduce){:is(.zgr-case,.zgr-slider) *{transition:none !important;scroll-behavior:auto !important}}