:root { --ink:#171716; --paper:#f5f2ec; --stone:#ded8cf; --line:rgba(23,23,22,.22); --muted:#6e6a65; --accent:#9c765c; --serif:Iowan Old Style, Baskerville, 'Times New Roman', serif; --sans:Inter, ui-sans-serif, system-ui, sans-serif; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); font-size:16px; line-height:1.55; }
a { color:inherit; }
a:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.salon-header { position:sticky; z-index:20; top:0; background:rgba(245,242,236,.94); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.salon-header__inner { width:min(1440px, calc(100% - 48px)); min-height:82px; margin:auto; display:grid; grid-template-columns:1fr auto 1fr; gap:28px; align-items:center; }
.salon-brand { text-decoration:none; display:flex; align-items:center; gap:10px; line-height:1.08; width:max-content; }
.salon-brand__mark { flex:0 0 38px; width:38px; height:38px; }
.salon-brand__wording { display:flex; flex-direction:column; }
.salon-brand__name { font-family:var(--serif); font-size:1.35rem; letter-spacing:.02em; }
.salon-brand__tagline { font-size:.69rem; text-transform:uppercase; letter-spacing:.13em; color:var(--muted); margin-top:5px; }
.salon-nav ul { display:flex; list-style:none; padding:0; margin:0; gap:23px; }
.salon-nav a { text-decoration:none; text-transform:uppercase; font-size:.68rem; letter-spacing:.1em; }
.salon-nav a:hover, .salon-nav .current-menu-item a { text-decoration:underline; text-underline-offset:5px; }
.salon-header__cta { justify-self:end; background:var(--ink); color:#fff; text-decoration:none; padding:12px 17px; font-size:.68rem; text-transform:uppercase; letter-spacing:.11em; }
.salon-header__cta:hover, .salon-header__cta:focus-visible { background:#3c3935; color:#fff; text-decoration:none; }
.salon-header__cta:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.salon-main { overflow:hidden; }
.salon-hero { min-height:max(720px,calc(100vh - 82px)); padding:0; color:var(--ink); background:linear-gradient(112deg, #ded8cf 0%, #ede8df 51%, #cbc2b5 100%); position:relative; overflow:hidden; }
.salon-hero > .wp-block-group__inner-container { min-height:max(720px,calc(100vh - 82px)); padding:clamp(58px,11vw,160px) max(24px,calc((100vw - 1360px)/2)); display:grid; align-content:center; position:relative; }
.salon-hero::after { content:'FOTOGRAFÍA PRINCIPAL — SUSTITUIR'; position:absolute; inset:24px; border:1px solid rgba(23,23,22,.32); display:grid; place-items:start end; align-content:start; padding:15px; font-size:.61rem; letter-spacing:.13em; color:rgba(23,23,22,.55); pointer-events:none; z-index:0; }
.salon-hero:has(.salon-hero__media)::after { content:none; }
.salon-hero .salon-hero__media { position:absolute; z-index:0; inset:0 0 0 52%; width:auto; height:auto; max-width:none; margin:0; overflow:hidden; }
.salon-hero__media::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(23,23,22,.24),rgba(23,23,22,0) 58%); }
.salon-hero__media img { width:100%; height:100%; object-fit:cover; object-position:center 42%; display:block; }
.salon-hero:has(.salon-hero__media) { color:#f8f6f1; background:#242321; }
.salon-hero:has(.salon-hero__media) .salon-eyebrow, .salon-hero:has(.salon-hero__media) h1, .salon-hero:has(.salon-hero__media) .salon-hero__lead { color:#f8f6f1 !important; }
.salon-hero:has(.salon-hero__media) .wp-block-button__link { background:#f8f6f1; color:var(--ink); }
.salon-hero > .wp-block-group__inner-container > :not(.salon-hero__media), .salon-hero > :not(.salon-hero__media):not(.wp-block-group__inner-container) { position:relative; z-index:1; max-width:48%; }
.salon-eyebrow, .salon-label { margin:0 0 18px; font-size:.7rem; text-transform:uppercase; letter-spacing:.15em; }
.salon-hero h1, .salon-statement { margin:0; font-family:var(--serif); font-weight:400; font-size:clamp(3rem,5.15vw,5.9rem); line-height:.94; letter-spacing:-.042em; }
.salon-hero__lead { max-width:600px; margin:28px 0 0; font-size:clamp(1rem,1.45vw,1.26rem); line-height:1.4; }
.salon-hero .wp-block-buttons { margin-top:38px; }
.wp-block-button__link, .salon-link { border-radius:0; padding:14px 19px; background:var(--ink); color:#fff; font-size:.69rem; letter-spacing:.1em; text-transform:uppercase; text-decoration:none; }
.wp-block-button__link:hover, .wp-block-button__link:focus-visible, .salon-link:hover, .salon-link:focus-visible { background:#3c3935; color:#fff; text-decoration:none; }
.wp-block-button__link:focus-visible, .salon-link:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.salon-section { width:min(1360px, calc(100% - 48px)); margin:0 auto; padding:clamp(52px,6.5vw,96px) 0; }
.salon-section--border { border-top:1px solid var(--line); }
.salon-section__intro { max-width:940px; font-family:var(--serif); font-size:clamp(2.1rem,4.6vw,4.65rem); line-height:1.02; letter-spacing:-.035em; margin:0; }
.salon-section__copy { max-width:570px; margin:42px 0 0 auto; font-size:1.06rem; }
.salon-about { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr); gap:clamp(46px,7vw,120px); align-items:stretch; }
.salon-about__copy { display:flex; min-height:100%; flex-direction:column; }
.salon-about .salon-section__intro { max-width:760px; }
.salon-about .salon-section__copy { margin-top:auto; padding-top:55px; margin-left:0; }
.salon-about__mosaic { display:grid; grid-template-columns:1.12fr .88fr; grid-template-rows:1fr 1.22fr; gap:12px; height:clamp(390px,38vw,510px); }
.salon-about-tile { grid-column:2; min-height:0; background:#d7d0c7; }
.salon-about-tile--primary { grid-column:1; grid-row:1 / span 2; background:#c9c0b5; }
.salon-about-tile:nth-child(3) { background:#e1dad0; }
.salon-about-tile { margin:0; overflow:hidden; }
.salon-about-tile img { width:100%; height:100%; display:block; object-fit:cover; }
.salon-about-tile--primary img { object-position:center; }
.salon-section__heading { font-family:var(--serif); font-weight:400; font-size:clamp(2.25rem,4vw,4.1rem); letter-spacing:-.04em; line-height:.98; margin:0 0 44px; }
.salon-services { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.salon-service { min-height:270px; padding:25px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); display:flex; flex-direction:column; justify-content:space-between; }
.salon-service h3 { margin:0; font-family:var(--serif); font-size:2.1rem; font-weight:400; line-height:1; }
.salon-service p { margin:35px 0 0; color:var(--muted); max-width:290px; }
.salon-placeholder-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:14px; }
.salon-placeholder { min-height:360px; background:#d5cec4; display:grid; place-items:center; padding:22px; text-align:center; color:#6f685f; font-size:.66rem; text-transform:uppercase; letter-spacing:.14em; }
.salon-placeholder:nth-child(1), .salon-placeholder:nth-child(4) { grid-column:span 7; }
.salon-placeholder:nth-child(2), .salon-placeholder:nth-child(3) { grid-column:span 5; }
.salon-results-home { display:grid; grid-template-columns:repeat(12,1fr); gap:14px; }
.salon-results-home figure { min-height:360px; margin:0; overflow:hidden; }
.salon-results-home figure:nth-child(1), .salon-results-home figure:nth-child(4) { grid-column:span 7; }
.salon-results-home figure:nth-child(2), .salon-results-home figure:nth-child(3) { grid-column:span 5; }
.salon-results-home img { width:100%; height:100%; display:block; object-fit:cover; }
.salon-results-home figure:nth-child(1) img { object-position:center 32%; }
.salon-about__mosaic .salon-about-tile { min-height:0; grid-column:2; }
.salon-about__mosaic .salon-about-tile--primary { grid-column:1; grid-row:1 / span 2; }
.salon-space { display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(34px,7vw,120px); align-items:center; }
.salon-space .salon-placeholder { min-height:530px; }
.salon-space__media { height:440px; display:grid; grid-template-columns:1.1fr .9fr; gap:12px; align-items:stretch; }
.salon-space__image { height:100%; min-height:0; margin:0; overflow:hidden; }
.salon-space__image img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; }
.salon-space__secondary { height:100%; margin:0; overflow:hidden; }
.salon-space__secondary img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; }
.salon-contact { background:var(--ink); color:#f8f6f1; }
.salon-contact .salon-section { display:grid; grid-template-columns:1.3fr .7fr; gap:40px; align-items:end; }
.salon-contact h2 { font-family:var(--serif); font-weight:400; font-size:clamp(3.1rem,6vw,6.6rem); line-height:.92; letter-spacing:-.05em; margin:0; color:#f8f6f1; }
.salon-contact p { color:#d7d0c5; }
.salon-contact .wp-block-button__link { background:#f8f6f1; color:var(--ink); }
.salon-page { width:min(1080px, calc(100% - 48px)); margin:0 auto; padding:clamp(80px,12vw,160px) 0; }
.salon-page__header { max-width:850px; margin-bottom:65px; }
.salon-page__header h1 { margin:0; font:400 clamp(3.2rem,7vw,7rem)/.9 var(--serif); letter-spacing:-.05em; }
.salon-page__content > * + * { margin-top:25px; }
.salon-page__content h2 { font:400 clamp(2rem,4vw,4rem)/.98 var(--serif); letter-spacing:-.04em; margin:80px 0 26px; }
.salon-page__content h3 { font:400 2rem/1 var(--serif); }
.salon-page__content .wp-block-columns { gap:28px; }
.salon-page__content .wp-block-group { padding:28px; border:1px solid var(--line); }
.salon-salon-image { margin:46px 0 0; overflow:hidden; }
.salon-salon-image img { width:100%; max-height:620px; display:block; object-fit:cover; }
.salon-results-gallery { columns:3 260px; column-gap:14px; }
.salon-results-gallery figure { break-inside:avoid; margin:0 0 14px; overflow:hidden; background:#ded8cf; }
.salon-results-gallery img { width:100%; height:auto; display:block; transition:transform .45s ease; }
@media (hover:hover) { .salon-results-gallery figure:hover img { transform:scale(1.025); } }
.salon-service-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; margin-top:45px; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.salon-service-list section { padding:30px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.salon-service-list h2 { margin:0 0 16px; font:400 clamp(1.8rem,2.6vw,2.8rem)/.98 var(--serif); letter-spacing:-.035em; }
.salon-service-list p { margin:0; }
.salon-service-list ul { margin:20px 0 0; padding-left:18px; }
.salon-service-list li + li { margin-top:8px; }
.salon-service-list .salon-service__cta { margin:28px 0 0; }
.salon-service-list .salon-link { display:inline-block; }
.salon-page__cta { margin-top:clamp(72px,10vw,140px); padding-top:28px; border-top:1px solid var(--line); max-width:760px; }
.salon-page__cta h2 { margin:0 0 28px; font:400 clamp(2.5rem,5vw,5rem)/.94 var(--serif); letter-spacing:-.045em; }
.salon-contact-layout { display:grid; grid-template-columns:.76fr 1.24fr; gap:clamp(40px,8vw,120px); align-items:start; }
.salon-contact-details > p:first-of-type { font-family:var(--serif); font-size:clamp(1.9rem,3vw,3rem); line-height:1.04; margin-top:0; }
.salon-contact-note { color:var(--muted); font-size:.87rem; margin-top:45px; }
.salon-form-placeholder { padding:28px; background:#e9e4dc; border:1px solid var(--line); }
.salon-field-placeholder { padding:15px 0; border-bottom:1px solid var(--line); color:var(--muted); font-size:.86rem; }
.salon-field-placeholder--message { min-height:90px; }
.salon-form-placeholder button { margin-top:24px; border:0; padding:14px 19px; background:#a7a19a; color:#f7f5f1; font:600 .69rem/1 var(--sans); text-transform:uppercase; letter-spacing:.1em; cursor:not-allowed; }
.salon-form-placeholder__note { margin:17px 0 0; color:var(--muted); font-size:.76rem; }
.salon-form-live { padding:28px; background:#e9e4dc; border:1px solid var(--line); }
.salon-form-live .fluentform { margin-top:20px; }
.salon-form-live .ff-el-group { margin-bottom:18px; }
.salon-form-live .ff-el-input--label label { font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; }
.salon-form-live input, .salon-form-live select, .salon-form-live textarea { width:100%; border:0 !important; border-bottom:1px solid var(--line) !important; border-radius:0 !important; background:transparent !important; padding:12px 0; color:var(--ink); font:400 1rem/1.4 var(--sans); box-shadow:none !important; }
.salon-form-live textarea { min-height:110px; }
.salon-form-live .ff-btn-submit { margin-top:8px; border:0 !important; border-radius:0 !important; padding:14px 19px; background:var(--ink) !important; background-color:var(--ink) !important; color:#fff !important; font:600 .69rem/1 var(--sans); letter-spacing:.1em; text-transform:uppercase; }
.salon-footer { border-top:1px solid var(--line); padding:36px 0; }
.salon-footer__inner { width:min(1360px, calc(100% - 48px)); margin:auto; display:flex; justify-content:space-between; gap:24px; }
.salon-footer p { margin:0; }
.salon-footer__brand { font-family:var(--serif); font-size:1.6rem; }
.salon-footer__details { text-align:right; color:var(--muted); font-size:.78rem; }
.salon-footer__legal { margin-top:10px !important; }
.salon-footer__legal a { text-underline-offset:3px; }
.salon-footer__funding { width:min(1360px, calc(100% - 48px)); min-height:156px; margin:36px auto 0; padding:34px 0 12px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:flex-end; gap:58px; }
.salon-footer__funding img { display:block; width:auto; height:auto; max-height:104px; max-width:min(420px, 36vw); object-fit:contain; filter:invert(1); opacity:.96; }
.salon-footer__funding img:first-child { max-height:90px; }
@media (max-width:980px) { .salon-header__inner { width:calc(100% - 48px); min-height:70px; grid-template-columns:1fr auto; gap:12px; padding:13px 0; }.salon-brand { grid-row:1; grid-column:1; }.salon-header__cta { grid-row:1; grid-column:2; padding:10px 12px; }.salon-nav { display:block; grid-row:2; grid-column:1 / -1; width:100%; overflow:visible; padding-bottom:2px; }.salon-nav ul { width:100%; gap:0; justify-content:space-between; }.salon-nav a { font-size:.62rem; letter-spacing:.065em; } }
@media (max-width:980px) and (min-width:761px) { .salon-about { grid-template-columns:1fr; }.salon-about .salon-section__copy { margin-top:0; padding-top:34px; }.salon-about__mosaic { height:430px; grid-template-columns:1.3fr .7fr; } }
@media (max-width:760px) { .salon-header__inner { width:calc(100% - 32px); min-height:70px; grid-template-columns:1fr auto; gap:12px; padding:13px 0; }.salon-brand { grid-row:1; grid-column:1; width:auto; min-width:0; gap:8px; }.salon-brand__mark { flex-basis:32px; width:32px; height:32px; }.salon-brand__name { max-width:180px; font-size:.95rem; }.salon-brand__tagline { font-size:.57rem; letter-spacing:.09em; }.salon-header__cta { grid-row:1; grid-column:2; padding:9px 10px; font-size:.6rem; }.salon-nav { display:block; grid-row:2; grid-column:1 / -1; width:100%; overflow:visible; padding-bottom:2px; }.salon-nav ul { width:100%; gap:0; justify-content:space-between; }.salon-nav a { font-size:.58rem; letter-spacing:.055em; }.salon-hero, .salon-hero > .wp-block-group__inner-container { min-height:620px; }.salon-hero > .wp-block-group__inner-container { padding-left:24px; padding-right:24px; align-content:end; }.salon-hero .salon-hero__media { inset:0; }.salon-hero__media::after { background:linear-gradient(0deg,rgba(12,12,11,.82),rgba(12,12,11,.22) 78%); }.salon-hero > .wp-block-group__inner-container > :not(.salon-hero__media), .salon-hero > :not(.salon-hero__media):not(.wp-block-group__inner-container) { max-width:100%; }.salon-section { width:calc(100% - 32px); }.salon-services, .salon-space, .salon-contact .salon-section, .salon-contact-layout, .salon-about, .salon-service-list { grid-template-columns:1fr; }.salon-placeholder-grid { grid-template-columns:1fr; }.salon-placeholder:nth-child(n) { grid-column:span 1; min-height:300px; }.salon-space .salon-placeholder { min-height:370px; }.salon-section__copy { margin-left:0; }.salon-about .salon-section__copy { margin-top:0; padding-top:28px; }.salon-about__mosaic { height:370px; grid-template-columns:1.1fr .9fr; grid-template-rows:1fr 1.2fr; }.salon-about-tile { min-height:0 !important; grid-column:2 !important; }.salon-about-tile--primary { grid-column:1 !important; grid-row:1 / span 2; }.salon-results-home { grid-template-columns:1fr; }.salon-results-home figure:nth-child(n) { grid-column:span 1; min-height:300px; }.salon-space__media { height:370px; grid-template-columns:1.1fr .9fr; }.salon-space__image { min-height:0; }.salon-space__secondary { height:100%; }.salon-results-gallery { columns:2 140px; column-gap:10px; }.salon-results-gallery figure { margin-bottom:10px; }.salon-footer__inner { width:calc(100% - 32px); flex-direction:column; }.salon-footer__details { text-align:left; }.salon-footer__funding { width:calc(100% - 32px); min-height:0; justify-content:flex-start; flex-wrap:wrap; gap:26px; margin-top:30px; padding:26px 0 6px; }.salon-footer__funding img { max-height:58px; max-width:min(330px, 88vw); }.salon-footer__funding img:first-child { max-height:50px; } }