/* Sharp Barbers – public site styles */
:root {
    --black: #000;
    --white: #fff;
    --border: #ddd;
    --content-width: 1200px;
    --font: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
    margin: 0;
    font-family: var(--font);
    font-size: 16px;
    line-height: 28px;
    letter-spacing: .02em;
    color: var(--black);
    background: var(--white);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { font-weight: 600; line-height: 1.2; letter-spacing: 0; margin: 0 0 1.5rem; }
h1 { font-size: 2.027rem; }
h2 { font-size: 1.802rem; }
h3 { font-size: 1.602rem; }
h4 { font-size: 1.424rem; }
@media (max-width: 1024px) {
    h1 { font-size: 20px; }
    h2, h3, h4 { font-size: 18px; }
}
p { margin: 0 0 1.5rem; }
p:last-child { margin-bottom: 0; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
button { font: inherit; letter-spacing: inherit; }

.container { max-width: var(--content-width); margin: 0 auto; padding: 0 1.5rem; }
.section { padding: 4rem 0; }
.section--dark { background: var(--black); color: var(--white); }
.section-title { text-align: center; }
.sep { height: 3rem; }
.sep--sm { height: 1.5rem; }
@media (max-width: 1024px) {
    .section { padding: 2.5rem 0; }
    .sep { height: calc(1rem + 2.5vw); }
    .sep--sm { height: 1rem; }
}
@media (max-width: 600px) {
    .section { padding: 1.5rem 0; }
}

.icon { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.iconlink { display: inline-flex; align-items: center; gap: .5em; }
.iconlink .icon { font-size: 1em; }

/* Button (white pill, uppercase) */
.btn {
    display: inline-flex; align-items: center; gap: .5em;
    font-size: 16px; line-height: 1.2; font-weight: 500; text-transform: uppercase; letter-spacing: 0;
    padding: 1em 2em; border-radius: .3em; border: 1px solid var(--white);
    background: var(--white); color: var(--black); cursor: pointer;
    transition: background .2s, color .2s, border-color .2s;
}
.btn:hover, .btn:focus-visible { background: var(--black); color: var(--white); border-color: var(--white); }
.btn--dark { background: var(--black); color: var(--white); border-color: var(--black); }
.btn--dark:hover, .btn--dark:focus-visible { background: var(--white); color: var(--black); border-color: var(--black); }
.btn--sm { font-size: 14px; padding: .75em 1.5em; }

/* Top navigation (overlays the hero, turns solid on scroll) */
.topnav { position: sticky; top: 0; z-index: 100; height: 64px; margin-bottom: -64px; color: var(--white); background: rgba(0, 0, 0, .92); transition: background .25s; }
.topnav.is-top { background: linear-gradient(rgba(0, 0, 0, .45), rgba(0, 0, 0, 0)); }
.topnav__inner { display: flex; align-items: center; gap: 24px; height: 64px; }
.topnav__brand { font-weight: 700; text-transform: uppercase; letter-spacing: .08em; font-size: 15px; white-space: nowrap; }
.topnav__links { display: flex; gap: 22px; margin-left: auto; font-size: 14px; font-weight: 500; }
.topnav__links a { opacity: .9; transition: opacity .2s; }
.topnav__links a:hover { opacity: 1; text-decoration: underline; text-underline-offset: 4px; }
.topnav__cta { margin-left: auto; }
.topnav__links + .topnav__cta { margin-left: 0; }
@media (max-width: 900px) {
    .topnav__links { display: none; }
}
@media (max-width: 480px) {
    .topnav__brand { font-size: 13px; }
    .topnav__cta { padding: .6em 1em; font-size: 13px; }
}

/* Hero */
.hero {
    position: relative; overflow: hidden; color: var(--white); background: var(--black);
    padding: 4rem 0;
}
.has-nav .hero { padding-top: calc(4rem + 64px); }
.hero__trust { font-size: 15px; font-weight: 500; letter-spacing: .02em; margin: -.25rem 0 1rem; }
.hero picture { display: contents; }
.hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.hero__overlay { position: absolute; inset: 0; background: #000; pointer-events: none; }
.hero__kicker { font-size: 1.802rem; font-weight: 600; line-height: 1.2; margin: 0 0 1.75rem; }
.hero__inner { position: relative; min-height: 480px; display: flex; align-items: center; justify-content: center; text-align: center; }
.hero__text { position: relative; z-index: 0; max-width: 100%; padding: 1.5rem 2rem; }
/* Soft dark scrim that fades out around the text, so faces in the photo stay visible */
.hero__text::before {
    content: ""; position: absolute; z-index: -1; inset: -35% -30%; pointer-events: none;
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, .62) 0%, rgba(0, 0, 0, .45) 35%, rgba(0, 0, 0, .18) 58%, rgba(0, 0, 0, 0) 72%);
}
.hero__kicker, .hero h1, .hero__trust { text-shadow: 0 2px 14px rgba(0, 0, 0, .7), 0 1px 3px rgba(0, 0, 0, .6); }
/* Text at the bottom of the photo with a gradient (admin: "Teksto padėtis") */
.hero--text-bottom .hero__inner { align-items: flex-end; padding-bottom: .5rem; }
.hero--text-bottom .hero__text::before { display: none; }
.hero__gradient { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .55) 35%, rgba(0, 0, 0, .12) 65%, rgba(0, 0, 0, 0) 100%); }
.hero h1 { color: var(--white); margin-bottom: 1.25rem; }
@media (max-width: 1024px) { .hero__kicker { font-size: 18px; } }
.hero .btn { margin-top: 20px; }
@media (max-width: 1024px) {
    .hero { padding: 2.5rem 0; }
    .hero__inner { min-height: 420px; }
}
@media (max-width: 600px) {
    .hero { padding: 1.5rem 0; }
    .hero__inner { min-height: 360px; }
}

/* Barbers */
.barbers { display: flex; flex-wrap: wrap; justify-content: center; gap: 3rem; }
.barber { display: flex; flex-direction: column; align-items: center; text-align: center; flex: 0 1 calc((100% - 6rem) / 3); min-width: 0; }
.barber__photo { width: 100%; aspect-ratio: 2 / 3; border-radius: 8px; overflow: hidden; background: #111; }
.barber__photo picture { display: contents; }
.barber__photo img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.barber__name { font-size: 1.424rem; margin: 1.25rem 0 .75rem; }
.barber__bio { font-size: 15px; line-height: 1.6; margin: .75rem 0 0; max-width: 34ch; }
.barber__book { margin-top: 1rem; }
@media (max-width: 1024px) { .barber__name { font-size: 18px; } }
@media (max-width: 1024px) { .barbers { gap: 2rem; } .barber { flex-basis: calc((100% - 4rem) / 3); } }
@media (max-width: 767px) {
    .barbers { gap: 2rem; }
    .barber { flex-basis: 100%; }
    .barber__photo { max-width: 420px; }
}

/* Prices */
.prices { max-width: 720px; margin: 0 auto; padding: 0 1.5rem; }
.price__name { display: block; }
.price__meta { display: block; font-size: 13px; line-height: 1.5; opacity: .7; margin-top: 2px; }
.price__duration { white-space: nowrap; }
.prices__cta { text-align: center; margin: 2rem 0 0; }
table { border-collapse: collapse; border-spacing: 0; width: 100%; }
th, td { text-align: left; vertical-align: top; padding: .6rem 1rem; border-bottom: 1px solid var(--border); }
th { font-weight: 700; }
td:last-child, th:last-child { white-space: nowrap; }
@media (max-width: 600px) {
    .prices { padding: 0; }
    th, td { padding: .6rem .5rem; }
}

/* About */
.about { display: grid; grid-template-columns: 3fr 2fr; gap: 3rem; align-items: start; }
.about__en { margin-top: 1.5rem; padding: 1rem 1.25rem; border-left: 3px solid var(--black); background: #f6f6f6; font-size: 15px; line-height: 1.6; }
.about__en-label { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin: 0 0 .5rem; opacity: .7; }
.about__facts { margin: 0; display: grid; gap: 0; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.about__fact { padding: .9rem 1.25rem; }
.about__fact + .about__fact { border-top: 1px solid var(--border); }
.about__fact dt { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; opacity: .7; }
.about__fact dd { margin: 2px 0 0; font-weight: 500; line-height: 1.5; }
@media (max-width: 900px) { .about { grid-template-columns: 1fr; gap: 2rem; } }

/* Gallery + lightbox */
.gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.gallery__item { display: block; aspect-ratio: 1; border-radius: 8px; overflow: hidden; background: #111; }
.gallery__item picture { display: contents; }
.gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.gallery__item:hover img { transform: scale(1.04); }
@media (max-width: 767px) { .gallery { grid-template-columns: repeat(2, 1fr); gap: .75rem; } }
.lightbox { position: fixed; inset: 0; z-index: 10000; background: rgba(0, 0, 0, .94); display: flex; align-items: center; justify-content: center; }
.lightbox[hidden] { display: none; }
.lightbox__figure { margin: 0; max-width: min(92vw, 1400px); max-height: 92vh; display: flex; flex-direction: column; align-items: center; gap: .75rem; }
.lightbox__img { max-width: 92vw; max-height: 84vh; object-fit: contain; border-radius: 6px; }
.lightbox__caption { color: #d8d8d8; font-size: 14px; text-align: center; min-height: 1em; }
.lightbox__btn { position: absolute; background: rgba(255, 255, 255, .12); color: #fff; border: 0; border-radius: 50%; width: 48px; height: 48px; font-size: 32px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.lightbox__btn:hover { background: rgba(255, 255, 255, .28); }
.lightbox__close { top: 16px; right: 16px; }
.lightbox__prev { left: 16px; top: 50%; transform: translateY(-50%); }
.lightbox__next { right: 16px; top: 50%; transform: translateY(-50%); }
@media (max-width: 600px) { .lightbox__btn { width: 40px; height: 40px; font-size: 26px; } .lightbox__prev { left: 6px; } .lightbox__next { right: 6px; } }

/* Embeds */
.embed { position: relative; width: 100%; background: #111; }
.embed iframe { display: block; width: 100%; height: 450px; border: 0; }
.embed--map iframe { height: 440px; }
@media (max-width: 767px) {
    .embed iframe { height: 320px; }
}

/* FAQ accordion */
.faq__heading { text-align: center; margin-bottom: 1.5rem; }
.faq__h { margin: 0; font-size: inherit; font-weight: inherit; line-height: inherit; }
.faq__q {
    display: flex; align-items: center; width: 100%; text-align: left;
    padding: 1em 1.5em; line-height: 1.5; background: transparent; border: 0; border-radius: 0;
    color: inherit; cursor: pointer; transition: background .2s;
}
.faq__q:hover, .faq__q:focus-visible { background: rgba(0, 0, 0, .04); outline: none; }
.faq__title { font-weight: 600; margin-right: .6em; }
.faq__icon { margin-left: auto; display: inline-flex; transition: transform .3s; }
.faq__icon .icon { stroke-width: 2.2; }
.faq__q[aria-expanded="true"] .faq__icon { transform: rotate(180deg); }
.faq__a-inner { padding: 1.5rem; }
@media (max-width: 600px) {
    .faq__q { padding: 1em .75em; }
    .faq__a-inner { padding: 1rem .75em; }
}

/* Contacts */
.contacts { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; }
.contacts__info { font-style: normal; }
.contacts__line { margin: 0; }
.contacts__info h3 { font-size: 1.424rem; color: var(--white); }
.contacts__note { font-size: 14px; opacity: .8; }
@media (max-width: 1024px) { .contacts__info h3 { font-size: 18px; } }
.contacts__map { min-width: 0; }
@media (max-width: 767px) {
    .contacts { grid-template-columns: 1fr; gap: 2rem; }
}

/* Footer */
.footer { background: var(--black); color: #d8d8d8; font-size: 14px; padding: 1.5rem 0; text-align: center; border-top: 1px solid #2e2e2e; }

/* Cookie notice */
.cookie {
    position: fixed; left: 24px; bottom: 24px; z-index: 9999; width: 440px; max-width: calc(100vw - 48px);
    background: var(--white); color: #212121; border-radius: 6px; padding: 20px 26px;
    box-shadow: 0 -1px 10px rgba(172, 171, 171, .3), 0 5px 15px rgba(0, 0, 0, .15);
    font-size: 14px; line-height: 24px;
}
.cookie__text { margin: 0 0 14px; }
.cookie__text a { text-decoration: underline; }
.cookie .btn { font-size: 14px; padding: .75em 1.6em; }
@media (max-width: 600px) {
    .cookie { left: 12px; right: 12px; bottom: 12px; width: auto; max-width: none; padding: 16px 18px; }
}

/* Skip link for keyboard users */
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }