/* IRON INDUSTRIAL / typography + Swiper direction. This file deliberately follows site.css. */
:root{--iron-deep:#071c38;--iron-mid:#0b3577;--iron-sky:#1479ed;--iron-line:#dce7f4}
body{font-family:"IBM Plex Sans Thai","Manrope",sans-serif;font-size:15px}
.brand-label strong,.footer-brand,.brand-label small,.section-kicker,.eyebrow,.hero-count,.hero-stamp,.trust-marker,.trust-head,.trust-fact strong,.service-num,.small-accent,.portfolio-head{font-family:"Barlow Condensed","Manrope",sans-serif}
.brand-label strong{font-size:21px;letter-spacing:.015em;font-weight:900;line-height:1}
.brand-label strong span{letter-spacing:-.015em}
.brand-label small{letter-spacing:.28em;font-weight:700;font-size:9px}
.hero-slider{height:auto;min-height:0;overflow:hidden;background:#082555}
.hero-slider::before{display:none}
.hero-swiper{height:645px;width:100%;overflow:hidden}
.hero-swiper .swiper-wrapper{display:flex;height:100%}
.hero-swiper .swiper-slide{width:100%;height:100%;flex-shrink:0;position:relative;overflow:hidden}
.hero-panel{background:linear-gradient(115deg,#071b39 5%,#0b3d83 55%,#1265b6 100%);isolation:isolate;color:white}
.hero-panel-2{background:linear-gradient(115deg,#061b34 7%,#0a306d 57%,#0a5cb8 100%)}
.hero-panel-3{background:linear-gradient(115deg,#041e48 7%,#08449a 61%,#137bf0 100%)}
.hero-panel::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 72px,#c9e8ff0b 73px 74px),repeating-linear-gradient(90deg,transparent 0 72px,#c9e8ff0b 73px 74px);mask-image:linear-gradient(90deg,transparent,#000);z-index:0;pointer-events:none}
.hero-panel::after{content:"";position:absolute;width:480px;height:480px;right:-150px;top:-150px;border:1px solid #ffffff25;box-shadow:0 0 0 68px #ffffff07,0 0 0 136px #ffffff05;transform:rotate(22deg);pointer-events:none}
.hero-panel .hero-grid{width:340px;height:340px;top:auto;right:auto;left:-260px;bottom:-170px;box-shadow:0 0 0 90px #b1d5ff05,0 0 0 180px #b1d5ff05}
.hero-panel-layout{position:relative;height:100%;display:flex;align-items:center;z-index:2;pointer-events:none;padding-top:34px;padding-bottom:48px}
.hero-panel-layout .hero-content{pointer-events:auto;width:min(700px,58%);max-width:none;isolation:isolate}
.hero-panel .eyebrow{font-family:"Barlow Condensed",sans-serif;font-size:15px;letter-spacing:.22em;color:#b1e7ff;font-weight:700;margin:0 0 24px}
.hero-panel .eyebrow-line{background:#38bdff;width:45px;height:3px}
.hero-stamp{display:block;font-size:clamp(19px,2.2vw,28px);font-weight:800;letter-spacing:.15em;color:#8ed9ff;line-height:1.15}
.hero-stamp span{color:white;opacity:.5}
.hero-panel h1{font-family:"Kanit","IBM Plex Sans Thai",sans-serif;font-weight:700;line-height:1.2;letter-spacing:-.034em;max-width:760px;font-size:clamp(44px,4.85vw,72px);margin:15px 0 23px;text-wrap:balance;color:#fff;text-shadow:0 8px 30px #001f4a45}
html[lang="en"] .hero-panel h1{font-family:"Barlow Condensed","Manrope",sans-serif;font-size:clamp(60px,6.4vw,105px);font-weight:900;letter-spacing:.005em;line-height:.98;max-width:800px}
.hero-panel .hero-content>p{color:#e5f4ff;font-size:16px;line-height:1.85;max-width:545px;font-weight:500;margin-bottom:27px;text-shadow:0 2px 15px #07306755}
.hero-panel-art{position:absolute;right:-3%;top:0;bottom:0;width:61%;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:1}
.hero-panel-art::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0a367b 0%,transparent 34%,transparent 83%,#135ca523);z-index:2}
.hero-panel-art img{width:min(940px,117%);height:100%;max-width:none;object-fit:contain;transform:scale(1.08);filter:drop-shadow(-35px 40px 40px #001b5865);opacity:.9}
.hero-panel:has(.hero-panel-art img[src^="/media/"]) .hero-panel-art{right:0;width:100%;opacity:.50}
.hero-panel:has(.hero-panel-art img[src^="/media/"]) .hero-panel-art img{width:100%;height:100%;object-fit:cover;transform:none}
.hero-panel:has(.hero-panel-art img[src^="/media/"]) .hero-panel-art::before{background:linear-gradient(90deg,#06162df5 0%,#051b3cbb 50%,#082c6d50 100%)}
.hero-panel .hero-buttons{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.hero-panel .btn{border-radius:1px;min-height:52px;transition:transform .2s,background-color .2s}
.hero-panel .btn:hover{transform:translateY(-2px)}
.hero-image-disclaimer{position:absolute;z-index:3;right:28px;bottom:20px;background:#041b37a6;color:#d4e9ff;font-size:10px;padding:7px 12px;letter-spacing:.02em;border-left:2px solid #4abaff}
.hero-control-wrap{height:72px;background:#051b3b;border-top:1px solid #7dcfff36;position:relative;z-index:10}
.hero-controls{height:100%;display:flex;align-items:center;gap:25px}
.hero-count{font-size:19px;letter-spacing:.08em;font-weight:800;display:flex;align-items:baseline;gap:8px;white-space:nowrap;color:#cadffc}
.hero-count b{font-size:28px;color:white;letter-spacing:-.03em}
.hero-count span{opacity:.4}
.hero-progress{height:3px;background:#39639c;max-width:240px;flex:1;overflow:hidden}
.hero-progress-fill{display:block;background:#69c8ff;width:0;height:100%;transition:width .3s ease-out}
.hero-pager{display:flex;flex:1;align-items:center;gap:8px}
.hero-pager .swiper-pagination-bullet{width:24px;height:3px;border-radius:0;background:#bed8fe;opacity:.35;cursor:pointer;margin:0!important}
.hero-pager .swiper-pagination-bullet-active{background:#64c7ff;opacity:1;width:40px}
.hero-nav{display:flex;gap:5px}
.hero-nav button,.portfolio-nav button,.detail-swiper>button{font-family:"Barlow Condensed",sans-serif;background:transparent;border:1px solid #ffffff44;color:white;width:48px;height:43px;font-size:25px;transition:.2s}
.hero-nav button:hover{background:#ffffff21;border-color:#8ac8ff}
.hero-nav button:focus-visible,.portfolio-nav button:focus-visible,.detail-swiper>button:focus-visible{outline:3px solid #65d9ff;outline-offset:3px}
.trust-strip{background:#f6f9fe;border-bottom:1px solid #dce8f5;border-top:3px solid #1480ed}
.trust-grid{display:grid;grid-template-columns:1.35fr 1fr 1.4fr 1.2fr auto;align-items:center;gap:17px;min-height:118px}
.trust-head{display:flex;align-items:center;gap:12px;text-transform:uppercase;letter-spacing:.12em;font-size:14px;font-weight:900;color:#135eb4}
.trust-marker{font-size:29px;font-weight:800;color:#1b7ad7}
.trust-fact{border-left:2px solid #cddff2;display:flex;flex-direction:column;padding-left:22px;gap:5px}
.trust-fact>span{font-size:10px;color:#647b97;line-height:1.6}
.trust-fact strong{font-size:20px;letter-spacing:.012em;font-weight:800;color:#123e7d;line-height:1.08}
.trust-fact strong span{font-size:14px;font-weight:500;color:#6c83a8}
.trust-source{font-size:11px;font-weight:700;color:#165bc4;text-decoration:underline;text-underline-offset:4px;white-space:nowrap}
.intro-copy h2,.section-title,.cta-inner h2,.page-hero h1,.service-card h3,.service-card h2,.empty-copy h3,.contact-details h2,.info-sheet h3{font-family:"Kanit","IBM Plex Sans Thai",sans-serif;letter-spacing:-.028em;font-weight:600}
html[lang="en"] .intro-copy h2,html[lang="en"] .section-title,html[lang="en"] .cta-inner h2,html[lang="en"] .page-hero h1{font-family:"Barlow Condensed",sans-serif;font-size:clamp(48px,5vw,72px);font-weight:800;letter-spacing:0;line-height:1.08}
.intro-copy h2,.section-title{line-height:1.35}
.service-card{border-top:4px solid #1768ca}
.service-card h3,.service-card h2{font-size:21px}
.service-symbol{font-family:"Barlow Condensed",sans-serif;font-weight:800}
.section-kicker{font-size:13px;letter-spacing:.13em}
.portfolio-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px;gap:24px}
.portfolio-head p{font-family:"IBM Plex Sans Thai",sans-serif;font-size:13px;color:#607e9d;margin:0}
.portfolio-nav{display:flex;gap:8px}
.portfolio-nav button{border-color:#b9cde2;color:#1450a0}
.portfolio-nav button:hover{background:#e9f2ff}
.portfolio-swiper{overflow:hidden;margin:0 -10px;padding:0 10px 20px;width:calc(100% + 20px)}
.portfolio-swiper .swiper-wrapper{display:flex}
.portfolio-swiper .swiper-slide{width:calc((100% - 48px)/3);flex-shrink:0;height:auto}
.portfolio-swiper .project-card{display:block;border:1px solid #e2eaf5;background:#fff;padding:0 0 25px;height:100%}
.portfolio-swiper .project-image{aspect-ratio:1.32;overflow:hidden;background:#d9eafa}
.portfolio-swiper .project-meta,.portfolio-swiper .project-card h3,.portfolio-swiper .project-card p{margin-left:21px;margin-right:21px}
.portfolio-swiper .project-card h3{font-family:"Kanit","IBM Plex Sans Thai",sans-serif;font-size:21px;letter-spacing:-.02em;font-weight:600;line-height:1.35}
.portfolio-swiper .project-card p{font-size:12px}
.portfolio-pagination{display:flex;justify-content:center;margin-top:17px;gap:7px}
.portfolio-pagination .swiper-pagination-bullet{width:20px;height:3px;border-radius:0;background:#b7c7df;opacity:.7}
.portfolio-pagination .swiper-pagination-bullet-active{width:43px;background:#1566db;opacity:1}
.detail-swiper{position:relative;overflow:hidden;background:#062a55;height:500px}
.detail-swiper .swiper-wrapper{display:flex;height:100%}
.detail-swiper .swiper-slide{width:100%;height:100%;flex-shrink:0}
.detail-swiper img{display:block;width:100%;height:100%;object-fit:contain;background:#0d294d}
.detail-swiper>button{position:absolute;top:46%;z-index:10;left:20px;background:#082b55ad;border-color:#d1eeff77}
.detail-swiper>.detail-next{left:auto;right:20px}
.detail-pagination{position:absolute;z-index:12;bottom:18px!important;left:0;width:100%;display:flex;justify-content:center;gap:7px}
.detail-pagination .swiper-pagination-bullet{width:22px;height:3px;border-radius:0;background:white;opacity:.5}
.detail-pagination .swiper-pagination-bullet-active{width:42px;opacity:1;background:#4abaff}
.swiper-button-disabled{opacity:.35;cursor:not-allowed}
.slide-preview{max-width:650px;margin:16px 0 22px}
.slide-preview img{width:100%;height:280px;background:linear-gradient(135deg,#062c65,#1462b6);object-fit:contain}
.slide-preview p{font-size:12px;color:#5b7695;margin:5px 0}
/* Browser fallback: if CDN can't load, the images and previous/next controls still work. */
.hero-swiper:not(.swiper-initialized) .swiper-wrapper{transition:transform .5s ease}
.portfolio-swiper:not(.swiper-initialized){overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin}
.portfolio-swiper:not(.swiper-initialized) .swiper-wrapper{gap:20px}
.portfolio-swiper:not(.swiper-initialized) .swiper-slide{scroll-snap-align:start}
.detail-swiper:not(.swiper-initialized) .swiper-wrapper{transition:transform .4s ease}
@media(max-width:1160px){.trust-grid{grid-template-columns:1fr 1fr 1.25fr;gap:22px;padding-top:24px;padding-bottom:24px}.trust-source{justify-self:start}.hero-panel-layout .hero-content{width:65%}.hero-panel-art{width:57%;right:-10%}}
@media(max-width:930px){.hero-swiper{height:620px}.hero-panel-layout .hero-content{width:69%}.hero-panel h1{font-size:52px}.hero-panel-art{right:-22%;width:65%;opacity:.8}.trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portfolio-swiper .swiper-slide{width:calc((100% - 24px)/2)}}
@media(max-width:700px){.brand-label strong{font-size:17px}.brand-label small{font-size:7px}.hero-slider{min-height:0}.hero-swiper{height:675px}.hero-panel-layout{align-items:flex-start;padding-top:64px}.hero-panel-layout .hero-content{width:100%;max-width:100%;position:relative}.hero-panel .eyebrow{font-size:12px;letter-spacing:.15em;margin-bottom:15px}.hero-stamp{font-size:19px}.hero-panel h1{font-size:clamp(38px,8.1vw,54px);max-width:100%;margin:14px 0 15px;line-height:1.22}html[lang="en"] .hero-panel h1{font-size:clamp(57px,13vw,82px);max-width:95%}.hero-panel .hero-content>p{font-size:13px;line-height:1.85;max-width:420px;margin-bottom:20px}.hero-panel .btn{min-height:47px;padding:0 15px;font-size:11px}.hero-panel-art{width:103%;height:370px;right:-20%;top:auto;bottom:-28px;opacity:.55}.hero-panel-art img{width:100%;height:100%;object-fit:contain;transform:scale(1.1)}.hero-panel:has(.hero-panel-art img[src^="/media/"]) .hero-panel-art{height:100%;width:100%;right:0;bottom:0;opacity:.25}.hero-panel:has(.hero-panel-art img[src^="/media/"]) .hero-panel-art::before{background:linear-gradient(#051e45c4,#051e4550)}.hero-image-disclaimer{bottom:10px;right:13px;font-size:9px}.hero-control-wrap{height:61px}.hero-controls{gap:13px}.hero-count{font-size:13px}.hero-count b{font-size:22px}.hero-progress{display:none}.hero-pager{justify-content:center}.hero-nav button{width:37px;height:36px;font-size:20px}.trust-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px;padding-top:30px;padding-bottom:30px}.trust-head{grid-column:1/-1}.trust-fact{padding-left:13px}.trust-fact strong{font-size:17px}.trust-source{grid-column:1/-1}.portfolio-swiper .swiper-slide{width:82%;max-width:355px}.portfolio-head{align-items:flex-start}.portfolio-head p{max-width:240px;font-size:11px}.detail-swiper{height:330px}}
@media(max-width:430px){.hero-swiper{height:690px}.hero-panel-layout{padding-top:53px}.hero-panel h1{font-size:39px}.hero-panel-art{bottom:-38px;right:-22%;height:330px}.hero-panel .hero-content>p{font-size:12px}.trust-fact strong{font-size:16px}.hero-panel .hero-buttons{gap:7px}.hero-panel .btn{font-size:10px;padding:0 13px}}
@media(prefers-reduced-motion:reduce){.hero-swiper:not(.swiper-initialized) .swiper-wrapper,.detail-swiper:not(.swiper-initialized) .swiper-wrapper{transition:none}}