@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500;1,600&family=DM+Sans:wght@400;500;600&family=Noto+Sans+Armenian:wght@400;500;600&family=Noto+Serif+Armenian:wght@500;600&display=swap');

:root {
    --ink:#2c241d;
    --muted:#76695f;
    --cream:#fbf6ee;
    --paper:#fffdf8;
    --gold:#9a6a2f;
    --gold-dark:#6e471e;
    --gold-soft:#d9b783;
    --copper:#b56f49;
    --line:#e5d7c5;
    --line-dark:#d4c1a8;
    --shadow:0 22px 60px rgba(90,58,27,.12);
    --soft-shadow:0 12px 34px rgba(91,65,38,.10);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
    margin:0;
    color:var(--ink);
    background:
        radial-gradient(circle at 84% 7%, rgba(210,175,125,.14), transparent 31rem),
        linear-gradient(180deg,#fffaf4 0,#fbf6ee 52%,#f7efe4 100%);
    font-family:'DM Sans','Noto Sans Armenian',sans-serif;
    line-height:1.55;
}
html[lang="hy"] body { font-family:'Noto Sans Armenian','DM Sans',sans-serif; }
a { color:inherit; text-decoration:none; }
button, input, select, textarea { font:inherit; }
img { max-width:100%; display:block; }
.section-shell { width:min(1240px, calc(100% - 56px)); margin:0 auto; }

.site-header {
    position:sticky;
    top:0;
    z-index:50;
    min-height:88px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    width:min(1320px, calc(100% - 48px));
    margin:auto;
    padding:9px 0;
    background:rgba(255,250,244,.88);
    backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(167,126,77,.10);
}
.brand { display:flex; align-items:center; gap:12px; min-width:220px; }
.brand-logo { width:66px; height:66px; border-radius:50%; object-fit:cover; box-shadow:0 8px 22px rgba(123,83,38,.13); }
.brand-copy { display:flex; flex-direction:column; line-height:1; }
.brand-copy strong { font:600 1.55rem/1 'Cormorant Garamond',serif; color:var(--gold-dark); }
.brand-copy small { margin-top:5px; font:italic 1rem/1 'Cormorant Garamond',serif; color:var(--copper); }
html[lang="hy"] .brand-copy strong, html[lang="hy"] .brand-copy small { font-family:'Noto Serif Armenian',serif; }

nav { display:flex; align-items:center; justify-content:flex-end; gap:24px; color:#685c52; font-size:.82rem; white-space:nowrap; }
nav a { position:relative; padding:8px 0; }
nav a:after { content:''; position:absolute; left:0; right:100%; bottom:1px; height:1px; background:var(--gold); transition:right .22s ease; }
nav a:hover:after { right:0; }
nav a:hover, .text-button:hover { color:var(--gold-dark); }
.nav-divider { width:1px; height:20px; background:var(--line-dark); }
.text-button { color:#685c52; border:0; background:none; cursor:pointer; padding:0; }
.language-toggle { display:inline-flex; align-items:center; gap:6px; }
.language-flag { display:inline-block; width:18px; height:12px; border-radius:2px; box-shadow:0 0 0 1px rgba(37,35,32,.13); flex:none; }
.flag-armenia { background:linear-gradient(to bottom,#d90012 0 33.33%,#0033a0 33.33% 66.66%,#f2a800 66.66% 100%); }
.flag-us { background:repeating-linear-gradient(to bottom,#b22234 0 1px,#fff 1px 2px); position:relative; }
.flag-us::before { content:''; position:absolute; top:0; left:0; width:8px; height:6px; background:#3c3b6e; border-radius:2px 0 0 0; }
.admin-button { border:1px solid rgba(139,91,36,.18); color:#fff; background:linear-gradient(135deg,#7a4e20,#b6813f); border-radius:999px; padding:11px 18px; cursor:pointer; box-shadow:0 8px 18px rgba(116,74,31,.14); }
.admin-button:hover { filter:brightness(1.05); transform:translateY(-1px); }

.hero {
    min-height:670px;
    display:grid;
    grid-template-columns:.82fr 1.18fr;
    gap:46px;
    align-items:center;
    padding:54px 0 74px;
}
.hero-copy { position:relative; z-index:3; }
.eyebrow { text-transform:uppercase; font-size:.69rem; letter-spacing:.22em; color:var(--copper); font-weight:600; margin:0 0 15px; }
.hero h1 {
    max-width:590px;
    margin:0;
    font:600 clamp(3.7rem,6vw,6.6rem)/.88 'Cormorant Garamond',serif;
    letter-spacing:-.055em;
    text-wrap:balance;
}
html[lang="hy"] .hero h1,
html[lang="hy"] .section-heading h2,
html[lang="hy"] .booking-intro h2,
html[lang="hy"] .story-copy h2,
html[lang="hy"] .team-card h3,
html[lang="hy"] .dialog-card h2 { font-family:'Noto Serif Armenian',serif; letter-spacing:-.035em; }
.hero-text { max-width:480px; color:var(--muted); font-size:1rem; margin:26px 0 28px; }
.hero-actions { display:flex; gap:13px; flex-wrap:wrap; }
.button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    min-height:48px;
    padding:0 22px;
    border:1px solid transparent;
    border-radius:7px;
    cursor:pointer;
    font-weight:600;
    font-size:.82rem;
    transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.button:hover { transform:translateY(-2px); }
.button-gold { color:white; background:linear-gradient(135deg,#70471f,#b48242); box-shadow:0 10px 24px rgba(112,71,31,.18), inset 0 1px rgba(255,255,255,.25); }
.button-outline { color:var(--ink); background:rgba(255,253,248,.55); border-color:var(--line-dark); }
.button-outline:hover { background:#fffaf2; box-shadow:0 8px 22px rgba(92,68,42,.08); }
.full-width { width:100%; }

.hero-benefits { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:34px; max-width:590px; }
.hero-benefits > div { min-width:0; display:flex; align-items:center; gap:8px; color:#77695d; font-size:.67rem; text-transform:uppercase; letter-spacing:.08em; padding-right:10px; border-right:1px solid var(--line); }
.hero-benefits > div:last-child { border-right:0; }
.benefit-icon { color:var(--gold); font:500 1.4rem/1 'Cormorant Garamond',serif; }

.hero-media { min-height:570px; position:relative; }
.hero-media:before { content:''; position:absolute; inset:12% 2% 5% 9%; border-radius:48% 48% 24px 24px; background:linear-gradient(145deg,rgba(230,207,174,.34),rgba(192,151,98,.08)); border:1px solid rgba(174,125,67,.18); }
.hero-model-card { position:absolute; left:1%; top:0; width:57%; height:96%; margin:0; overflow:hidden; border-radius:48% 48% 26px 26px; box-shadow:var(--shadow); z-index:2; border:5px solid rgba(255,253,248,.82); }
.hero-model-card img { width:100%; height:100%; object-fit:cover; object-position:50% 34%; }
.hero-storefront-card { position:absolute; right:0; top:11%; width:53%; height:71%; margin:0; overflow:hidden; border-radius:52% 16px 16px 52%; box-shadow:0 24px 56px rgba(69,46,25,.16); border:5px solid rgba(255,253,248,.84); z-index:3; }
.hero-storefront-card img { width:100%; height:100%; object-fit:cover; object-position:center; }
.hero-storefront-card:after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(45,31,20,.34)); pointer-events:none; }
.studio-note { position:absolute; right:22px; top:24px; z-index:2; text-align:right; color:#fff; text-shadow:0 2px 15px rgba(50,27,13,.38); }
.studio-note strong { display:block; font:italic 2rem/1 'Cormorant Garamond',serif; }
.studio-note span { display:block; margin-top:8px; font-size:.58rem; letter-spacing:.19em; text-transform:uppercase; line-height:1.6; }
.hero-logo-badge { position:absolute; right:-17px; bottom:2%; width:145px; height:145px; border-radius:50%; object-fit:cover; z-index:5; box-shadow:0 16px 34px rgba(107,70,31,.22); border:5px solid rgba(255,252,245,.8); }

.trust-strip { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,252,246,.65); }
.trust-strip-inner { padding:18px 0; display:grid; grid-template-columns:repeat(4,1fr); align-items:center; }
.trust-strip-inner > span { display:flex; align-items:center; justify-content:center; gap:11px; color:#71645a; font-size:.69rem; text-transform:uppercase; letter-spacing:.13em; border-right:1px solid var(--line); }
.trust-strip-inner > span:last-child { border-right:0; }
.trust-strip-inner b { color:var(--gold); font:500 1.25rem/1 'Cormorant Garamond',serif; }

.content-section { padding:105px 0 98px; }
.section-heading { display:flex; justify-content:space-between; gap:50px; align-items:end; margin-bottom:42px; }
.section-heading h2,
.booking-intro h2,
.dialog-card h2,
.story-copy h2 { font:600 clamp(2.7rem,4.2vw,4.7rem)/.92 'Cormorant Garamond',serif; letter-spacing:-.05em; margin:0; }
.section-heading h2 em,
.booking-intro h2 em { color:var(--copper); font-weight:500; }
.section-heading-copy { max-width:360px; }
.section-heading-copy p, .section-heading > p { color:var(--muted); margin:0; }
.text-link { display:inline-flex; gap:11px; margin-top:13px; color:var(--copper); font-size:.78rem; border-bottom:1px solid rgba(181,111,73,.4); padding-bottom:2px; }

.service-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:15px; }
.service-card { background:rgba(255,253,248,.92); min-height:330px; overflow:hidden; display:flex; flex-direction:column; border:1px solid #ebdfd1; border-radius:11px; box-shadow:0 10px 28px rgba(99,68,35,.07); transition:transform .22s ease, box-shadow .22s ease; }
.service-card:hover { transform:translateY(-5px); box-shadow:0 18px 38px rgba(92,61,30,.13); }
.service-image { aspect-ratio:1.62/1; overflow:hidden; background:#eadcca; }
.service-image img { width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.service-card:hover .service-image img { transform:scale(1.035); }
.service-body { padding:18px 18px 15px; display:flex; flex-direction:column; flex:1; }
.service-number { color:var(--copper); font:italic 1.2rem 'Cormorant Garamond',serif; }
.service-title-row { display:flex; align-items:start; justify-content:space-between; gap:12px; }
.service-card h3 { font:600 1.65rem/1 'Cormorant Garamond',serif; margin:4px 0 5px; }
.service-arrow { width:36px; height:36px; border:1px solid var(--line-dark); border-radius:50%; display:grid; place-items:center; color:var(--gold-dark); flex:none; margin-top:5px; }
.service-card p { color:var(--muted); font-size:.82rem; margin:0 0 18px; }
.service-meta { margin-top:auto; display:flex; justify-content:space-between; gap:15px; color:#776b60; font-size:.72rem; border-top:1px solid var(--line); padding-top:12px; }
.service-meta span:last-child { color:var(--copper); font-weight:500; }
.muted { color:var(--muted); font-size:.88rem; }

.studio-story { margin-bottom:96px; display:grid; grid-template-columns:1.05fr .95fr; min-height:410px; background:rgba(255,253,248,.72); border:1px solid #eadfD1; border-radius:18px; overflow:hidden; box-shadow:var(--soft-shadow); }
.story-image-wrap { position:relative; min-height:410px; overflow:hidden; }
.story-image-wrap > img:first-child { width:100%; height:100%; object-fit:cover; }
.story-image-wrap:after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent 62%,rgba(255,253,248,.25)); }
.story-logo { position:absolute; right:24px; bottom:22px; width:104px; height:104px; border-radius:50%; box-shadow:0 10px 22px rgba(69,44,19,.2); border:4px solid rgba(255,252,246,.8); z-index:2; }
.story-copy { padding:58px 55px; align-self:center; }
.story-copy h2 { font-size:3.55rem; }
.story-copy > p:not(.eyebrow) { color:var(--muted); max-width:520px; }
.story-points { display:grid; grid-template-columns:1fr 1fr; gap:14px 20px; margin-top:28px; color:#6f6257; font-size:.78rem; }
.story-points span { display:flex; gap:10px; align-items:center; }
.story-points b { font-weight:500; }

.team-section { position:relative; background:linear-gradient(145deg,#3b2d21,#241f1a); color:#f8efe4; padding:100px 0 105px; overflow:hidden; }
.team-section:before { content:''; position:absolute; width:440px; height:440px; border:1px solid rgba(215,181,132,.16); border-radius:50%; right:-140px; top:-180px; }
.light-heading > p { color:#c9bcaf; }
.light-heading .eyebrow { color:#d7ad84; }
.team-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.team-card { min-height:255px; padding:28px; display:flex; flex-direction:column; justify-content:end; position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.12); border-radius:13px; background:linear-gradient(135deg,#75583d,#4c392c); }
.team-card:nth-child(even) { background:linear-gradient(135deg,#9b704f,#654634); }
.team-card:before { content:''; width:180px; height:180px; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.11); border-radius:50% 50% 8px 50%; position:absolute; right:28px; top:28px; }
.team-initial { position:absolute; right:67px; top:48px; font:italic 7rem/1 'Cormorant Garamond',serif; color:rgba(255,255,255,.78); }
.team-card h3 { font:600 2rem 'Cormorant Garamond',serif; margin:0; position:relative; }
.team-card p { margin:4px 0 0; color:rgba(255,255,255,.72); position:relative; }
.team-services { margin-top:17px; font-size:.7rem; letter-spacing:.07em; text-transform:uppercase; color:rgba(255,255,255,.7); position:relative; }

.booking-section { padding:105px 0; }
.booking-card { background:rgba(255,253,248,.92); display:grid; grid-template-columns:.76fr 1.24fr; gap:62px; padding:46px; border:1px solid #eadfD1; border-radius:18px; box-shadow:var(--soft-shadow); }
.booking-intro > p:last-of-type { max-width:330px; color:var(--muted); }
.booking-visual { margin-top:35px; border-radius:14px; overflow:hidden; aspect-ratio:1.45/1; box-shadow:0 12px 28px rgba(74,46,23,.11); }
.booking-visual img { width:100%; height:100%; object-fit:cover; }
.booking-form { display:flex; flex-direction:column; gap:15px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
label { font-size:.73rem; color:var(--muted); display:flex; flex-direction:column; gap:7px; }
input, select, textarea { background:#fffaf3; color:var(--ink); border:1px solid #e5d7c5; padding:12px 12px; outline:none; border-radius:8px; }
input:focus, select:focus, textarea:focus { border-color:#b9874d; box-shadow:0 0 0 3px rgba(185,135,77,.10); }
textarea { resize:vertical; }
.password-field { display:flex; align-items:center; border:1px solid #e5d7c5; border-radius:8px; background:#fffaf3; }
.password-field:focus-within { border-color:#b9874d; box-shadow:0 0 0 3px rgba(185,135,77,.10); }
.password-field input { min-width:0; flex:1; border:0; box-shadow:none; background:transparent; }
.password-toggle { border:0; background:none; color:var(--muted); cursor:pointer; font-size:.72rem; padding:8px 12px; }
.password-toggle:hover { color:var(--ink); }
.password-label { font-size:.75rem; color:var(--muted); display:flex; flex-direction:column; gap:7px; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.optional { color:#aaa; }
.verification-row { display:flex; gap:14px; align-items:end; }
.verification-row button { white-space:nowrap; min-height:44px; padding:0 14px; }
.verification-row input { flex:1; }
.form-message { min-height:20px; color:var(--copper); font-size:.8rem; margin:0; }

.site-footer { background:#eadfD1; padding:22px 0; color:#75695d; font-size:.72rem; }
.site-footer .section-shell { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.footer-brand { display:flex; align-items:center; gap:8px; color:var(--gold-dark); }
.footer-brand img { width:35px; height:35px; border-radius:50%; }

/* Admin */
dialog { border:0; padding:0; background:transparent; max-width:min(760px,calc(100% - 30px)); width:100%; }
dialog::backdrop { background:rgba(34,25,18,.62); backdrop-filter:blur(6px); }
.dialog-card { background:var(--paper); padding:38px; position:relative; border-radius:16px; box-shadow:0 30px 80px rgba(31,19,10,.30); }
.dialog-close { position:absolute; right:17px; top:12px; border:0; background:none; font-size:1.8rem; cursor:pointer; color:var(--muted); }
.admin-form { display:flex; flex-direction:column; gap:16px; margin-top:25px; }
.admin-title { display:flex; align-items:start; justify-content:space-between; gap:20px; }
.admin-title h2 { font-size:2.7rem; }
.admin-tabs { display:flex; gap:20px; border-bottom:1px solid var(--line); margin:32px 0 20px; }
.tab { border:0; background:none; padding:0 0 12px; color:var(--muted); cursor:pointer; }
.tab.active { color:var(--gold-dark); border-bottom:2px solid var(--gold); }
.admin-content { overflow:auto; }
.admin-table { width:100%; border-collapse:collapse; font-size:.78rem; min-width:560px; }
.admin-table th, .admin-table td { text-align:left; padding:12px 5px; border-bottom:1px solid var(--line); }
.admin-table th { color:var(--muted); font-weight:500; }
.small-button { border:1px solid var(--line-dark); background:#fffaf3; padding:5px 9px; cursor:pointer; font-size:.72rem; border-radius:6px; }
.staff-form { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:22px; }
.staff-form button { grid-column:1/-1; justify-self:start; }

@media (max-width:1050px) {
    .site-header { width:min(100% - 30px,1320px); }
    nav { gap:16px; }
    nav a { display:none; }
    .hero { grid-template-columns:1fr 1fr; gap:25px; }
    .hero h1 { font-size:4.7rem; }
    .hero-benefits { grid-template-columns:1fr 1fr; }
    .hero-benefits > div:nth-child(2) { border-right:0; }
    .story-copy { padding:45px 35px; }
}

@media (max-width:820px) {
    .section-shell { width:min(100% - 30px,1240px); }
    .brand-copy { display:none; }
    .brand { min-width:auto; }
    .brand-logo { width:54px; height:54px; }
    .nav-divider { display:none; }
    .admin-button { padding:9px 12px; font-size:.72rem; }
    .hero { grid-template-columns:1fr; padding-top:36px; min-height:0; }
    .hero h1 { font-size:clamp(3.4rem,13vw,5.4rem); }
    .hero-media { min-height:520px; margin-top:15px; }
    .hero-model-card { width:62%; }
    .hero-storefront-card { width:56%; height:66%; top:16%; }
    .hero-logo-badge { width:118px; height:118px; }
    .trust-strip-inner { grid-template-columns:1fr 1fr; row-gap:15px; }
    .trust-strip-inner > span:nth-child(2) { border-right:0; }
    .content-section, .booking-section, .team-section { padding:76px 0; }
    .section-heading, .booking-card, .studio-story { display:block; }
    .section-heading-copy, .section-heading > p { margin-top:25px; max-width:560px; }
    .studio-story { margin-bottom:74px; }
    .story-image-wrap { min-height:360px; }
    .story-copy { padding:38px 28px 42px; }
    .story-copy h2 { font-size:3rem; }
    .booking-card { padding:30px 22px; }
    .booking-intro { margin-bottom:36px; }
    .booking-visual { max-width:460px; }
    .site-footer .section-shell { flex-direction:column; align-items:flex-start; }
}

@media (max-width:560px) {
    .site-header { min-height:72px; }
    nav { gap:11px; }
    .language-toggle .language-flag:last-child { display:none; }
    .language-toggle { font-size:.7rem; }
    .admin-button { padding:8px 10px; }
    .hero { padding-bottom:50px; }
    .hero-text { font-size:.94rem; }
    .hero-benefits { display:none; }
    .hero-media { min-height:420px; }
    .hero-model-card { width:70%; height:91%; }
    .hero-storefront-card { width:59%; height:62%; top:22%; }
    .studio-note { display:none; }
    .hero-logo-badge { width:94px; height:94px; right:-5px; }
    .trust-strip-inner { font-size:.58rem; }
    .trust-strip-inner > span { justify-content:flex-start; padding-left:8px; }
    .service-grid { grid-template-columns:1fr; }
    .story-points { grid-template-columns:1fr; }
    .form-row, .staff-form { grid-template-columns:1fr; }
    .staff-form button { grid-column:auto; }
    .verification-row { align-items:stretch; flex-direction:column; }
    .section-heading h2, .booking-intro h2 { font-size:3rem; }
}

/* Armenian section headings need more vertical space */
html[lang="hy"] .section-heading h2 {
    line-height: 1.12;
    letter-spacing: -0.02em;
}

/* Armenian hero refinements: keep long Armenian words inside the text column. */
html[lang="hy"] .hero {
    grid-template-columns: 1fr 1fr;
    gap: 34px;
}

html[lang="hy"] .hero h1 {
    max-width: 100%;
    font-size: clamp(3rem, 3.8vw, 3.9rem);
    line-height: 1.2;
    letter-spacing: -.025em;
    white-space: pre-line;
    text-wrap: initial;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}

/* Give the storefront caption its own quiet panel so it stays readable
   over both the sky and the light parts of the storefront photo. */
.studio-note {
    right: 16px;
    top: 18px;
    max-width: 185px;
    padding: 12px 14px;
    color: #59402b;
    background: rgba(255, 250, 242, .88);
    border: 1px solid rgba(159, 111, 58, .18);
    border-radius: 13px;
    box-shadow: 0 9px 24px rgba(62, 41, 23, .12);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    text-shadow: none;
}

.studio-note strong {
    color: #7a4e20;
    font-size: 1.75rem;
}

.studio-note > span {
    margin-top: 7px;
    color: #67594e;
    font-size: .56rem;
    letter-spacing: .15em;
    line-height: 1.55;
}

.studio-note > span > span {
    display: inline;
    margin: 0;
    color: inherit;
    font-size: inherit;
    letter-spacing: inherit;
    line-height: inherit;
}

@media (max-width: 1100px) {
    html[lang="hy"] .hero h1 {
        font-size: clamp(2.9rem, 5.1vw, 3.65rem);
    }
}

@media (max-width: 820px) {
    html[lang="hy"] .hero {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    html[lang="hy"] .hero h1 {
        max-width: 760px;
        font-size: clamp(3rem, 9vw, 4.4rem);
    }
}

@media (max-width: 560px) {
    html[lang="hy"] .hero h1 {
        font-size: clamp(2.55rem, 11.2vw, 3.5rem);
        line-height: 1.02;
    }
}