/* Amalance site theme (layout language ported from the Willed site).
   Loaded after custom.css on the main pages. The eyebrow badges
   (.hero-eyebrow, .hero-eyebrow-light, .ztna-eyebrow, .edge-eyebrow,
   .index-section-eyebrow) are intentionally left as they are. */
:root {
    --am-navy: #0f1b3d;
    --am-darker: #0a1329;
    --am-blue: #006fff;
    --am-blue-hover: #3d8fff;
    --am-ink: #172033;
    --am-mute: #5d687c;
    --am-line: #e3e7ef;
    --am-bg: #f5f7fb;

    /* Flatten the shared surface system from custom.css */
    --site-surface-bg: #fff;
    --site-surface-border: var(--am-line);
    --site-surface-shadow: none;
    --site-surface-shadow-soft: none;
    --site-surface-shadow-hover: 0 18px 40px rgba(16, 29, 62, .1);
    --site-surface-radius: 0;
    --site-surface-radius-sm: 0;
}

html { scroll-behavior: smooth; }
body, h1, h2, h3, h4, h5, h6, p, li, th, td, a, input, textarea, button, label {
    font-family: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, "Poppins", sans-serif;
}
body { color: var(--am-ink); }
.site-page, .index-page { background: #fff; }

/* ---------- Top bar ---------- */
#header.am-topbar { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; height: auto; }
#header.am-topbar .header-inner,
.site-page #header.am-topbar .header-inner {
    height: 72px; background: transparent; box-shadow: none;
    backdrop-filter: none; -webkit-backdrop-filter: none;
    transition: background .3s, box-shadow .3s;
}
#header.am-topbar.is-solid .header-inner {
    background: rgba(255, 255, 255, .96); box-shadow: 0 1px 0 var(--am-line);
}
#header.am-topbar .header-inner > .container { display: flex; align-items: center; height: 72px; padding: 0 32px; }
#header.am-topbar #logo { height: auto; float: none; margin-right: auto; }
#header.am-topbar #logo a > img { height: 30px; margin-top: 0; }
#header.am-topbar .am-nav { display: flex; align-items: center; }
#header.am-topbar .am-nav a {
    margin-left: 28px; font-size: 13px; font-weight: 500; letter-spacing: .08em;
    color: #fff; text-decoration: none; transition: color .3s;
}
#header.am-topbar.is-solid .am-nav a { color: var(--am-ink); }
#header.am-topbar .am-nav a:hover, #header.am-topbar .am-nav a[aria-current="page"] { color: var(--am-blue-hover); }
#header.am-topbar.is-solid .am-nav a:hover, #header.am-topbar.is-solid .am-nav a[aria-current="page"] { color: var(--am-blue); }
/* Existing language dropdown: keep it, only align it with the bar */
#header.am-topbar .header-extras { float: none; height: auto; margin-left: 28px; }
@media (max-width: 991px) {
    #header.am-topbar .header-inner > .container { padding: 0 16px; }
    #header.am-topbar .am-nav { display: none; }
    #header.am-topbar #logo a > img { height: 26px; }
    /* the template centers the logo absolutely on small screens */
    #header.am-topbar #logo { position: static !important; width: auto; height: auto; text-align: left; margin: 0 auto 0 0 !important; padding: 0 !important; }
}

/* ---------- Page hero (every #page-title, with or without .site-hero) ---------- */
/* The template pulls a page title up under a transparent header; the fixed bar makes that unnecessary */
#header.am-topbar + #page-title { top: 0; margin-bottom: 0; padding: 72px 0 0; }
#page-title.text-light, .site-hero {
    position: relative; overflow: hidden; display: flex; align-items: center;
    min-height: clamp(460px, 62vh, 640px); padding: 72px 0 0;
}
#page-title.text-light .bg-overlay, .site-hero .bg-overlay {
    position: absolute; inset: 0; z-index: 1; opacity: 1;
    background: linear-gradient(90deg, rgba(10, 19, 41, .9) 0%, rgba(10, 19, 41, .72) 50%, rgba(10, 19, 41, .35) 100%);
}
#page-title.text-light > .container, .site-hero > .container { position: relative; z-index: 2; width: 100%; max-width: none; padding-left: 6vw; padding-right: 6vw; }
#page-title.text-light h1, .site-hero h1 {
    color: #fff; font-size: clamp(30px, 4.4vw, 58px); line-height: 1.25; font-weight: 700;
    letter-spacing: .02em; text-shadow: none;
}
#page-title.text-light h1::after, .site-hero h1::after { content: ""; display: block; width: 44px; height: 3px; background: var(--am-blue); margin-top: 26px; }
#page-title.text-light p, #page-title.text-light .lead { color: rgba(255, 255, 255, .85); line-height: 2; }
.site-hero-actions .btn { border-radius: 0; }
@media (max-width: 767px) {
    #page-title.text-light, .site-hero { min-height: 420px; }
    #page-title.text-light .bg-overlay, .site-hero .bg-overlay { background: linear-gradient(180deg, rgba(10, 19, 41, .88) 0%, rgba(10, 19, 41, .7) 100%); }
}

/* ---------- Sections & headings ---------- */
.site-section, .site-values-section { padding: 110px 0; }
.site-section.background-grey, .site-values-section, .unifi-page #section2 { background: var(--am-bg); }
/* Section headings: the template's "heading-line" gets the Willed title bar */
.heading-text.heading-line h2, .heading-text.heading-line h3, .heading-text.heading-line h4 {
    font-size: clamp(24px, 3vw, 34px); font-weight: 700; letter-spacing: .01em; color: var(--am-ink);
    margin-bottom: 40px;
}
.heading-text.heading-line h2::before, .heading-text.heading-line h3::before, .heading-text.heading-line h4::before {
    width: 44px; height: 3px; bottom: -20px; background-color: var(--am-blue);
}
.heading-text.text-light h2, .heading-text.text-light h3, .heading-text.text-light h4 { color: #fff; }
.lead, .site-lead { color: var(--am-mute); line-height: 2; }
@media (max-width: 767px) { .site-section, .site-values-section { padding: 80px 0; } }

/* ---------- Cards: flat, bordered, lift on hover ---------- */
.site-panel, .site-card, .site-table-card, .site-value-card, .about-info-card, .about-team-card,
.site-policy-card, .site-numbered-item, .site-profile-card, .about-contact-card, .unifi-cost-card,
.site-spec-matrix-card, .site-content-table-card, .icon-box.fancy, .card {
    border-radius: 0 !important;
    box-shadow: none;
    border-color: var(--am-line);
}
.site-value-card, .about-team-card, .site-card.site-hover-lift, .site-hover-lift {
    transition: transform .3s, box-shadow .3s;
}
.site-value-card:hover, .about-team-card:hover, .site-hover-lift:hover {
    transform: translateY(-6px); box-shadow: 0 18px 40px rgba(16, 29, 62, .1);
}
.site-value-icon { border-radius: 0; background: transparent; border: 0; width: auto; height: auto; justify-content: flex-start; }
.site-numbered-item span { color: var(--am-blue); }
.site-media-frame, .site-media-frame img { border-radius: 0 !important; }

/* ---------- Tables ---------- */
.site-profile-card { border-top: 2px solid var(--am-navy) !important; }
.site-profile-title { color: var(--am-navy); }
.site-profile-table tbody td:first-child { color: var(--am-navy); }
.site-content-table, .site-spec-matrix-table { border-top: 2px solid var(--am-navy); }
.site-content-table thead th, .site-spec-matrix-table thead th { background: var(--am-bg); color: var(--am-navy); }
.site-content-table-card, .site-spec-matrix-card { border-radius: 0; }

/* ---------- Buttons ---------- */
.btn { border-radius: 0 !important; letter-spacing: .08em; font-weight: 600; }
.btn:not(.btn-light):not(.btn-white):not(.btn-dark):not(.btn-outline):not(.btn-link):not(.btn-reveal) { background: var(--am-blue); border-color: var(--am-blue); color: #fff; }
.btn:not(.btn-light):not(.btn-white):not(.btn-dark):not(.btn-outline):not(.btn-link):not(.btn-reveal):hover { background: var(--am-blue-hover); border-color: var(--am-blue-hover); color: #fff; }

/* ---------- Forms ---------- */
.form-control { border-radius: 0; }

/* ---------- Footer ---------- */
#footer, #footer.inverted { background: var(--am-darker) !important; color: rgba(255, 255, 255, .7); }
#footer .footer-content { padding: 72px 0 40px; background: transparent; }
#footer .widget-title { color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
#footer a:not(.btn):not(:hover), #footer .widget a:not(.btn):not(:hover), #footer .list li a:not(:hover) { color: rgba(255, 255, 255, .78); }
#footer a:hover { color: #fff; }
#footer p { color: rgba(255, 255, 255, .6); }
#footer .copyright-content, #footer .copyright-content.bg-light {
    background: transparent !important; border-top: 1px solid rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .45); font-size: 12px; padding: 20px 0; min-height: 0;
}
#footer .copyright-text { color: rgba(255, 255, 255, .45); }

/* Anchor jumps must not hide the target under the fixed bar */
section[id] { scroll-margin-top: 72px; }

/* ---------- Top page ---------- */
.am-hero { position: relative; min-height: 100vh; display: flex; align-items: center; overflow: hidden; background: var(--am-navy) url(../images/logos/index.jpg) center / cover no-repeat; color: #fff; padding: 120px 0 90px; }
.am-hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.am-hero::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(10, 19, 41, .9) 0%, rgba(10, 19, 41, .65) 55%, rgba(10, 19, 41, .35) 100%); }
.am-hero .container { position: relative; z-index: 2; max-width: none; padding-left: 6vw; padding-right: 6vw; }
.am-hero h1 { color: #fff; font-size: clamp(38px, 6vw, 84px); font-weight: 700; line-height: 1.12; letter-spacing: .01em; margin: 0; }
.am-hero h1::after { content: ""; display: block; width: 44px; height: 3px; background: var(--am-blue); margin-top: 28px; }
.am-hero-actions { margin-top: 34px; }
.am-hero-actions .btn { padding: 14px 40px; }
.am-hero-points { margin-top: 12vh; max-width: 1100px; }
.am-hero-points h4 { color: #fff; font-size: 15px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .3); }
.am-hero-points p { color: rgba(255, 255, 255, .78); font-size: 14px; line-height: 2; }
.am-scroll { position: absolute; left: 50%; bottom: 28px; z-index: 2; width: 1px; height: 56px; background: rgba(255, 255, 255, .5); }
@media (max-width: 991px) { .am-hero { min-height: 560px; } .am-scroll { display: none; } }

.index-page .index-feature-section { background: #fff; padding: 110px 0; }
@media (max-width: 767px) { .index-page .index-feature-section { padding: 80px 0; } }
.index-page #section2.index-feature-section.index-feature-section-alt { background: var(--am-bg); }
.index-feature-section .heading-section h2 { font-size: clamp(26px, 3.4vw, 40px); font-weight: 700; color: var(--am-ink); }
.index-feature-section .heading-section h2::after { content: ""; display: block; width: 44px; height: 3px; background: var(--am-blue); margin-top: 22px; }
.index-feature-section .heading-section h2::before { display: none; }
.index-feature-section .lead { display: block; max-width: 760px; margin-top: 26px; }
/* Feature bullets: flat rows with a check, like the Willed recruit list */
.index-feature-section .list-group-item {
    position: relative; padding: 16px 0 16px 32px; background: transparent;
    border: 0; border-bottom: 1px solid var(--am-line); line-height: 1.8; color: var(--am-ink);
}
.index-feature-section .list-group-flush { border-top: 2px solid var(--am-navy); }
.index-feature-section .list-group-item::before {
    content: "\f00c"; font-family: "Font Awesome 5 Free"; font-weight: 900; position: absolute; left: 4px; top: 16px;
    color: var(--am-blue); font-size: 13px;
}
.index-feature-section .btn.btn-light.btn-reveal { background: var(--am-navy); border-color: var(--am-navy); color: #fff; padding: 14px 30px; }
.index-feature-section .btn.btn-light.btn-reveal:hover { background: var(--am-blue); border-color: var(--am-blue); color: #fff; }

/* Pages that start with a regular section (e.g. wiffy): keep it clear of the fixed bar */
#header.am-topbar + section { top: 0; margin-bottom: 0; }
#header.am-topbar + section:not(#page-title):not(.am-hero) { padding-top: 150px !important; }