/* — Fonts & base — */
@import url(‘
https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap’);
:root{
–bg:#ffffff;
–muted:#f6f4f2;
–accent:#d9a18a; /* blush/gold */
–accent-dark:#b37e5f;
–char:#222226;
–soft:#6b6b6b;
–card:#fff;
–radius:14px;
}
*{box-sizing:border-box}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,’Helvetica Neue’,Arial; color:var(–char); background:var(–bg); margin:0;}
.container{max-width:1100px;margin:0 auto;padding:40px 20px;}
/* — hero — */
.hero{
min-height:72vh;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:#fff;
background-image:linear-gradient(180deg, rgba(27,25,24,0.45), rgba(27,25,24,0.45)), url(‘
https://salon-35.com/wp-content/uploads/salon-feature.jpg’);
background-size:cover;
background-position:center;
padding:80px 20px;
}
.hero h1{font-size:clamp(32px,5vw,48px);margin:0 0 10px;font-weight:700;letter-spacing:0.6px}
.hero p{margin:0 0 22px;color:rgba(255,255,255,0.95);font-size:1.05rem}
.cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn{
display:inline-block;padding:12px 22px;border-radius:999px;text-decoration:none;font-weight:600;
box-shadow: 0 6px 18px rgba(0,0,0,0.12);
}
.btn-call{background:var(–accent);color:#fff}
.btn-wa{background:transparent;border:2px solid rgba(255,255,255,0.18);color:#fff}
/* — about — */
.about{background:var(–muted);padding:48px 20px;border-radius:var(–radius);display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.about .photo{flex:0 0 180px}
.about .photo img{width:180px;height:180px;border-radius:12px;object-fit:cover;display:block}
.about .bio{flex:1;min-width:220px}
/* — services grid — */
.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:14px}
.service-card{background:var(–card);border-radius:12px;padding:20px;box-shadow:0 6px 18px rgba(17,17,17,0.04);text-align:left;transition:transform .28s,box-shadow .28s}
.service-card:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(17,17,17,0.08)}
.service-card h3{margin:0 0 8px;font-size:1.05rem}
.service-card .price{font-weight:700;color:var(–accent-dark);margin-top:8px}
/* — gallery — */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.gallery-grid img{width:100%;height:160px;object-fit:cover;border-radius:10px;cursor:pointer;display:block;transition:transform .25s}
.gallery-grid img:hover{transform:scale(1.03)}
/* lightbox overlay */
.lb-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.85);display:none;align-items:center;justify-content:center;z-index:9999;padding:20px}
.lb-overlay img{max-width:95%;max-height:90%;border-radius:10px;box-shadow:0 12px 40px rgba(0,0,0,0.6)}
.lb-overlay.show{display:flex}
/* — faq / policy — */
.faqs{display:grid;grid-template-columns:1fr;gap:12px}
.faqs .item{background:var(–muted);padding:14px;border-radius:10px}
.faqs strong{display:block;margin-bottom:6px}
/* — contact — */
.contact{display:flex;flex-direction:column;gap:10px;align-items:center}
.contact .links a{display:inline-block;margin:6px;padding:10px 16px;border-radius:999px;text-decoration:none;font-weight:600}
.contact .tel{background:var(–accent);color:#fff}
.contact .wa{border:2px solid var(–accent);color:var(–char);background:transparent}
/* — footer — */
.site-footer{background:#faf7f5;padding:28px 0;margin-top:30px;text-align:center;color:var(–soft)}
/* — reveal animation — */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease, transform .65s ease}
.reveal.active{opacity:1;transform:none}
/* responsive tweaks */
@media (max-width:720px){
.about{padding:20px}
.hero{padding:60px 16px}
.about .photo img{width:140px;height:140px}
.gallery-grid img{height:130px}
}
document.addEventListener(‘DOMContentLoaded’,function(){
// Reveal on scroll
const r = document.querySelectorAll(‘.reveal’);
if(‘IntersectionObserver’ in window){
const io = new IntersectionObserver((entries)=>{
entries.forEach(e=>{
if(e.isIntersecting){ e.target.classList.add(‘active’); io.unobserve(e.target); }
});
},{threshold:0.12});
r.forEach(el=>io.observe(el));
} else {
r.forEach(el=>el.classList.add(‘active’));
}
// Lightbox
const overlay = document.createElement(‘div’);
overlay.className = ‘lb-overlay’;
overlay.innerHTML = ‘×
![]()
‘;
document.body.appendChild(overlay);
const overlayImg = overlay.querySelector(‘img’);
overlay.querySelector(‘button’).addEventListener(‘click’, ()=> overlay.classList.remove(‘show’));
document.querySelectorAll(‘.gallery-grid img’).forEach(img=>{
img.addEventListener(‘click’,()=>{
overlayImg.src = img.dataset.large || img.src;
overlay.classList.add(‘show’);
});
});
overlay.addEventListener(‘click’,(e)=>{ if(e.target===overlay) overlay.classList.remove(‘show’) });
});
Salon 35
Beautiful hair in the heart of Dringhouses, York — personal appointments with Joanne
About Joanne
Welcome to Salon 35. Joanne is a friendly, experienced stylist offering modern cuts and colour in a calm, private setting. Each appointment is personalised — one guest at a time.
Address: 35 Swale Avenue, Dringhouses, York, YO24 2PU
Services & Prices
Cut & Finish
Consultation, wash and professional blow-dry finish
from £35
Blow Dry / Finish
Wash and styling for a special event or everyday
from £22
Restyle
Major change with full consultation and extended styling
from £42
Root Touch Up
Colouring of regrowth
from £65
Full Head Colour
Permanent or semi-permanent colour with finish
from £75
Half Head Foils + Toner
Foils and toner included for brightness and balance
from £95
Full Head Foils
Full coverage foils with toner and finish
from £120
Toner / Gloss
Refresh or enhance existing colour
from £30
Booking Policy & FAQs
How do I book?
Appointments are by phone or WhatsApp only. No online or email bookings.
Payment methods
We accept cash, debit or credit card, and bank transfer (BACS).
Cancellations
Please give at least 48 hours’ notice where possible.
Running late?
Just message via WhatsApp — we’ll do our best to accommodate.
Salon 35 
