/*
Theme Name: Ocean Arc Theme
Theme URI: https://oceanarcgroup.com
Author: Ocean Arc Group
Description: Block theme for Ocean Arc Group (China to Philippines freight forwarding). Presentation only; logic lives in the oceanarc-core plugin.
Version: 1.0.0
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 8.1
License: GPL-2.0-or-later
Text Domain: oceanarc-theme
*/

:root{--oa-navy:#0B2545;--oa-ink:#14213D;--oa-teal:#0E7C74;--oa-teal-bright:#12B5B0;--oa-gold:#E8B04A;--oa-sand:#F7F5F0;--oa-mist:#EAF3F6;--oa-line:#D5DEE6;--oa-alert:#B3261E;--oa-header-h:76px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--oa-header-h) + 12px)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{text-underline-offset:.15em}
:focus-visible{outline:3px solid var(--oa-gold);outline-offset:2px;box-shadow:0 0 0 2px var(--oa-navy)}
.oa-on-dark :focus-visible,.has-navy-background-color :focus-visible{box-shadow:none;outline-color:var(--oa-gold)}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--oa-gold);color:var(--oa-navy);padding:.75rem 1rem;z-index:100;font-weight:600}
.skip-link:focus{left:8px;top:8px}

/* Header */
.oa-utility-bar{background:var(--oa-navy);color:#C9D6E2;font-size:.875rem}
.oa-utility{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;justify-content:flex-end;padding:.4rem 0}
.oa-utility a,.oa-utility-bar a{color:#fff}
.oa-site-header{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid var(--oa-line);transition:box-shadow .2s ease}
.oa-site-header.is-scrolled{box-shadow:0 4px 16px rgba(11,37,69,.12)}
@media(max-width:781px){.oa-site-header{position:static}.oa-utility-bar{display:none}}
.oa-logo-link{display:inline-flex;text-decoration:none}
.oa-logo{height:44px;width:auto}
@media(max-width:781px){.oa-logo{height:36px}}
.oa-site-header .wp-block-navigation a{color:var(--oa-navy);font-weight:500;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.oa-site-header .wp-block-navigation a:hover{color:var(--oa-teal)}
.wp-block-navigation .wp-block-navigation__submenu-container{border:1px solid var(--oa-line);border-radius:10px;padding:.4rem}

/* Buttons (block styles) */
.wp-block-button__link{min-height:48px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;transition:background .2s ease,transform .2s ease}
.wp-block-button.is-style-accent .wp-block-button__link{background:var(--oa-gold);color:var(--oa-navy)}
.wp-block-button.is-style-accent .wp-block-button__link:hover{background:#F0BE64;color:var(--oa-navy)}
.wp-block-button.is-style-outline .wp-block-button__link{background:#fff;color:var(--oa-navy);border:2px solid var(--oa-navy)}
.oa-on-dark .wp-block-button.is-style-outline .wp-block-button__link{background:transparent;color:#fff;border-color:#fff}

/* Hero (home) */
.oa-hero{position:relative;isolation:isolate;color:#fff;background:var(--oa-navy) var(--oa-img-hero-home) center/cover no-repeat}
.oa-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(11,37,69,.88) 0%,rgba(11,37,69,.55) 45%,rgba(11,37,69,.10) 100%)}
@media(max-width:781px){.oa-hero::before{background:rgba(11,37,69,.72)}}
.oa-hero h1,.oa-hero p{color:#fff}
.oa-hero .oa-hero-copy{max-width:720px}
.oa-track-box{background:#fff;color:var(--oa-ink);border-radius:16px;box-shadow:0 12px 32px rgba(11,37,69,.25);padding:1.25rem 1.5rem}
.oa-track-box label{color:var(--oa-navy);font-weight:600}
.oa-track-box form{display:flex;flex-wrap:wrap;gap:.6rem;align-items:end}
.oa-track-box .oa-tb-field{flex:1 1 240px}
.oa-track-box input[type=text]{width:100%;min-height:48px;padding:.6rem .8rem;border:1.5px solid #8DA0B3;border-radius:10px;font:inherit}
.oa-track-box p{margin:.5rem 0 0;font-size:.9rem;color:#3d4b63}
@media(min-width:782px){.oa-track-wrap{margin-bottom:-48px;position:relative;z-index:2}}

/* Inner page header: navy + page image @25% + arc pattern */
.oa-page-header{position:relative;isolation:isolate;background:var(--oa-navy);color:#fff;min-height:220px;display:flex;align-items:center;overflow:hidden}
.oa-page-header::before{content:"";position:absolute;inset:0;z-index:-2;background-image:var(--oa-hero-img,none);background-size:cover;background-position:center;opacity:.25}
.oa-page-header::after{content:"";position:absolute;right:-180px;top:50%;width:560px;height:560px;margin-top:-280px;border:2px solid var(--oa-teal-bright);border-radius:50%;opacity:.25;z-index:-1}
.oa-page-header h1{color:#fff;margin:0}
.oa-page-header .oa-crumb{color:#C9D6E2;font-size:.9rem;margin:0 0 .5rem}
.oa-page-header .oa-crumb a{color:#C9D6E2}
@media(min-width:782px){.oa-page-header{min-height:260px}}
.oa-hero--about{--oa-hero-img:var(--oa-img-about-hero)}
.oa-hero--sea{--oa-hero-img:var(--oa-img-sea-hero)}
.oa-hero--air{--oa-hero-img:var(--oa-img-air-hero)}
.oa-hero--land{--oa-hero-img:var(--oa-img-land-hero)}
.oa-hero--contact{--oa-hero-img:var(--oa-img-contact-hero)}
.oa-hero--careers{--oa-hero-img:var(--oa-img-careers-hero)}

/* Section rhythm: white -> sand -> white -> mist (never two identical adjacent) */
.oa-sec{padding-block:clamp(3rem,7vw,5.5rem)}
.oa-sec--sand{background:var(--oa-sand)}
.oa-sec--mist{background:var(--oa-mist)}
.oa-sec--waves{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='120' viewBox='0 0 600 120'%3E%3Cg fill='none' stroke='%230E7C74' stroke-opacity='.06' stroke-width='2'%3E%3Cpath d='M0 40q75-30 150 0t150 0 150 0 150 0'/%3E%3Cpath d='M0 65q75-30 150 0t150 0 150 0 150 0'/%3E%3Cpath d='M0 90q75-30 150 0t150 0 150 0 150 0'/%3E%3C/g%3E%3C/svg%3E");background-repeat:repeat-x;background-position:bottom;background-size:600px 120px}

/* Cards */
.oa-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.oa-card-el{background:#fff;border:1px solid var(--oa-line);border-radius:14px;padding:1.5rem;transition:transform .2s ease,box-shadow .2s ease}
.oa-card-el:hover{transform:translateY(-4px);box-shadow:0 10px 24px rgba(11,37,69,.1)}
.oa-card-el h3{margin-top:.75rem;margin-bottom:.4rem}
.oa-card-el p{margin:.25rem 0 .75rem}
.oa-icon{width:44px;height:44px;stroke:var(--oa-navy);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.oa-icon .accent{stroke:var(--oa-teal)}
.oa-steps-list{counter-reset:s;list-style:none;padding:0;display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.oa-steps-list li{counter-increment:s;background:#fff;border:1px solid var(--oa-line);border-radius:14px;padding:1.25rem 1.25rem 1.25rem 1.25rem}
.oa-steps-list li::before{content:counter(s);display:inline-flex;width:36px;height:36px;border-radius:50%;background:var(--oa-navy);color:#fff;align-items:center;justify-content:center;font-family:Sora,sans-serif;font-weight:700;margin-bottom:.6rem}
.oa-steps-list strong{display:block;margin-bottom:.35rem;color:var(--oa-navy)}
.oa-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--oa-line);border-radius:12px;overflow:hidden}
.oa-table th,.oa-table td{padding:.8rem 1rem;text-align:left;border-bottom:1px solid var(--oa-line)}
.oa-table thead th{background:var(--oa-navy);color:#fff}
.oa-table-wrap{overflow-x:auto}
.oa-tip{border-left:4px solid var(--oa-gold);background:var(--oa-sand);padding:1rem 1.25rem;border-radius:0 10px 10px 0}

/* CTA band + footer */
.oa-cta{position:relative;overflow:hidden;color:#fff;background:linear-gradient(180deg,var(--oa-navy),#12335F)}
.oa-cta::after{content:"";position:absolute;right:-260px;top:50%;width:840px;height:840px;margin-top:-420px;border:2px solid var(--oa-teal-bright);border-radius:50%;opacity:.25;pointer-events:none}
.oa-cta h2,.oa-cta p{color:#fff}
.oa-cta .wp-block-buttons{position:relative;z-index:1}
.oa-footer{background:var(--oa-navy);border-top:4px solid var(--oa-gold);color:#C9D6E2}
.oa-footer h2,.oa-footer h3,.oa-footer h4{color:#fff;font-size:1.05rem}
.oa-footer a{color:#C9D6E2}
.oa-footer a:hover{color:#fff}
.oa-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:.4rem}
.oa-footer address{font-style:normal}
.oa-footer .oa-legal{border-top:1px solid rgba(255,255,255,.18);font-size:.875rem}

/* Posts */
.oa-post-card{background:#fff;border:1px solid var(--oa-line);border-radius:14px;overflow:hidden}
.oa-post-card .wp-block-post-title{font-size:1.25rem;margin:.5rem 0}
.oa-prose{max-width:760px}
.oa-prose h2{margin-top:2rem}

.oa-404 img{max-width:420px}
.oa-placeholder-note{display:none}

.oa-hero + .oa-sec{padding-top:calc(clamp(3rem,7vw,5.5rem) + 48px)}
@media(max-width:781px){.oa-hero + .oa-sec{padding-top:clamp(3rem,7vw,5.5rem)}}

.oa-hero .oa-hero-copy{margin-left:0!important}
.oa-page-header .alignwide>*{margin-left:0!important;margin-right:auto!important}
.oa-grid--five{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
@media(max-width:781px){.oa-site-header .wp-block-buttons{display:none}}
