/*
Theme Name: Amuloma Nexus Shipping
Theme URI: https://amulomanexusshipping.com
Author: Amuloma Nexus Shipping
Description: A complete multi-page shipping and freight forwarding theme for Amuloma Nexus Shipping, Freetown, Sierra Leone. Ocean freight, air freight, container services and shipment tracking. Mobile-first, navy and gold, aviation and maritime photography only.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ans-shipping
Tags: business, logistics, shipping, custom-logo, custom-menu, featured-images, responsive-layout, translation-ready
*/

/* ==========================================================================
   1. DESIGN TOKENS
   ========================================================================== */

:root{
  --ans-navy:#0d1f33;
  --ans-navy-2:#14293f;
  --ans-navy-3:#1b3550;
  --ans-gold:#c9a227;
  --ans-gold-2:#e3c35c;
  --ans-gold-3:#f0d98a;
  --ans-ink:#16202b;
  --ans-body:#43505e;
  --ans-muted:#7d8a97;
  --ans-line:#dde3ea;
  --ans-line-2:#eef2f6;
  --ans-bg:#f6f8fa;
  --ans-white:#fff;
  --ans-ok:#2e7d4f;
  --ans-ok-bg:#e8f5ec;
  --ans-err:#b3261e;
  --ans-err-bg:#fdecea;

  --ans-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --ans-serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;

  --ans-radius:4px;
  --ans-radius-sm:2px;
  --ans-wrap:1180px;
  --ans-read:860px;
  --ans-header-h:82px;

  --ans-shadow-sm:0 6px 18px -10px rgba(13,31,51,.28);
  --ans-shadow:0 18px 44px -22px rgba(13,31,51,.35);
  --ans-shadow-lg:0 30px 70px -34px rgba(13,31,51,.45);

  --ans-ease:cubic-bezier(.22,.61,.36,1);
}

/* ==========================================================================
   2. RESET / BASE
   ========================================================================== */

*,*::before,*::after{box-sizing:border-box}

html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body{
  margin:0;
  background:var(--ans-white);
  color:var(--ans-body);
  font-family:var(--ans-sans);
  font-size:16px;
  line-height:1.7;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}

img,
svg,
video,
iframe{max-width:100%}

img,
video{height:auto;display:block}

figure{margin:0 0 1.5em}

hr{
  border:0;
  border-top:1px solid var(--ans-line);
  margin:2.5em 0;
}

/* ==========================================================================
   3. TYPOGRAPHY
   ========================================================================== */

h1,h2,h3,h4,h5,h6{
  font-family:var(--ans-serif);
  color:var(--ans-navy);
  font-weight:600;
  line-height:1.14;
  letter-spacing:-.005em;
  margin:0 0 .5em;
  text-wrap:balance;
}

h1{font-size:clamp(2rem,7vw,3.5rem)}
h2{font-size:clamp(1.6rem,5vw,2.5rem)}
h3{font-size:clamp(1.2rem,3.6vw,1.5rem)}
h4{font-size:1.1rem;line-height:1.3}
h5{font-size:1rem;font-family:var(--ans-sans);letter-spacing:.06em;text-transform:uppercase}
h6{font-size:.85rem;font-family:var(--ans-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ans-muted)}

p{margin:0 0 1.15em}
p:last-child{margin-bottom:0}

strong,b{font-weight:700;color:var(--ans-ink)}

small{font-size:.85em}

a{
  color:var(--ans-navy-3);
  text-decoration:none;
  text-underline-offset:.18em;
  transition:color .2s var(--ans-ease);
}
a:hover{color:var(--ans-gold)}
a:focus-visible{
  outline:2px solid var(--ans-gold);
  outline-offset:3px;
  border-radius:1px;
}

ul,ol{margin:0 0 1.2em;padding-left:1.25em}
li{margin-bottom:.45em}
li:last-child{margin-bottom:0}

blockquote{
  margin:1.8em 0;
  padding:20px 24px;
  border-left:4px solid var(--ans-gold);
  background:var(--ans-bg);
  font-family:var(--ans-serif);
  font-size:1.15rem;
  color:var(--ans-navy);
}
blockquote p:last-child{margin-bottom:0}
blockquote cite{
  display:block;
  margin-top:.6em;
  font-family:var(--ans-sans);
  font-size:.8rem;
  font-style:normal;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ans-muted);
}

code,kbd,samp,pre{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.9em;
}
code{
  background:var(--ans-bg);
  border:1px solid var(--ans-line);
  padding:.1em .4em;
  border-radius:var(--ans-radius-sm);
  color:var(--ans-navy);
}
pre{
  background:var(--ans-navy);
  color:#dbe6ef;
  padding:20px;
  border-radius:var(--ans-radius);
  overflow-x:auto;
  margin:0 0 1.5em;
}
pre code{background:none;border:0;padding:0;color:inherit}

/* ==========================================================================
   4. LAYOUT
   ========================================================================== */

.ans-wrap{
  width:100%;
  max-width:var(--ans-wrap);
  margin:0 auto;
  padding:0 20px;
}

.ans-content{padding:clamp(40px,8vw,80px) 0}
.ans-content > .ans-wrap{max-width:var(--ans-read)}

/* ==========================================================================
   5. ACCESSIBILITY
   ========================================================================== */

.ans-skip{
  position:absolute;
  left:-9999px;
  top:0;
  z-index:999;
  background:var(--ans-gold);
  color:var(--ans-navy);
  padding:12px 20px;
  font-weight:700;
  font-size:14px;
}
.ans-skip:focus{left:8px;top:8px;color:var(--ans-navy)}

.screen-reader-text{
  position:absolute !important;
  width:1px;height:1px;
  overflow:hidden;
  clip:rect(1px,1px,1px,1px);
  clip-path:inset(50%);
  white-space:nowrap;
}

:focus-visible{outline:2px solid var(--ans-gold);outline-offset:3px}

/* ==========================================================================
   6. TOP BAR
   ========================================================================== */

.ans-topbar{
  background:var(--ans-navy);
  color:#b9c8d6;
  font-size:13px;
  letter-spacing:.02em;
}
.ans-topbar .ans-wrap{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:4px 16px;
  padding:9px 20px;
  text-align:center;
}
.ans-topbar a{color:#dbe6ef}
.ans-topbar a:hover{color:var(--ans-gold-2)}
.ans-topbar .ans-dot{color:var(--ans-gold);opacity:.6}
.ans-topbar .ans-hide-sm{display:none}

/* ==========================================================================
   7. HEADER
   ========================================================================== */

.ans-header{
  position:sticky;
  top:0;
  z-index:80;
  background:rgba(255,255,255,.97);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--ans-line);
}

.ans-header .ans-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:70px;
  padding:10px 20px;
}

/* Brand */
.ans-brand{
  display:flex;
  align-items:center;
  gap:11px;
  flex-shrink:0;
  min-width:0;
}
.ans-brand:hover{color:inherit}
.ans-brand img,
.ans-brand .custom-logo{
  max-height:52px;
  width:auto;
}
.ans-brand-mark{
  display:grid;
  place-items:center;
  flex-shrink:0;
  width:44px;
  height:44px;
  border:1px solid var(--ans-gold);
  background:var(--ans-navy);
  color:var(--ans-gold);
  font-family:var(--ans-serif);
  font-size:17px;
  letter-spacing:.04em;
  line-height:1;
}
.ans-brand-text{min-width:0}
.ans-brand-text strong{
  display:block;
  font-family:var(--ans-serif);
  font-size:16px;
  font-weight:600;
  line-height:1.08;
  color:var(--ans-navy);
  letter-spacing:.01em;
}
.ans-brand-text span{
  display:block;
  margin-top:3px;
  font-size:9px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ans-muted);
  white-space:nowrap;
}

/* Custom logo (header branch) */
.custom-logo-link{
  display:block;
  flex-shrink:0;
  line-height:0;
}
.custom-logo-link img{
  max-height:52px;
  width:auto;
}

/* Hamburger */
.ans-nav-toggle{
  display:block;
  flex-shrink:0;
  padding:9px 10px;
  background:none;
  border:1px solid var(--ans-line);
  border-radius:var(--ans-radius-sm);
  cursor:pointer;
}
.ans-nav-toggle span{
  display:block;
  width:22px;
  height:2px;
  background:var(--ans-navy);
  margin:4px 0;
  transition:transform .25s var(--ans-ease),opacity .2s;
}
.ans-nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.ans-nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.ans-nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Nav (mobile drawer) */
.ans-nav{
  display:none;
  position:absolute;
  left:0;
  right:0;
  top:100%;
  background:#fff;
  border-bottom:1px solid var(--ans-line);
  box-shadow:var(--ans-shadow);
  padding:12px 20px 18px;
  max-height:calc(100dvh - 70px);
  overflow-y:auto;
}
.ans-nav.is-open{display:block}
.ans-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ans-nav a{
  display:block;
  padding:13px 2px;
  border-bottom:1px solid var(--ans-line-2);
  font-size:14px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--ans-navy);
}
.ans-nav a:hover,
.ans-nav .current-menu-item > a,
.ans-nav .current_page_item > a{color:var(--ans-gold)}
.ans-nav .sub-menu{
  display:flex;
  position:static;
  padding-left:14px;
  border:0;
  box-shadow:none;
  background:none;
  margin:0;
}
.ans-nav .sub-menu a{
  text-transform:none;
  font-size:14px;
  font-weight:500;
  letter-spacing:0;
}

/* Header CTA */
.ans-header-cta{
  display:none;
  align-items:center;
  gap:8px;
  padding:12px 20px;
  background:var(--ans-gold);
  color:var(--ans-navy);
  font-size:13px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  border-radius:var(--ans-radius-sm);
  white-space:nowrap;
  transition:background .2s,color .2s;
}
.ans-header-cta:hover{background:var(--ans-navy);color:var(--ans-gold-2)}

/* ==========================================================================
   8. BUTTONS
   ========================================================================== */

.ans-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  width:100%;
  padding:15px 28px;
  border:2px solid transparent;
  border-radius:var(--ans-radius-sm);
  font-family:var(--ans-sans);
  font-size:13.5px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-align:center;
  cursor:pointer;
  transition:background .22s var(--ans-ease),color .22s var(--ans-ease),border-color .22s var(--ans-ease),transform .15s;
}
.ans-btn:active{transform:translateY(1px)}

.ans-btn-gold{background:var(--ans-gold);border-color:var(--ans-gold);color:var(--ans-navy)}
.ans-btn-gold:hover{background:transparent;border-color:var(--ans-gold);color:var(--ans-gold)}

.ans-btn-navy{background:var(--ans-navy);border-color:var(--ans-navy);color:#fff}
.ans-btn-navy:hover{background:transparent;border-color:var(--ans-navy);color:var(--ans-navy)}

.ans-btn-ghost{background:transparent;border-color:rgba(255,255,255,.5);color:#fff}
.ans-btn-ghost:hover{background:#fff;border-color:#fff;color:var(--ans-navy)}

/* ==========================================================================
   9. HERO
   ========================================================================== */

.ans-hero{
  position:relative;
  overflow:hidden;
  background:var(--ans-navy);
  color:#e9eff5;
}
.ans-hero-media{position:absolute;inset:0}
.ans-hero-media img{
  width:100%;height:100%;
  object-fit:cover;
  opacity:.52;
}
.ans-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(105deg,rgba(9,22,37,.95) 6%,rgba(9,22,37,.74) 52%,rgba(9,22,37,.32) 100%);
}
.ans-hero-inner{
  position:relative;
  z-index:2;
  max-width:740px;
  padding:clamp(56px,14vw,130px) 0;
}
.ans-hero h1{color:#fff;margin-bottom:.35em}
.ans-hero h1 em{font-style:italic;color:var(--ans-gold-2)}
.ans-hero p{
  max-width:600px;
  font-size:clamp(15.5px,2.4vw,19px);
  color:#cfdae5;
}
.ans-hero-actions{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:28px;
}

/* Eyebrow */
.ans-eyebrow{
  display:inline-block;
  margin-bottom:16px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--ans-gold-2);
}
.ans-eyebrow::before{
  content:"";
  display:inline-block;
  width:30px;
  height:1px;
  margin-right:11px;
  vertical-align:middle;
  background:var(--ans-gold);
}

/* ==========================================================================
   10. PAGE HEAD + BREADCRUMBS
   ========================================================================== */

.ans-page-head{
  position:relative;
  overflow:hidden;
  background:var(--ans-navy);
  color:#cddae6;
}
.ans-page-head::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--ans-photo);
  background-size:cover;
  background-position:center;
  opacity:.34;
}
.ans-page-head::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(95deg,rgba(9,22,37,.94),rgba(9,22,37,.48));
}
.ans-page-head .ans-wrap{
  position:relative;
  z-index:2;
  padding:clamp(46px,10vw,86px) 20px;
}
.ans-page-head h1{color:#fff;margin-bottom:.25em;max-width:820px}
.ans-page-head p{max-width:640px;margin:0;color:#bccbd8}

.ans-crumbs{
  margin-bottom:14px;
  font-size:11.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#8ea0b1;
}
.ans-crumbs a{color:var(--ans-gold-2)}
.ans-crumbs a:hover{color:#fff}

/* ==========================================================================
   11. SECTIONS
   ========================================================================== */

.ans-section{padding:clamp(46px,9vw,92px) 0}
.ans-section--alt{
  background:var(--ans-bg);
  border-top:1px solid var(--ans-line);
  border-bottom:1px solid var(--ans-line);
}
.ans-section--navy{background:var(--ans-navy)}

.ans-section-head{max-width:700px;margin-bottom:38px}
.ans-section-head.ans-center{margin-inline:auto;text-align:center}
.ans-section-head p{margin-bottom:0}
.ans-section-head h2{margin-bottom:.45em}

/* ==========================================================================
   12. GRIDS + CARDS
   ========================================================================== */

.ans-grid{display:grid;gap:22px}
.ans-grid-2,
.ans-grid-3,
.ans-grid-4{grid-template-columns:1fr}

.ans-card{
  display:flex;
  flex-direction:column;
  height:100%;
  overflow:hidden;
  background:#fff;
  border:1px solid var(--ans-line);
  border-radius:var(--ans-radius);
  transition:transform .3s var(--ans-ease),box-shadow .3s var(--ans-ease),border-color .3s;
}
.ans-card:hover{
  transform:translateY(-4px);
  border-color:#c6d0da;
  box-shadow:var(--ans-shadow);
}
.ans-card-img{
  display:block;
  aspect-ratio:16/11;
  overflow:hidden;
  background:var(--ans-navy-3);
}
.ans-card-img img{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .55s var(--ans-ease);
}
.ans-card:hover .ans-card-img img{transform:scale(1.05)}
.ans-card-body{
  display:flex;
  flex-direction:column;
  flex:1;
  padding:22px;
}
.ans-card-body h3{margin-bottom:.4em;font-size:1.25rem}
.ans-card-body p{font-size:15px}
.ans-card-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:auto;
  padding-top:14px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--ans-navy);
}
.ans-card-link::after{content:"\2192";transition:transform .2s var(--ans-ease)}
.ans-card-link:hover{color:var(--ans-gold)}
.ans-card-link:hover::after{transform:translateX(4px)}

/* ==========================================================================
   13. STATS
   ========================================================================== */

.ans-stats{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:26px 16px;
  text-align:center;
}
.ans-stat strong{
  display:block;
  font-family:var(--ans-serif);
  font-size:clamp(1.9rem,7vw,2.9rem);
  font-weight:600;
  line-height:1;
  color:var(--ans-gold-2);
}
.ans-stat span{
  display:block;
  margin-top:8px;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#9fb0c0;
}

/* ==========================================================================
   14. SPLIT LAYOUT
   ========================================================================== */

.ans-split{
  display:grid;
  grid-template-columns:1fr;
  gap:30px;
  align-items:center;
}
.ans-split-media img{
  width:100%;
  border-radius:var(--ans-radius);
  box-shadow:var(--ans-shadow);
}

/* ==========================================================================
   15. CONTENT BLOCKS
   ========================================================================== */

.ans-list-check{list-style:none;margin:0 0 24px;padding:0}
.ans-list-check li{
  position:relative;
  margin-bottom:11px;
  padding-left:30px;
}
.ans-list-check li::before{
  content:"";
  position:absolute;
  left:0;
  top:.45em;
  width:17px;
  height:17px;
  border:1.5px solid var(--ans-gold);
  border-radius:50%;
  background:radial-gradient(circle,var(--ans-gold) 0 3.5px,transparent 3.5px);
}

.ans-panel{
  margin-bottom:22px;
  padding:22px 24px;
  background:#fff;
  border:1px solid var(--ans-line);
  border-left:4px solid var(--ans-gold);
  border-radius:var(--ans-radius);
}
.ans-panel h3{margin-top:0;font-size:1.2rem}
.ans-panel > :last-child{margin-bottom:0}

.ans-table{
  width:100%;
  margin-bottom:24px;
  border-collapse:collapse;
  font-size:14.5px;
}
.ans-table th,
.ans-table td{
  padding:11px 13px;
  border:1px solid var(--ans-line);
  text-align:left;
  vertical-align:top;
}
.ans-table th{
  background:var(--ans-navy);
  color:#fff;
  font-family:var(--ans-sans);
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.ans-table tbody tr:nth-child(even){background:var(--ans-bg)}

/* ==========================================================================
   16. FORMS
   ========================================================================== */

.ans-form{
  padding:22px;
  background:#fff;
  border:1px solid var(--ans-line);
  border-radius:var(--ans-radius);
}
.ans-form-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}
.ans-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.ans-field label{
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ans-navy);
}
.ans-field input,
.ans-field select,
.ans-field textarea{
  width:100%;
  padding:13px 14px;
  background:#fcfdfe;
  border:1px solid #c8d1da;
  border-radius:var(--ans-radius-sm);
  color:var(--ans-ink);
  font-family:var(--ans-sans);
  font-size:16px;
  line-height:1.4;
  -webkit-appearance:none;
  appearance:none;
  transition:border-color .2s,box-shadow .2s;
}
.ans-field select{
  background-image:linear-gradient(45deg,transparent 50%,var(--ans-navy) 50%),
                   linear-gradient(135deg,var(--ans-navy) 50%,transparent 50%);
  background-position:calc(100% - 19px) 50%,calc(100% - 14px) 50%;
  background-size:5px 5px,5px 5px;
  background-repeat:no-repeat;
  padding-right:38px;
}
.ans-field textarea{min-height:130px;resize:vertical}
.ans-field input:focus,
.ans-field select:focus,
.ans-field textarea:focus{
  outline:none;
  border-color:var(--ans-gold);
  box-shadow:0 0 0 3px rgba(201,162,39,.22);
}
.ans-field input::placeholder,
.ans-field textarea::placeholder{color:#9aa6b2}

.ans-hp{
  position:absolute !important;
  left:-9999px !important;
  width:1px;
  height:1px;
  overflow:hidden;
}

.ans-notice{
  margin-bottom:20px;
  padding:14px 17px;
  border-radius:var(--ans-radius-sm);
  font-size:14.5px;
}
.ans-notice--ok{background:var(--ans-ok-bg);border-left:4px solid var(--ans-ok);color:#1d5c38}
.ans-notice--err{background:var(--ans-err-bg);border-left:4px solid var(--ans-err);color:#8c1d18}

/* ==========================================================================
   17. TRACKING
   ========================================================================== */

.ans-track-wrap{max-width:760px;margin:0 auto}
.ans-track-wrap .ans-form{margin-bottom:28px}
.ans-track-wrap h2{margin-top:1.7em}
.ans-track-wrap h2:first-of-type{margin-top:0}

.ans-track-wrap .ans-form form,
.ans-track-wrap form{margin:0}
.ans-track-wrap input[type="text"],
.ans-track-wrap input[type="search"],
.ans-track-wrap input[type="email"],
.ans-track-wrap input[type="tel"],
.ans-track-wrap input[type="number"],
.ans-track-wrap select,
.ans-track-wrap textarea{
  width:100%;
  max-width:100%;
  padding:13px 14px;
  background:#fcfdfe;
  border:1px solid #c8d1da;
  border-radius:var(--ans-radius-sm);
  color:var(--ans-ink);
  font-family:var(--ans-sans);
  font-size:16px;
  line-height:1.4;
}
.ans-track-wrap input:focus,
.ans-track-wrap select:focus,
.ans-track-wrap textarea:focus{
  outline:none;
  border-color:var(--ans-gold);
  box-shadow:0 0 0 3px rgba(201,162,39,.22);
}
.ans-track-wrap label{
  display:block;
  margin-bottom:6px;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ans-navy);
}
.ans-track-wrap button,
.ans-track-wrap input[type="submit"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:14px 28px;
  background:var(--ans-navy);
  border:2px solid var(--ans-navy);
  border-radius:var(--ans-radius-sm);
  color:#fff;
  font-family:var(--ans-sans);
  font-size:13px;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .2s,color .2s;
}
.ans-track-wrap button:hover,
.ans-track-wrap input[type="submit"]:hover{background:var(--ans-gold);border-color:var(--ans-gold);color:var(--ans-navy)}

/* ==========================================================================
   18. CTA BAND
   ========================================================================== */

.ans-cta{
  position:relative;
  overflow:hidden;
  background:var(--ans-navy-2);
  color:#d9e4ee;
}
.ans-cta::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--ans-photo);
  background-size:cover;
  background-position:center;
  opacity:.2;
}
.ans-cta .ans-wrap{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:22px;
  padding:clamp(42px,9vw,76px) 20px;
}
.ans-cta h2{color:#fff;margin:0 0 8px}
.ans-cta p{margin:0;color:#b7c7d5}

/* ==========================================================================
   19. FOOTER
   ========================================================================== */

.ans-footer{
  background:var(--ans-navy);
  color:#93a5b6;
  font-size:15px;
}
.ans-footer a{color:#c2d1de}
.ans-footer a:hover{color:var(--ans-gold-2)}

.ans-footer-top{
  padding:52px 0 40px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.ans-footer-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:32px;
}
.ans-footer h4{
  margin-bottom:16px;
  color:#fff;
  font-family:var(--ans-sans);
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.ans-footer ul{list-style:none;margin:0;padding:0}
.ans-footer li{margin-bottom:9px}
.ans-footer .ans-brand-text strong{color:#fff}
.ans-footer .ans-brand-text span{color:#7f92a4}
.ans-footer .ans-brand-mark{border-color:var(--ans-gold)}
.ans-footer p{margin-top:16px;font-size:14.5px}
.ans-footer address{font-style:normal}

.ans-socials{display:flex;gap:9px;margin-top:18px}
.ans-socials a{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:var(--ans-radius-sm);
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.04em;
}
.ans-socials a:hover{background:var(--ans-gold);border-color:var(--ans-gold);color:var(--ans-navy)}

.ans-footer-bottom{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:8px 22px;
  padding:18px 0;
  font-size:12.5px;
  color:#7c8e9f;
}

/* ==========================================================================
   20. ENTRY CONTENT
   ========================================================================== */

.ans-content h2{margin-top:1.7em}
.ans-content h2:first-child,
.ans-content h3:first-child{margin-top:0}
.ans-content img{border-radius:var(--ans-radius);margin:24px 0}
.ans-content figcaption{font-size:12.5px;color:var(--ans-muted);text-align:center}
.ans-content > .ans-wrap > :last-child{margin-bottom:0}

/* ==========================================================================
   21. PAGINATION
   ========================================================================== */

.pagination,
.navigation.pagination{margin-top:36px}
.nav-links{display:flex;flex-wrap:wrap;gap:8px}
.page-numbers{
  display:grid;
  place-items:center;
  min-width:42px;
  height:42px;
  padding:0 12px;
  border:1px solid var(--ans-line);
  border-radius:var(--ans-radius-sm);
  font-size:14px;
  font-weight:600;
  color:var(--ans-navy);
}
.page-numbers:hover{border-color:var(--ans-gold);color:var(--ans-gold)}
.page-numbers.current{background:var(--ans-navy);border-color:var(--ans-navy);color:#fff}
.page-numbers.dots{border:0}

/* ==========================================================================
   22. COMMENTS
   ========================================================================== */

.comment-list{list-style:none;padding:0;margin:0 0 36px}
.comment-list ol{list-style:none;padding-left:18px}
.comment-body{margin-bottom:22px;padding:18px 20px;background:var(--ans-bg);border-radius:var(--ans-radius)}
.comment-meta{margin-bottom:8px;font-size:13px;color:var(--ans-muted)}
.comment-author{font-weight:700;color:var(--ans-navy)}
.comment-form p{margin-bottom:16px}
.comment-form label{display:block;margin-bottom:6px;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ans-navy)}
.comment-form input:not([type="submit"]),
.comment-form textarea{width:100%;padding:12px 14px;border:1px solid #c8d1da;border-radius:var(--ans-radius-sm);font-family:var(--ans-sans);font-size:16px}
.comment-form .submit{padding:14px 26px;background:var(--ans-navy);border:0;border-radius:var(--ans-radius-sm);color:#fff;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:13px;cursor:pointer}

/* ==========================================================================
   23. 404 + SEARCH
   ========================================================================== */

.ans-404{padding:clamp(56px,14vw,130px) 20px;text-align:center}
.ans-404 h1{
  margin:0 0 .1em;
  font-size:clamp(3.6rem,18vw,9rem);
  line-height:1;
  color:var(--ans-gold);
}
.ans-404 h2{margin-bottom:.5em}
.ans-404 .ans-form{max-width:460px;margin:26px auto 0}

/* ==========================================================================
   24. DETAILS / SUMMARY (FAQ)
   ========================================================================== */

details.ans-panel > summary::-webkit-details-marker{display:none}
details.ans-panel > summary::marker{content:""}
details.ans-panel[open] > summary span[aria-hidden]{transform:rotate(45deg)}
details.ans-panel > summary span[aria-hidden]{transition:transform .2s var(--ans-ease)}
details.ans-panel > summary:focus-visible{outline:2px solid var(--ans-gold);outline-offset:-2px}

/* ==========================================================================
   25. WORDPRESS CORE ALIGNMENT
   ========================================================================== */

.alignleft{float:left;margin:.4em 1.4em 1em 0}
.alignright{float:right;margin:.4em 0 1em 1.4em}
.aligncenter{display:block;margin-inline:auto}
.alignwide{margin-inline:calc(50% - 50vw + 20px)}
.alignfull{margin-inline:calc(50% - 50vw);max-width:100vw}

.wp-caption{max-width:100%}
.wp-caption-text{font-size:12.5px;color:var(--ans-muted);text-align:center}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.sticky .ans-card{border-color:var(--ans-gold)}

/* ==========================================================================
   26. TABLET
   ========================================================================== */

@media (min-width:600px){
  .ans-btn{width:auto}
  .ans-hero-actions{flex-direction:row}
  .ans-topbar .ans-hide-sm{display:inline}
  .ans-topbar .ans-wrap{gap:6px 20px}
  .ans-header .ans-wrap{min-height:76px}
  .ans-brand img,.ans-brand .custom-logo{max-height:58px}
  .custom-logo-link img{max-height:58px}
  .ans-brand-mark{width:48px;height:48px;font-size:19px}
  .ans-brand-text strong{font-size:17px}
  .ans-brand-text span{font-size:9.5px;letter-spacing:.18em}

  .ans-grid-2,
  .ans-grid-3,
  .ans-grid-4{grid-template-columns:repeat(2,1fr)}
  .ans-stats{grid-template-columns:repeat(4,1fr)}
  .ans-split{grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,56px)}
  .ans-form{padding:28px}
  .ans-form-grid{grid-template-columns:1fr 1fr}
  .ans-field--full{grid-column:1 / -1}
  .ans-cta .ans-wrap{flex-direction:row;align-items:center;justify-content:space-between}
  .ans-footer-grid{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-template-columns:repeat(3,1fr)}
  .alignwide{margin-inline:calc(50% - 50vw + 40px)}
}

/* ==========================================================================
   27. DESKTOP
   ========================================================================== */

@media (min-width:1024px){
  .ans-nav-toggle{display:none}
  .ans-nav{
    display:block;
    position:static;
    flex:1;
    padding:0;
    border:0;
    box-shadow:none;
    background:none;
    max-height:none;
    overflow:visible;
  }
  .ans-nav ul{flex-direction:row;align-items:center;justify-content:center;gap:2px}
  .ans-nav a{
    padding:10px 11px;
    border-bottom:0;
    font-size:13px;
    letter-spacing:.05em;
  }
  .ans-nav .sub-menu{
    position:absolute;
    display:none;
    flex-direction:column;
    min-width:228px;
    margin-top:2px;
    padding:8px;
    background:#fff;
    border:1px solid var(--ans-line);
    box-shadow:var(--ans-shadow);
    padding-left:8px;
  }
  .ans-nav li{position:relative}
  .ans-nav li:hover > .sub-menu,
  .ans-nav li:focus-within > .sub-menu{display:flex}
  .ans-nav .sub-menu a{padding:10px 12px;font-size:13.5px;border-bottom:0}
  .ans-nav .sub-menu a:hover{background:var(--ans-bg);color:var(--ans-gold)}
  .ans-nav .menu-item-has-children > a::after{
    content:"";
    display:inline-block;
    width:5px;height:5px;
    margin-left:7px;
    border-right:1.5px solid currentColor;
    border-bottom:1.5px solid currentColor;
    transform:rotate(45deg);
    vertical-align:2px;
  }

  .ans-header-cta{display:inline-flex}
  .ans-header .ans-wrap{min-height:var(--ans-header-h);padding:14px 20px}

  .ans-grid-3{grid-template-columns:repeat(3,1fr)}
  .ans-grid-4{grid-template-columns:repeat(4,1fr)}
  .ans-footer-grid{grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:36px}
  .ans-footer-top{padding:60px 0 44px}
}

/* ==========================================================================
   28. LARGE
   ========================================================================== */

@media (min-width:1280px){
  .ans-hero-inner{padding:130px 0}
}

/* ==========================================================================
   29. REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,
  *::before,
  *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .ans-card:hover{transform:none}
  .ans-card:hover .ans-card-img img{transform:none}
}

/* ==========================================================================
   30. PRINT
   ========================================================================== */

@media print{
  .ans-topbar,
  .ans-header,
  .ans-cta,
  .ans-footer,
  .ans-hero-media,
  .ans-skip,
  .ans-nav-toggle{display:none !important}

  body{font-size:11pt;color:#000;background:#fff}
  .ans-hero,
  .ans-page-head{background:none !important;color:#000}
  .ans-hero h1,
  .ans-page-head h1{color:#000}
  .ans-hero::after,
  .ans-page-head::after,
  .ans-page-head::before{display:none}
  .ans-hero-inner,
  .ans-page-head .ans-wrap{padding:12pt 0}
  a{color:#000;text-decoration:underline}
  .ans-card,
  .ans-panel,
  .ans-form{break-inside:avoid;box-shadow:none}
  .ans-content{padding:12pt 0}
}