/*
Theme Name: JLL Hutch Air Cargo Advisors
Description: A responsive marketing theme for JLL Hutch Air Cargo Advisors.
Version: 1.1.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: jll-hutch
*/

:root { --plum:#202124; --coral:#C46A35; --charcoal:#202124; --warm:#F5F1EB; --muted:#68645f; --line:#e1d9d0; --ink:#141414; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--charcoal); background:var(--warm); font-family:Arial,Helvetica,sans-serif; font-size:16px; line-height:1.6; }
a { color:inherit; }
img { max-width:100%; height:auto; }
.container { width:min(1140px, calc(100% - 48px)); margin:0 auto; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(250,249,247,.96); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.header-inner { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand-logo { display:block; width:152px; }
.primary-menu { display:flex; align-items:center; gap:28px; list-style:none; padding:0; margin:0; }
.primary-menu a { text-decoration:none; color:var(--charcoal); font-weight:700; font-size:14px; }
.primary-menu a:hover, .primary-menu .current-menu-item a { color:var(--plum); }
.menu-toggle { display:none; border:0; background:transparent; color:var(--plum); font:700 15px Arial,sans-serif; padding:9px 0; }
.hero { overflow:hidden; padding:102px 0 92px; background:radial-gradient(circle at 88% 22%, #ece5dc 0 15%, transparent 15.2%),var(--warm); }
.hero-grid { display:grid; grid-template-columns:1.08fr .92fr; align-items:center; gap:60px; }
.eyebrow { margin:0 0 18px; color:var(--coral); font-size:13px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
h1,h2,h3 { color:var(--plum); line-height:1.06; margin:0; }
h1 { max-width:720px; font-size:clamp(45px,6vw,78px); letter-spacing:-.055em; }
h2 { font-size:clamp(32px,4vw,49px); letter-spacing:-.04em; }
h3 { font-size:21px; letter-spacing:-.02em; }
.hero p:not(.eyebrow) { max-width:620px; font-size:20px; line-height:1.55; color:#4d4e52; margin:26px 0 32px; }
.button { display:inline-block; border:2px solid var(--plum); background:var(--plum); color:#fff; text-decoration:none; padding:13px 21px; font-size:14px; font-weight:800; border-radius:3px; transition:.2s ease; }
.button:hover { transform:translateY(-2px); background:#101112; border-color:#101112; }
.button.secondary { background:transparent; color:var(--plum); margin-left:10px; }
.button.secondary:hover { background:var(--plum); color:#fff; }
.hero-logo { position:relative; min-height:390px; display:grid; place-items:center; }
.hero-logo::before { content:""; position:absolute; width:390px; aspect-ratio:1; border-radius:50%; background:#ece5dc; transform:translate(30px,-12px); }
.hero-logo img { position:relative; z-index:1; width:min(100%,440px); }
.section { padding:96px 0; }
.section.plum { background:var(--plum); color:#fff; }
.section.plum h2 { color:#fff; }
.section-head { max-width:660px; margin-bottom:48px; }
.section-head p { color:var(--muted); margin:18px 0 0; font-size:18px; }
.plum .section-head p { color:#ddd3e4; }
.service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.service { min-height:244px; padding:30px 26px; border:1px solid var(--line); background:#fff; display:flex; flex-direction:column; justify-content:flex-end; }
.service-number { margin-bottom:auto; color:var(--coral); font-size:13px; font-weight:800; letter-spacing:.12em; }
.service p { margin:12px 0 0; color:var(--muted); font-size:15px; line-height:1.5; }
.approach { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:start; }
.approach-copy p { color:var(--muted); font-size:18px; margin:22px 0 0; }
.steps { margin:0; padding:0; list-style:none; border-top:1px solid #8a6349; }
.steps li { padding:23px 0; border-bottom:1px solid #8a6349; display:grid; grid-template-columns:46px 1fr; gap:14px; }
.step-number { color:var(--coral); font-size:14px; font-weight:800; }
.steps strong { display:block; font-size:18px; }
.steps span { display:block; color:#ddd3e4; font-size:15px; margin-top:3px; }
.split { display:grid; grid-template-columns:.8fr 1.2fr; gap:60px; align-items:center; }
.mark-card { background:#fff; min-height:370px; display:grid; place-items:center; padding:42px; border-top:5px solid var(--coral); }
.mark-card img { width:320px; }
.contact-panel { background:linear-gradient(120deg,#fff 0 55%,#ece5dc 55%); padding:60px; border:1px solid var(--line); }
.contact-panel p { color:var(--muted); font-size:18px; max-width:600px; margin:20px 0 28px; }
.contact-meta { margin-top:26px; font-size:15px; font-weight:700; }
.contact-meta a { color:var(--plum); text-decoration:none; }
.site-footer { background:var(--ink); color:#d7d3d9; padding:42px 0; }
.footer-inner { display:flex; justify-content:space-between; gap:24px; align-items:center; }
.footer-inner img { width:150px; filter:brightness(0) invert(1); }
.footer-inner p { margin:0; font-size:13px; }
.page-hero { padding:92px 0 54px; background:#ece5dc; }
.page-hero h1 { font-size:clamp(42px,5vw,68px); }
.page-content { padding:70px 0 96px; }
.entry-content { max-width:780px; }
.entry-content h2 { margin:42px 0 16px; font-size:34px; }
.entry-content p { margin:0 0 18px; }
@media (max-width:900px) { .hero-grid,.approach,.split { grid-template-columns:1fr; gap:42px; } .hero-logo { min-height:300px; } .service-grid { grid-template-columns:repeat(2,1fr); } .contact-panel { padding:42px; } }
@media (max-width:680px) { .container { width:min(100% - 34px,1140px); } .header-inner { min-height:68px; } .brand-logo { width:132px; } .menu-toggle { display:block; } .primary-menu { display:none; position:absolute; left:0; right:0; top:68px; background:var(--warm); padding:18px; border-bottom:1px solid var(--line); flex-direction:column; align-items:flex-start; gap:14px; } .primary-menu.is-open { display:flex; } .hero { padding:64px 0 58px; } .hero p:not(.eyebrow) { font-size:18px; } .button.secondary { margin:12px 0 0; } .service-grid { grid-template-columns:1fr; } .section { padding:68px 0; } .mark-card { min-height:270px; } .contact-panel { padding:32px 25px; background:#fff; } .footer-inner { display:block; } .footer-inner p { margin-top:18px; } }