/* ==========================================================
   GLOBAL.CSS — Benigens Group
   Base reset, typography, utilities, buttons
   ========================================================== */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

/* Kill Astra's default header */
#masthead,
.ast-primary-header-bar,
.ast-desktop-header,
.ast-mobile-header,
.astra-hfb-header { display: none !important; }

/* Kill Astra default list styles in nav / footer */
.ben-nav ul,
.ben-nav li,
.ben-footer ul,
.ben-footer li,
.ben-f-links,
.ben-f-links li {
    list-style: none !important;
    padding-left: 0 !important;
    margin-bottom: 0 !important;
}

body,
body.ast-header-break-point,
body.astra-hfb-header { padding-top: 0 !important; }

body {
    font-family:    var(--font-body);
    font-size:      1rem;
    line-height:    1.7;
    color:          var(--color-text);
    background:     var(--bone);
    -webkit-font-smoothing: antialiased;
}

img, video { max-width: 100%; height: auto; display: block; }
a { color: var(--color-text); text-decoration: none; transition: color var(--transition-fast); }

/* ── Shared type classes ── */
.ben-eyebrow {
    font-family:    var(--font-body);
    font-size:      11px;
    font-weight:    300;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color:          var(--gold);
}
.ben-eyebrow--gold { color: var(--gold); }

.ben-display-h {
    font-family: var(--font-display);
    font-weight: 400;
    line-height: 1.08;
    color:       var(--ink);
}
.ben-display-h em { font-style: italic; font-weight: 400; }

.ben-body-text {
    font-family:    var(--font-body);
    font-weight:    300;
    color:          var(--muted);
    line-height:    1.85;
    font-size:      15px;
    letter-spacing: 0.01em;
}

.ben-gold-line {
    width:      36px;
    height:     1px;
    background: var(--gold);
}

/* ── Animations ── */
@keyframes fadeUp {
    0%   { opacity: 0; transform: translateY(24px); }
    100% { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
    0%   { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes pulse {
    0%   { box-shadow: 0 0 0 0 rgba(184,151,90,0.55); }
    70%  { box-shadow: 0 0 0 10px rgba(184,151,90,0); }
    100% { box-shadow: 0 0 0 0 rgba(184,151,90,0); }
}

.animate-fade-up { animation: fadeUp 0.9s ease forwards; }
.animate-fade-in { animation: fadeIn 1.1s ease forwards; }

.animate-delay-1 { animation-delay: 0.1s;  opacity: 0; }
.animate-delay-2 { animation-delay: 0.25s; opacity: 0; }
.animate-delay-3 { animation-delay: 0.4s;  opacity: 0; }
.animate-delay-4 { animation-delay: 0.55s; opacity: 0; }
.animate-delay-5 { animation-delay: 0.7s;  opacity: 0; }

/* ── Primary CTA button ── */
.btn-primary {
    position:       relative;
    overflow:       hidden;
    display:        inline-flex;
    align-items:    center;
    gap:            12px;
    background:     var(--gold);
    color:          #fff;
    font-family:    var(--font-body);
    font-weight:    400;
    font-size:      11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    padding:        17px 32px;
    border:         1px solid var(--gold);
    text-decoration:none;
    transition:     color 0.35s ease;
    cursor:         pointer;
}
.btn-primary::before {
    content:   '';
    position:  absolute;
    inset:     0;
    background:var(--ink);
    transform: translateX(-101%);
    transition:transform 0.35s ease;
    z-index:   0;
}
.btn-primary:hover::before { transform: translateX(0); }
.btn-primary > *            { position: relative; z-index: 1; }
.btn-primary:hover          { color: #fff; }

/* ── Secondary CTA button ── */
.btn-secondary {
    position:       relative;
    overflow:       hidden;
    display:        inline-flex;
    align-items:    center;
    gap:            12px;
    background:     transparent;
    color:          var(--ink);
    font-family:    var(--font-body);
    font-weight:    400;
    font-size:      11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    padding:        16px 32px;
    border:         1px solid var(--ink);
    text-decoration:none;
    transition:     color 0.35s ease;
    cursor:         pointer;
}
.btn-secondary::before {
    content:   '';
    position:  absolute;
    inset:     0;
    background:var(--ink);
    transform: translateX(-101%);
    transition:transform 0.35s ease;
    z-index:   0;
}
.btn-secondary:hover::before { transform: translateX(0); }
.btn-secondary:hover         { color: #fff; }
.btn-secondary > *           { position: relative; z-index: 1; }

/* Secondary on dark backgrounds */
.btn-secondary--light {
    border-color: rgba(255,255,255,0.3);
    color:        rgba(255,255,255,0.85);
}
.btn-secondary--light::before { background: rgba(255,255,255,0.1); }
.btn-secondary--light:hover   { color: #fff; }

/* ── Container ── */
.ben-container {
    width:         100%;
    max-width:     var(--container-max);
    margin-inline: auto;
    padding-inline:clamp(1rem, 4vw, 2rem);
}

/* ── Inner page hero ── */
.ben-page-hero {
    background:    var(--charcoal);
    padding:       110px 80px 90px;
    text-align:    center;
    position:      relative;
    overflow:      hidden;
}
.ben-page-hero::before {
    content:   '';
    position:  absolute;
    top:       -80px;
    left:      50%;
    transform: translateX(-50%);
    width:     700px;
    height:    700px;
    border-radius: 50%;
    border:    0.5px solid rgba(184,151,90,0.1);
    pointer-events: none;
}
.ben-page-hero .ben-eyebrow {
    margin-bottom: 18px;
}
.ben-page-hero-title {
    font-family: var(--font-display);
    font-size:   clamp(2.5rem, 6vw, 4rem);
    font-weight: 400;
    color:       #fff;
    line-height: 1.06;
    margin-bottom: 20px;
}
.ben-page-hero-title em {
    font-style: italic;
    color:      var(--gold);
}
.ben-page-hero-sub {
    font-family: var(--font-body);
    font-size:   16px;
    font-weight: 300;
    color:       rgba(255,255,255,0.55);
    max-width:   560px;
    margin:      0 auto;
    line-height: 1.8;
}

/* ── Inner page section ── */
.ben-inner-section {
    padding: 100px 0;
    background: var(--bone);
}

/* ── Screen reader ── */
.screen-reader-text {
    position:   absolute;
    width:      1px;
    height:     1px;
    overflow:   hidden;
    clip:       rect(0,0,0,0);
    white-space:nowrap;
    border:     0;
}

/* ── About page ── */
.ben-about-grid {
    display:     grid;
    grid-template-columns: 1fr 1fr;
    gap:         80px;
    align-items: start;
}
.ben-value-item {
    display:         flex;
    gap:             18px;
    align-items:     flex-start;
    padding:         24px 0;
    border-bottom:   0.5px solid rgba(26,26,26,0.1);
}
.ben-value-item:last-child { border-bottom: none; }
.ben-value-icon {
    width:          40px;
    height:         40px;
    flex-shrink:    0;
    display:        flex;
    align-items:    center;
    justify-content:center;
    border:         0.5px solid var(--gold);
    border-radius:  50%;
    color:          var(--gold);
}
.ben-value-title {
    font-family:    var(--font-body);
    font-size:      13px;
    font-weight:    500;
    color:          var(--ink);
    letter-spacing: 0.04em;
    margin-bottom:  6px;
}
.ben-value-body {
    font-family: var(--font-body);
    font-size:   13px;
    font-weight: 300;
    color:       var(--muted);
    line-height: 1.7;
    margin:      0;
}

/* ── Services detail page ── */
.ben-service-detail {
    display:       grid;
    grid-template-columns: 280px 1fr;
    gap:           64px;
    align-items:   start;
    padding:       64px 0;
    border-bottom: 0.5px solid rgba(26,26,26,0.1);
}
.ben-service-detail:last-child { border-bottom: none; }
.ben-sd-head {
    display:        flex;
    flex-direction: column;
    gap:            16px;
}
.ben-sd-title {
    font-family: var(--font-display);
    font-size:   36px;
    font-weight: 400;
    color:       var(--ink);
    line-height: 1.1;
}
.ben-sd-title em { font-style: italic; }

/* ── Work page ── */
.ben-work-stats {
    background: var(--charcoal);
    padding:    44px 80px;
    display:    grid;
    grid-template-columns: repeat(4, 1fr);
    border-top:    0.5px solid rgba(184,151,90,0.15);
    border-bottom: 0.5px solid rgba(184,151,90,0.15);
}
.ben-work-stat {
    padding:        28px 24px;
    border-right:   0.5px solid rgba(255,255,255,0.08);
    text-align:     center;
}
.ben-work-stat:last-child { border-right: none; }
.ben-work-stat-num {
    font-family:  var(--font-display);
    font-size:    44px;
    font-weight:  400;
    color:        #fff;
    line-height:  1;
    margin-bottom:8px;
}
.ben-work-stat-lbl {
    font-family:    var(--font-body);
    font-size:      11px;
    font-weight:    300;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color:          rgba(255,255,255,0.4);
    margin:         0;
}
.ben-work-grid {
    display:               grid;
    grid-template-columns: repeat(3, 1fr);
    gap:                   0;
    border-top:            0.5px solid rgba(26,26,26,0.1);
    border-bottom:         0.5px solid rgba(26,26,26,0.1);
    margin-bottom:         64px;
}
.ben-work-card {
    display:          flex;
    flex-direction:   column;
    text-decoration:  none;
    border-right:     0.5px solid rgba(26,26,26,0.1);
    position:         relative;
    overflow:         hidden;
    transition:       background 0.35s ease;
}
.ben-work-card:last-child         { border-right: none; }
.ben-work-card:hover              { background: rgba(255,255,255,0.4); }
.ben-work-card-img {
    height:     220px;
    width:      100%;
    flex-shrink:0;
    opacity:    0.85;
    transition: opacity 0.35s ease;
}
.ben-work-card:hover .ben-work-card-img { opacity: 1; }
.ben-work-card-body {
    padding: 28px 28px 20px;
    flex:    1;
}
.ben-work-tag {
    font-family:    var(--font-body);
    font-size:      10px;
    font-weight:    300;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color:          var(--gold);
    display:        block;
    margin-bottom:  10px;
}
.ben-work-brand {
    font-family: var(--font-display);
    font-size:   24px;
    font-weight: 400;
    color:       var(--ink);
    margin-bottom:8px;
}
.ben-work-result {
    font-family: var(--font-body);
    font-size:   13px;
    font-weight: 300;
    color:       var(--muted);
    margin:      0;
}
.ben-work-arrow {
    padding:    0 28px 28px;
    color:      var(--ink);
    transition: transform 0.3s ease, color 0.3s ease;
}
.ben-work-card:hover .ben-work-arrow {
    transform: translate(4px,-4px);
    color:     var(--gold);
}
.ben-work-cta {
    text-align: center;
    display:    flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
}

/* ── Contact page ── */
.ben-contact-grid {
    display:     grid;
    grid-template-columns: 1fr 1fr;
    gap:         80px;
    align-items: start;
}
.ben-contact-perk {
    display:     flex;
    gap:         18px;
    align-items: flex-start;
    padding:     24px 0;
    border-bottom: 0.5px solid rgba(26,26,26,0.1);
}
.ben-contact-perk:last-of-type { border-bottom: none; }
.ben-contact-perk-icon {
    width:           40px;
    height:          40px;
    flex-shrink:     0;
    display:         flex;
    align-items:     center;
    justify-content: center;
    border:          0.5px solid rgba(184,151,90,0.4);
    border-radius:   50%;
}
.ben-contact-perk-title {
    font-family:    var(--font-body);
    font-size:      13px;
    font-weight:    500;
    color:          var(--ink);
    letter-spacing: 0.04em;
    margin-bottom:  4px;
}
.ben-contact-perk-body {
    font-family: var(--font-body);
    font-size:   13px;
    font-weight: 300;
    color:       var(--muted);
    line-height: 1.7;
    margin:      0;
}
.ben-contact-scarcity {
    display:         flex;
    align-items:     center;
    gap:             10px;
    margin-top:      36px;
    font-family:     var(--font-body);
    font-size:       11px;
    font-weight:     400;
    letter-spacing:  0.16em;
    color:           var(--ink);
    padding:         10px 18px;
    border:          0.5px solid rgba(184,151,90,0.4);
    background:      rgba(184,151,90,0.06);
    display:         inline-flex;
}
.ben-form-group {
    margin-bottom: 20px;
}
.ben-form-group label {
    display:        block;
    font-family:    var(--font-body);
    font-size:      11px;
    font-weight:    400;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color:          var(--ink);
    margin-bottom:  8px;
}
.ben-form-group input,
.ben-form-group select,
.ben-form-group textarea {
    width:       100%;
    padding:     14px 16px;
    border:      1px solid rgba(26,26,26,0.18);
    background:  transparent;
    font-family: var(--font-body);
    font-size:   14px;
    font-weight: 300;
    color:       var(--ink);
    transition:  border-color var(--transition-fast);
    outline:     none;
    appearance:  none;
}
.ben-form-group input:focus,
.ben-form-group select:focus,
.ben-form-group textarea:focus {
    border-color: var(--gold);
    box-shadow:   0 0 0 3px rgba(184,151,90,0.12);
}
.ben-form-group textarea { resize: vertical; min-height: 140px; }
.ben-form-row { display: grid; gap: 20px; }
.ben-form-row--half { grid-template-columns: 1fr 1fr; }
.ben-form-success {
    text-align:      center;
    padding:         60px 40px;
    border:          0.5px solid rgba(184,151,90,0.3);
    display:         flex;
    flex-direction:  column;
    align-items:     center;
    gap:             16px;
}
.ben-form-success h3 {
    font-family: var(--font-display);
    font-size:   28px;
    font-weight: 400;
    color:       var(--ink);
}
.ben-form-success p {
    font-family: var(--font-body);
    font-size:   14px;
    font-weight: 300;
    color:       var(--muted);
    margin:      0;
}

/* ── Pulse dot ── */
.ben-pulse-dot {
    width:         7px;
    height:        7px;
    border-radius: 50%;
    background:    var(--gold);
    box-shadow:    0 0 0 0 rgba(184,151,90,0.6);
    animation:     pulse 2s infinite;
    flex-shrink:   0;
}

/* ── Stars row ── */
.ben-stars-row {
    display:     flex;
    align-items: center;
    gap:         2px;
}
.ben-stars-center { justify-content: center; }
.ben-rating-num {
    font-family:  var(--font-body);
    font-weight:  500;
    font-size:    13px;
    color:        var(--ink);
    margin-left:  8px;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
    .ben-page-hero { padding: 80px 32px 60px; }
    .ben-inner-section { padding: 72px 0; }
    .ben-about-grid,
    .ben-contact-grid { grid-template-columns: 1fr; gap: 48px; }
    .ben-service-detail { grid-template-columns: 1fr; gap: 32px; }
    .ben-work-stats { padding: 32px 24px; grid-template-columns: repeat(2,1fr); }
    .ben-work-grid { grid-template-columns: 1fr; }
    .ben-work-card { border-right: none; border-bottom: 0.5px solid rgba(26,26,26,0.1); }
}
@media (max-width: 600px) {
    .ben-form-row--half { grid-template-columns: 1fr; }
    .ben-work-stats { grid-template-columns: repeat(2,1fr); }
    .ben-work-stat:nth-child(2) { border-right: none; }
    .ben-work-stat:nth-child(1),
    .ben-work-stat:nth-child(2) { border-bottom: 0.5px solid rgba(255,255,255,0.08); }
}
