/* ===== components: buttons, image slots, carousels, marquee, cards ===== */

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.7rem;isolation:isolate;overflow:hidden;padding:1rem 1.8rem;font:600 .78rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;border:1px solid transparent;border-radius:3px;cursor:pointer;transition:transform .4s var(--ease),box-shadow .4s var(--ease),color .3s,background .3s,border-color .3s;-webkit-tap-highlight-color:transparent}
.btn .ico{transition:transform .4s var(--ease)}
.btn:hover .ico{transform:translateX(4px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn-sm{padding:.8rem 1.25rem;font-size:.72rem}
.btn-gold{color:var(--navy);background:var(--gold-grad);box-shadow:0 12px 26px -14px rgba(184,146,31,.95),inset 0 1px 0 rgba(255,255,255,.55)}
.btn-gold::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.7) 50%,transparent 70%);transform:translateX(-125%) skewX(-14deg);transition:transform .85s var(--ease)}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 18px 32px -14px rgba(184,146,31,1),inset 0 1px 0 rgba(255,255,255,.7)}
.btn-gold:hover::before{transform:translateX(125%) skewX(-14deg)}
.btn-navy{color:var(--white);background:var(--navy)}
.btn-navy::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--gold-grad);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease-out)}
.btn-navy:hover{color:var(--navy)}
.btn-navy:hover::before{transform:scaleX(1)}
.btn-outline-light{color:var(--white);border-color:rgba(255,255,255,.6);background:rgba(255,255,255,.04)}
.btn-outline-light::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--gold-grad);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease-out)}
.btn-outline-light:hover{color:var(--navy);border-color:var(--gold)}
.btn-outline-light:hover::before{transform:scaleX(1)}
.btn-row{display:flex;flex-wrap:wrap;gap:1rem}
.btn[disabled]{opacity:.7;pointer-events:none}

/* image slots: the brand placeholder shows until a supplied photo loads on top of it */
.slot{position:relative;overflow:hidden;background:var(--glyph,none) 80% 26%/52% auto no-repeat,var(--wm) 112% 120%/86% auto no-repeat,radial-gradient(90% 70% at 88% 6%,rgba(6,70,168,.6),transparent 62%),radial-gradient(75% 60% at 4% 104%,rgba(212,175,55,.22),transparent 62%),linear-gradient(150deg,#0B3A8F 0%,#0A2A66 42%,#071A3D 100%);background-color:var(--navy)}
.slot>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.slot.is-missing>img{display:none}
/* GLYPHS-START: large line-art icon behind each placeholder (generated from the icon sprite in index.html) */
.g-shield{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Cpath d='M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E")}
.g-building{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Crect x='5' y='3' width='14' height='18' rx='1'/%3E%3Cpath d='M9 7h2M13 7h2M9 11h2M13 11h2M9 15h2M13 15h2M10 21v-3h4v3'/%3E%3C/svg%3E")}
.g-factory{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Cpath d='M3 21V10l6 3.5V10l6 3.5V5h6v16z'/%3E%3Cpath d='M7 17h1M12 17h1M17 17h1'/%3E%3C/svg%3E")}
.g-home{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Cpath d='M3 11l9-8 9 8'/%3E%3Cpath d='M5 10v11h14V10'/%3E%3Cpath d='M10 21v-6h4v6'/%3E%3C/svg%3E")}
.g-lock{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3M12 15v2'/%3E%3C/svg%3E")}
.g-compass{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15.5 8.5l-2 5-5 2 2-5z'/%3E%3C/svg%3E")}
.g-users{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Ccircle cx='9' cy='8' r='3.2'/%3E%3Cpath d='M3 20v-1a5 5 0 0 1 5-5h2a5 5 0 0 1 5 5v1'/%3E%3Cpath d='M16 5a3.2 3.2 0 0 1 0 6M18 14.5a5 5 0 0 1 3 4.5v1'/%3E%3C/svg%3E")}
.g-store{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Cpath d='M4 9l1.5-5h13L20 9'/%3E%3Cpath d='M4 9a2.67 2.67 0 0 0 5.33 0 2.67 2.67 0 0 0 5.34 0A2.67 2.67 0 0 0 20 9'/%3E%3Cpath d='M5 12v9h14v-9'/%3E%3Cpath d='M10 21v-5h4v5'/%3E%3C/svg%3E")}
.g-eye{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Cpath d='M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E")}
.g-map{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Cpath d='M9 4L3 6v14l6-2 6 2 6-2V4l-6 2z'/%3E%3Cpath d='M9 4v14M15 6v14'/%3E%3C/svg%3E")}
.g-usercheck{--glyph:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-opacity='.34' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cstyle%3E*{vector-effect:non-scaling-stroke}%3C/style%3E%3Ccircle cx='9' cy='8' r='3.5'/%3E%3Cpath d='M2.5 20v-1a5.5 5.5 0 0 1 5.5-5.5h2a5.5 5.5 0 0 1 5.5 5.5v1'/%3E%3Cpath d='M16 11l2 2 4-4'/%3E%3C/svg%3E")}
/* GLYPHS-END */

/* round controls (carousel arrows, pause) */
.ctl{display:inline-grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%;border:1.5px solid var(--gold);color:var(--navy);background:transparent;transition:background .35s var(--ease),color .3s,transform .4s var(--ease),border-color .3s,box-shadow .35s}
.ctl .ico{width:1.15rem;height:1.15rem}
.ctl-prev .ico{transform:rotate(180deg)}
.ctl:hover{background:var(--gold-grad);border-color:var(--gold);transform:translateY(-2px);box-shadow:0 12px 22px -12px rgba(184,146,31,.9)}
.ctl-sm{width:40px;height:40px}
.ctl-sm .ico{width:1rem;height:1rem}
.ctl .i-play{display:none}
.ctl[aria-pressed=true] .i-pause{display:none}
.ctl[aria-pressed=true] .i-play{display:block}
.ctl-row{position:relative;z-index:6;display:flex;align-items:center;gap:.7rem}   /* above the carousel viewport, whose padding overlaps this row, so clicks reach the buttons */

/* looping carousels (services = continuous, testimonials = stepped); plain scrolling row until JS takes over */
.loop{position:relative;--loop-gap:1.5rem}
.loop-viewport{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;touch-action:pan-y;padding-block:3rem;margin-block:-3rem}
.loop-viewport::-webkit-scrollbar{display:none}
.loop.is-ready .loop-viewport{overflow:hidden;cursor:grab;-webkit-user-select:none;user-select:none}
.loop.is-dragging .loop-viewport{cursor:grabbing}
.loop-track{display:flex;gap:var(--loop-gap);width:max-content}
.loop.is-ready .loop-track{will-change:transform}
.loop-item{flex:none;width:var(--item-w)}
.loop.is-dragging a{pointer-events:none}
.loop::before,.loop::after{content:"";position:absolute;top:0;bottom:0;z-index:3;width:clamp(24px,6vw,110px);pointer-events:none}
.loop::before{left:0;background:linear-gradient(90deg,var(--bg,var(--soft)),rgba(255,255,255,0))}
.loop::after{right:0;background:linear-gradient(270deg,var(--bg,var(--soft)),rgba(255,255,255,0))}
.loop-plain::before,.loop-plain::after{display:none}

/* service cards */
.svc-card{position:relative;display:block;height:var(--card-h,460px);overflow:hidden;isolation:isolate;border-radius:4px;color:var(--white);background:var(--navy);box-shadow:var(--shadow);transition:box-shadow .6s var(--ease),transform .6s var(--ease)}
.svc-card:hover,.svc-card:focus-visible{transform:translateY(-8px);box-shadow:0 38px 60px -28px rgba(7,26,61,.75),0 0 0 1px rgba(212,175,55,.55)}
.svc-media{position:absolute;inset:0;transition:transform 1.4s var(--ease-out),filter .8s}
.svc-media::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 36%,rgba(255,255,255,.2) 50%,transparent 64%);transform:translateX(-130%);transition:transform 1.1s var(--ease-out)}
.svc-card:hover .svc-media,.svc-card:focus-visible .svc-media{transform:scale(1.08)}
.svc-card:hover .svc-media::after,.svc-card:focus-visible .svc-media::after{transform:translateX(130%)}
.svc-card::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%),rgba(243,214,117,var(--sa,0)),transparent 70%),linear-gradient(180deg,rgba(7,26,61,.55) 0%,rgba(7,26,61,0) 30%,rgba(7,26,61,.5) 55%,rgba(7,26,61,.97) 100%);transition:opacity .5s}
.svc-card::after{content:"";position:absolute;left:0;right:0;bottom:0;z-index:3;height:4px;background:var(--gold-grad);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease-out)}
.svc-card:hover::after,.svc-card:focus-visible::after{transform:scaleX(1)}
.svc-frame{position:absolute;inset:22px;z-index:3;pointer-events:none;opacity:0;transition:opacity .5s,inset .7s var(--ease-out);background:linear-gradient(var(--gold-hi),var(--gold-hi)) 0 0/22px 1.5px,linear-gradient(var(--gold-hi),var(--gold-hi)) 0 0/1.5px 22px,linear-gradient(var(--gold-hi),var(--gold-hi)) 100% 0/22px 1.5px,linear-gradient(var(--gold-hi),var(--gold-hi)) 100% 0/1.5px 22px,linear-gradient(var(--gold-hi),var(--gold-hi)) 0 100%/22px 1.5px,linear-gradient(var(--gold-hi),var(--gold-hi)) 0 100%/1.5px 22px,linear-gradient(var(--gold-hi),var(--gold-hi)) 100% 100%/22px 1.5px,linear-gradient(var(--gold-hi),var(--gold-hi)) 100% 100%/1.5px 22px;background-repeat:no-repeat}
.svc-card:hover .svc-frame,.svc-card:focus-visible .svc-frame{opacity:1;inset:12px}
.svc-no{position:absolute;z-index:2;top:1.1rem;left:1.5rem;font:700 3.1rem/1 var(--serif);font-variant-numeric:lining-nums;color:transparent;-webkit-text-stroke:1px rgba(243,214,117,.8);transition:color .5s,-webkit-text-stroke-color .5s,transform .6s var(--ease-out)}
.svc-card:hover .svc-no{color:rgba(243,214,117,.95);transform:translateY(-3px)}
.svc-ico{position:absolute;z-index:2;top:1.4rem;right:1.4rem;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;color:var(--gold-hi);background:rgba(7,26,61,.55);border:1px solid rgba(212,175,55,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .45s,color .45s,transform .7s var(--ease-out)}
.svc-ico .ico{width:1.3rem;height:1.3rem}
.svc-card:hover .svc-ico,.svc-card:focus-visible .svc-ico{background:var(--gold-grad);color:var(--navy);transform:rotate(360deg) scale(1.08)}
.svc-body{position:absolute;z-index:2;inset:auto 0 0;padding:1.7rem 1.7rem 1.6rem}
.svc-body h3{position:relative;margin-bottom:0;padding-bottom:.9rem;font-size:1.27rem;color:var(--white);transition:transform .6s var(--ease-out)}
.svc-body h3::after{content:"";position:absolute;left:0;bottom:0;width:42px;height:2px;background:var(--gold-grad);transition:width .7s var(--ease-out)}
.svc-card:hover h3::after{width:100%}
.svc-body p,.svc-more{max-height:0;margin:0;overflow:hidden;opacity:0;transform:translateY(14px);transition:max-height .7s var(--ease-out),opacity .5s,transform .7s var(--ease-out),margin .6s var(--ease-out)}
.svc-body p{font-size:.92rem;line-height:1.6;color:var(--on-navy-2)}
.svc-card:hover .svc-body p,.svc-card:focus-visible .svc-body p{max-height:8rem;margin:.9rem 0 0;opacity:1;transform:none;transition-delay:.05s}
.svc-more{display:flex;align-items:center;justify-content:space-between;font:600 .72rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold-hi)}
.svc-card:hover .svc-more,.svc-card:focus-visible .svc-more{max-height:3.4rem;margin-top:1.1rem;opacity:1;transform:none;transition-delay:.12s}
@media (hover:none){.svc-body p{max-height:8rem;margin:.9rem 0 0;opacity:1;transform:none}.svc-more{max-height:3.4rem;margin-top:1.1rem;opacity:1;transform:none}.svc-no{color:rgba(243,214,117,.9)}}
.arrow-dot{position:relative;display:grid;place-items:center;overflow:hidden;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--gold);color:var(--gold-hi);transition:background .4s var(--ease),color .3s,border-color .3s}
.arrow-dot .ico{grid-area:1/1;width:1.05rem;height:1.05rem;transition:transform .5s var(--ease-out)}
.arrow-dot .ico+.ico{transform:translateX(-170%)}
.svc-card:hover .arrow-dot,.svc-card:focus-visible .arrow-dot{background:var(--gold-grad);border-color:var(--gold);color:var(--navy)}
.svc-card:hover .arrow-dot .ico:first-child,.svc-card:focus-visible .arrow-dot .ico:first-child{transform:translateX(170%)}
.svc-card:hover .arrow-dot .ico+.ico,.svc-card:focus-visible .arrow-dot .ico+.ico{transform:none}
/* client logo marquee */
.marquee{position:relative;overflow:hidden;padding:.6rem 0;--bg:var(--white)}
.marquee::before,.marquee::after{content:"";position:absolute;top:0;bottom:0;z-index:2;width:clamp(40px,9vw,160px);pointer-events:none}
.marquee::before{left:0;background:linear-gradient(90deg,var(--bg),rgba(255,255,255,0))}
.marquee::after{right:0;background:linear-gradient(270deg,var(--bg),rgba(255,255,255,0))}
.marquee-track{display:flex;width:max-content}
.marquee-group{display:flex;flex:none;gap:var(--m-gap,1.25rem);padding-right:var(--m-gap,1.25rem)}
.marquee-track{animation:none}
.marquee.is-ready .marquee-track{animation:marquee-left var(--m-dur,60s) linear infinite}
.marquee[data-marquee=right].is-ready .marquee-track{animation-name:marquee-right}
.marquee:hover .marquee-track,.marquee:focus-within .marquee-track{animation-play-state:paused}
@keyframes marquee-left{to{transform:translateX(calc(var(--m-shift) * -1))}}
@keyframes marquee-right{from{transform:translateX(calc(var(--m-shift) * -1))}to{transform:translateX(0)}}
.logo-card{flex:none;display:grid;place-items:center;min-width:150px;height:80px;padding:.8rem 1.4rem;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 14px 30px -24px rgba(7,26,61,.55);transition:transform .4s var(--ease),border-color .4s,box-shadow .4s}
.logo-card:hover{transform:translateY(-3px);border-color:rgba(212,175,55,.7);box-shadow:0 20px 34px -22px rgba(7,26,61,.6)}

.logo-card img{max-width:100%;height:auto;object-fit:contain}
.logo-ph{display:grid;place-items:center;gap:.25rem;width:100%;height:100%;border:1px dashed rgba(184,146,31,.55);border-radius:4px;color:var(--gold-ink);font:600 .64rem/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;text-align:center}
.logo-ph .ico{width:1.3rem;height:1.3rem;opacity:.75}

/* "sample content" marker for placeholder cards (delete the element when real content is added) */
.sample-tag{position:absolute;top:.9rem;right:.9rem;z-index:3;padding:.3rem .65rem;font:600 .6rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold-ink);background:rgba(255,255,255,.92);border:1px dashed var(--gold);border-radius:99px}

/* call to action band (homepage + inner pages) */
.cta{position:relative;overflow:hidden;padding:clamp(3.5rem,7vw,5.5rem) 0;text-align:center;color:var(--white);background:linear-gradient(160deg,#0A2A66 -20%,#071A3D 50%,#050F26 100%)}
.cta-art{position:absolute;inset:0;pointer-events:none;background:radial-gradient(50% 80% at 50% 0%,rgba(6,70,168,.6),transparent 70%),radial-gradient(35% 60% at 12% 100%,rgba(212,175,55,.18),transparent 70%),var(--wm) 100% 120%/38% auto no-repeat}
.cta-art::after{content:"";position:absolute;left:50%;top:0;width:min(520px,70%);height:2px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--gold-hi),transparent);box-shadow:0 0 22px 2px rgba(243,214,117,.6)}
.cta-inner{position:relative;max-width:760px}
.cta h2{margin-bottom:1rem;font-size:clamp(1.62rem,3.8vw,2.55rem);color:var(--white)}
.cta p{max-width:36rem;margin:0 auto 2rem;font-size:1.05rem;color:var(--on-navy-2)}
.cta .btn-row{justify-content:center}
.cta .btn-gold{box-shadow:0 0 0 0 rgba(212,175,55,.5),0 16px 30px -14px rgba(184,146,31,.95),inset 0 1px 0 rgba(255,255,255,.55);animation:glow 3.4s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 0 9px rgba(212,175,55,0),0 16px 30px -14px rgba(184,146,31,.95),inset 0 1px 0 rgba(255,255,255,.55)}}
.cta .btn-gold:hover{animation:none}
@media (max-width:600px){.cta .btn-row .btn{flex:1 1 100%}}
@media (prefers-reduced-motion:reduce){.cta .btn-gold{animation:none}}