@import "tailwindcss";
:root{--ink:#071013;--gold:#c99a59;--cream:#f3f0e9;--muted:#65716f;--line:rgba(255,255,255,.16)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:#fff;font-family:Arial,Helvetica,sans-serif}.shell{width:min(1180px,calc(100% - 48px));margin:auto}.nav{height:90px;position:absolute;z-index:10;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.2)}.brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}.brand-mark{width:45px;height:45px;border:1px solid rgba(255,255,255,.5);display:grid;place-items:center;color:#deb47b;font:400 15px Georgia,serif}.brand b,.brand small{display:block;letter-spacing:.15em}.brand b{font-size:12px}.brand small{font-size:9px;color:#aeb8b4;margin-top:4px}.nav-links{display:flex;gap:34px}.nav-links a,.nav-cta{color:#eef1ef;text-decoration:none;font-size:13px}.nav-links a:hover,.nav-cta:hover{color:#deb47b}.nav-cta,.button,.inline-link,.commodity-card>a{display:inline-flex;align-items:center;gap:11px}.nav-cta svg,.button svg,.inline-link svg,.commodity-card>a svg{width:18px;fill:none;stroke:currentColor;stroke-width:1.6}.hero{height:820px;position:relative;display:flex;align-items:center;overflow:hidden}.hero-image{position:absolute;inset:0;background:url('images/Background.gif') center/cover}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,11,13,.96),rgba(4,11,13,.75) 48%,rgba(4,11,13,.18) 82%),linear-gradient(0deg,rgba(4,11,13,.92),transparent 52%)}.hero-content{position:relative;padding-top:72px}.eyebrow,.kicker{font-size:10px;letter-spacing:.28em;font-weight:700}.eyebrow{display:flex;align-items:center;gap:12px;color:#cbd2ce}.eyebrow span{width:30px;height:1px;background:var(--gold)}h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:400}h1{font-size:clamp(58px,7vw,96px);line-height:.94;letter-spacing:-.04em;margin:30px 0}h1 em{color:#d7a666;font-weight:400}.hero-copy{max-width:610px;color:#c6ceca;font-size:18px;line-height:1.7}.hero-actions{display:flex;align-items:center;gap:34px;margin-top:40px}.button{justify-content:space-between;padding:18px 22px;color:#fff;text-decoration:none;font-size:13px;min-width:245px}.gold{background:var(--gold);color:#081114}.gold:hover{background:#dfb476}.text-link{color:white;text-decoration:none;font-size:13px}.text-link span{color:#d7a666;margin-left:9px}.proof-row{position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:1fr 1fr 1fr 1.1fr;border-top:1px solid var(--line);padding:27px 0}.proof-row div{border-right:1px solid var(--line);padding-left:27px}.proof-row div:first-child{padding-left:0}.proof-row strong,.proof-row span{display:block}.proof-row strong{font-size:11px;letter-spacing:.14em}.proof-row span,.proof-row p{color:#9eaaa5;font-size:10px;margin-top:7px}.proof-row p{margin:0;text-align:right;line-height:1.7}.intro{background:var(--cream);color:var(--ink);display:grid;grid-template-columns:1.1fr .85fr;gap:100px;padding:120px max(24px,calc((100vw - 1180px)/2));width:100%;max-width:none}.kicker{color:var(--gold);margin:0 0 18px}.intro h2,.section-head h2,.trade-copy h2,.contact h2{font-size:clamp(42px,5vw,66px);line-height:1.02;letter-spacing:-.035em;margin:0}.intro>div:last-child>p,.section-head>p,.trade-copy>p,.contact-inner>div>p{color:var(--muted);font-size:15px;line-height:1.8;margin-top:0}.inline-link{color:#182326;text-decoration:none;font-size:12px;font-weight:700;margin-top:15px}.commodities{background:#e8e5dd;color:var(--ink);padding:120px 0}.section-head{display:grid;grid-template-columns:1.2fr .72fr;align-items:end;gap:90px;margin-bottom:56px}.commodity-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.commodity-card{background:#f8f6f1;padding-bottom:24px;transition:transform .25s}.commodity-card:hover{transform:translateY(-5px)}.commodity-image{height:250px;background-size:cover;background-position:center;position:relative;padding:18px;color:white}.commodity-image>span{font-size:10px;border:1px solid rgba(255,255,255,.5);padding:6px 8px}.commodity-image h3{position:absolute;left:20px;bottom:18px;margin:0;font-size:27px}.commodity-card>p{font-size:12px;line-height:1.7;color:#64706d;min-height:82px;margin:22px 22px 15px}.commodity-card>a{color:#182326;text-decoration:none;font-size:10px;font-weight:700;letter-spacing:.08em;margin:0 22px}.commodity-card>a svg{width:15px}.trade{display:grid;grid-template-columns:1fr 1fr;background:#0e191d;min-height:760px}.trade-photo{background:url('images/global-logistics.png') center/cover}.trade-copy{padding:100px clamp(45px,7vw,110px);align-self:center}.trade-copy>p{color:#aeb9b4;margin:30px 0}.trade-copy blockquote{font:italic 22px/1.5 Georgia,serif;color:#d9ddd9;border-left:2px solid var(--gold);margin:38px 0;padding-left:25px}.trade-tags{display:flex;flex-wrap:wrap;gap:8px}.trade-tags span{border:1px solid var(--line);padding:9px 11px;color:#aeb8b4;font-size:10px}.approach{background:#f4f1ea;color:var(--ink);padding:120px 0}.steps{display:grid;grid-template-columns:repeat(4,1fr)}.step{padding-right:30px}.step>span{color:var(--gold);font-size:11px}.step i{display:block;height:1px;background:#bfc6c2;margin:20px 0;position:relative}.step i:after{content:'';position:absolute;left:0;top:-4px;width:9px;height:9px;background:var(--gold);border-radius:50%}.step h3{font-size:24px;margin:22px 0 12px}.step p{color:#68726f;font-size:13px;line-height:1.7}.contact{background:#111d21;padding:110px 0}.contact-inner{display:grid;grid-template-columns:1fr .85fr;gap:120px;align-items:center}.contact-inner>div>p{color:#a9b3ae;max-width:530px;margin-top:28px}.contact-card{background:rgba(255,255,255,.055);border:1px solid var(--line);padding:38px}.contact-card>div{padding-bottom:22px;margin-bottom:22px;border-bottom:1px solid var(--line)}.contact-card small{display:block;color:#8f9b96;font-size:9px;letter-spacing:.2em;margin-bottom:9px}.contact-card a:not(.button){color:#fff;text-decoration:none;font:400 22px Georgia,serif}.contact-card .button{width:100%}.footer{background:#050a0c;padding:38px 0}.footer .shell{display:flex;align-items:center;justify-content:space-between}.footer p,.footer>div>small{font-size:9px;color:#87918d;letter-spacing:.1em}
@media(max-width:900px){.commodity-grid{grid-template-columns:repeat(2,1fr)}.nav-links{display:none}.intro,.contact-inner{gap:50px}.trade-copy{padding:70px 35px}}
@media(max-width:700px){.shell{width:min(100% - 32px,1180px)}.nav{height:76px}.nav-cta{font-size:0}.nav-cta:after{content:'ENQUIRE';font-size:10px;letter-spacing:.12em}.hero{height:800px}.hero-content{padding-top:40px}.hero-copy{font-size:16px}.hero-actions{flex-direction:column;align-items:flex-start}.proof-row{grid-template-columns:repeat(3,1fr)}.proof-row p{display:none}.proof-row div{padding-left:10px}.proof-row span{display:none}.intro,.section-head,.contact-inner{grid-template-columns:1fr;gap:28px}.intro,.commodities,.approach{padding-top:78px;padding-bottom:78px}.commodity-grid{grid-template-columns:1fr}.commodity-image{height:265px}.trade{grid-template-columns:1fr}.trade-photo{min-height:420px}.trade-copy{padding:72px 24px}.steps{grid-template-columns:1fr 1fr;gap:34px 12px}.contact{padding:75px 0}.contact-card{padding:26px}.footer .shell{align-items:flex-start;flex-direction:column;gap:18px}.footer p{display:none}}
@media(max-width:440px){h1{font-size:51px}.button{min-width:100%}.steps{grid-template-columns:1fr}.contact-card a:not(.button){font-size:18px}}
.vertical-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.vertical-card{background:#f8f6f1;transition:transform .25s ease}.vertical-card:hover{transform:translateY(-5px)}.vertical-image{height:330px;background-size:cover;background-position:center;position:relative;padding:24px;color:#fff}.vertical-image>span{font-size:10px;border:1px solid rgba(255,255,255,.5);padding:7px 9px}.vertical-image>div{position:absolute;left:28px;bottom:28px}.vertical-image p{font:700 9px Arial,sans-serif;letter-spacing:.22em;margin:0 0 10px;color:#d4d9d6}.vertical-image h3{font-size:39px;margin:0}.vertical-body{padding:30px}.vertical-body>p{color:#65706d;font-size:13px;line-height:1.75;margin:0 0 24px}.product-list{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}.product-list span{border:1px solid #d7dcd8;background:#fff;padding:9px 11px;font-size:10px;color:#46514e}.vertical-body>a{display:inline-flex;align-items:center;gap:10px;color:#182326;text-decoration:none;font-size:10px;font-weight:700;letter-spacing:.08em}.vertical-body>a svg{width:16px;fill:none;stroke:currentColor;stroke-width:1.6}
@media(max-width:700px){.vertical-grid{grid-template-columns:1fr}.vertical-image{height:280px}.vertical-image h3{font-size:34px}.vertical-body{padding:24px}}
/* Dark glass theme */
body{background:#050a0c;background-image:radial-gradient(circle at 15% 20%,rgba(201,154,89,.08),transparent 28%),radial-gradient(circle at 85% 65%,rgba(58,112,116,.10),transparent 32%);background-attachment:fixed}
.intro,.commodities,.approach{background:rgba(7,16,19,.88);color:#f3f3ef}
.intro{border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.intro>div:last-child>p,.section-head>p,.step p{color:#a9b4b0}
.commodities{background:linear-gradient(180deg,rgba(11,24,28,.9),rgba(5,10,12,.94))}
.vertical-card{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);box-shadow:0 24px 70px rgba(0,0,0,.28);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.vertical-body>p{color:#aeb8b4}
.product-list span{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.14);color:#d9dedb}
.vertical-body>a,.inline-link{color:#ddb274}
.trade{background:rgba(5,11,13,.96)}
.trade-copy{background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.018));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.approach{background:rgba(8,18,21,.94)}
.step{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);padding:26px;margin-right:12px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.step i{background:rgba(255,255,255,.2)}
.contact{background:linear-gradient(135deg,rgba(12,26,30,.96),rgba(5,10,12,.98))}
.contact-card{background:rgba(255,255,255,.07);box-shadow:0 24px 80px rgba(0,0,0,.3);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
@media(max-width:700px){.step{margin-right:0}}

/* SMAPL logo: replaces the old bordered square brand mark */
.brand-logo{display:block;width:72px;height:72px;object-fit:contain;flex:0 0 auto;border:0;outline:0;background:transparent}
.footer-logo{width:60px;height:60px}
@media(max-width:700px){.brand-logo{width:60px;height:60px}.footer-logo{width:54px;height:54px}}
.petro{background-image:linear-gradient(90deg,rgba(8,14,17,.9),rgba(8,14,17,.25)),url('images/petrochemicals.png')}.metals{background-image:linear-gradient(90deg,rgba(8,14,17,.9),rgba(8,14,17,.25)),url('images/metals-copper.png')}

/* Dark glass theme */
body{background:#050a0c;background-image:radial-gradient(circle at 15% 20%,rgba(201,154,89,.08),transparent 28%),radial-gradient(circle at 85% 65%,rgba(58,112,116,.10),transparent 32%);background-attachment:fixed}
.intro,.commodities,.approach{background:rgba(7,16,19,.88);color:#f3f3ef}
.intro{border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.intro>div:last-child>p,.section-head>p,.step p{color:#a9b4b0}
.commodities{background:linear-gradient(180deg,rgba(11,24,28,.9),rgba(5,10,12,.94))}
.vertical-card{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);box-shadow:0 24px 70px rgba(0,0,0,.28);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.vertical-body>p{color:#aeb8b4}.product-list span{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.14);color:#d9dedb}.vertical-body>a,.inline-link{color:#ddb274}
.trade{background:rgba(5,11,13,.96)}.trade-copy{background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.018));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.approach{background:rgba(8,18,21,.94)}.step{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);padding:26px;margin-right:12px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.step i{background:rgba(255,255,255,.2)}
.contact{background:linear-gradient(135deg,rgba(12,26,30,.96),rgba(5,10,12,.98))}.contact-card{background:rgba(255,255,255,.07);box-shadow:0 24px 80px rgba(0,0,0,.3);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
@media(max-width:700px){.step{margin-right:0}}