:root { --black:#0a0a0a; --white:#f7f7f5; --line:#2c2c2c; --accent:#b52232; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--white); color:var(--black); font-family:Arial,Helvetica,sans-serif; font-size:16px; line-height:1.6; }
a { color:inherit; text-decoration:none; }
.hero { min-height:100svh; position:relative; isolation:isolate; overflow:hidden; color:#fff; background:#0a0a0a; display:flex; align-items:center; padding:7rem clamp(1.5rem,6vw,7rem); }
.hero::before { content:""; position:absolute; z-index:-2; inset:0; background:url("cennet-hero-wide.jpg") center/cover no-repeat; }
.hero::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.94) 0%,rgba(0,0,0,.62) 34%,rgba(0,0,0,.16) 66%,rgba(0,0,0,.04) 100%); }
nav { position:absolute; top:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between; padding:1.5rem clamp(1.5rem,6vw,7rem); z-index:3; }
.monogram { font-family:"Arial Narrow",Impact,sans-serif; font-size:1.8rem; font-weight:800; letter-spacing:-.04em; }
.lang-switch{display:flex;align-items:center;gap:.35rem}.lang-switch button{border:0;background:transparent;color:#888;font:inherit;font-weight:700;padding:0;cursor:pointer}.lang-switch button.active{color:#fff}.lang-switch span{color:#555}
.hero-language{position:absolute;z-index:4;top:5.4rem;left:clamp(1.5rem,6vw,7rem);padding:.45rem .7rem;border:1px solid rgba(255,255,255,.35);background:rgba(10,10,10,.62);backdrop-filter:blur(8px);font-size:.75rem;letter-spacing:.12em}.hero-language button{min-width:2rem;min-height:2rem}.hero-language button:focus-visible{outline:2px solid #fff;outline-offset:3px}
.nav-links { display:flex; gap:2.25rem; font-size:.82rem; text-transform:uppercase; letter-spacing:.14em; }
.nav-links a:hover,.social a:hover { color:#ccc; }
.menu { display:none; background:none; border:0; color:#fff; text-transform:uppercase; letter-spacing:.15em; }
.hero-copy { position:relative; z-index:1; max-width:980px; }
.eyebrow,.section-number { text-transform:uppercase; letter-spacing:.18em; font-size:.74rem; font-weight:600; }
.hero .eyebrow { font-size:.58rem; letter-spacing:.2em; opacity:.78; }
.hero h1,.section h2 { font-family:"Arial Narrow",Impact,sans-serif; text-transform:uppercase; line-height:.86; letter-spacing:-.045em; margin:.65rem 0; }
.hero h1 { font-size:clamp(5rem,12vw,10.5rem); text-shadow:0 2px 28px rgba(0,0,0,.3); }
.role { font-size:clamp(1rem,2vw,1.4rem); letter-spacing:.26em; text-transform:uppercase; }
.scroll { position:absolute; right:clamp(1.5rem,6vw,7rem); bottom:2rem; font-size:.78rem; text-transform:uppercase; letter-spacing:.16em; }
.scroll span { margin-left:1rem; }
.section { padding:clamp(5rem,10vw,10rem) clamp(1.5rem,8vw,9rem); }
.section-number { margin:0 0 4rem; color:#777; }
.about-grid,.services-grid { display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(3rem,8vw,9rem); align-items:start; }
.section h2 { font-size:clamp(3.5rem,7vw,7rem); }
.section h2 em { font-weight:500; color:var(--accent); }
.about-copy { max-width:620px; }
.lead { font-size:clamp(1.35rem,2.2vw,2rem); line-height:1.35; margin-top:0; }
.facts { border-top:1px solid #ccc; margin-top:3rem; padding-top:1.25rem; display:flex; flex-direction:column; gap:.55rem; text-transform:uppercase; font-size:.74rem; letter-spacing:.12em; }
.sticker-gallery { position:relative; height:clamp(21rem,42vw,37rem); margin-top:clamp(4rem,8vw,8rem); }
.sticker { position:absolute; margin:0; overflow:hidden; background:#fff; border:clamp(6px,.75vw,12px) solid #fff; box-shadow:0 18px 50px rgba(0,0,0,.2); }
.sticker img { display:block; width:100%; height:100%; object-fit:cover; }
.sticker-camera { width:34%; height:78%; left:7%; top:7%; transform:rotate(-4deg); }
.sticker-smile { width:27%; height:72%; left:38%; top:19%; transform:rotate(3deg); }
.sticker-portrait { width:30%; height:80%; right:7%; top:3%; transform:rotate(-2deg); }
.dark { background:var(--black); color:var(--white); }
.dark .section-number { color:#777; }
.work-heading { display:grid; grid-template-columns:1.25fr .75fr; gap:3rem; align-items:end; }
.work-heading h2 { max-width:850px; }
.work-heading>p { color:#aaa; max-width:400px; margin:0 0 .8rem auto; font-size:1.1rem; }
.video-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:5rem; align-items:start; }
.video-wrap { position:relative; aspect-ratio:9/16; background:#151515; overflow:hidden; }
.video-wrap video { display:block; width:100%; height:100%; object-fit:cover; }
.video-meta { padding:1rem 0 1.75rem; border-bottom:1px solid var(--line); }
.video-meta span,.expertise-label { color:#888; text-transform:uppercase; letter-spacing:.14em; font-size:.68rem; }
.video-meta h3 { font-family:"Barlow Condensed"; font-size:1.6rem; line-height:1; text-transform:uppercase; margin:.45rem 0 0; }
.expertise-label { margin:7rem 0 1.5rem; }
.work-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.work-grid article { background:var(--black); padding:2.5rem; min-height:380px; display:flex; flex-direction:column; }
.work-grid article>span { color:#777; }
.work-grid h3 { font-family:"Barlow Condensed"; font-size:clamp(2.5rem,4vw,4rem); text-transform:uppercase; line-height:.95; margin:auto 0 1.5rem; }
.work-grid p { color:#b7b7b3; margin:0; }
.case { display:grid; grid-template-columns:1.2fr .8fr; gap:4rem; align-items:end; }
.case .section-number { grid-column:1/-1; }
.metric { font-family:"Barlow Condensed"; font-size:clamp(8rem,22vw,20rem); font-weight:700; letter-spacing:-.07em; line-height:.65; color:var(--accent); }
.case-copy h2 { font-size:clamp(2.5rem,4.5vw,5rem); }
.proof-grid { grid-column:1/-1; display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; margin-top:clamp(4rem,8vw,7rem); }
.proof-grid article { background:#fff; border:1px solid #c9c9c5; min-width:0; }
.proof-grid img { display:block; width:100%; aspect-ratio:3/4; object-fit:cover; object-position:center top; }
.proof-grid article div { display:flex; flex-direction:column; padding:1.1rem; border-top:1px solid #c9c9c5; }
.proof-grid strong { font-family:"Barlow Condensed"; font-size:clamp(2.1rem,4vw,3.8rem); line-height:1; color:var(--accent); }
.proof-grid span { margin-top:.5rem; font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:#666; }
.services ul { list-style:none; padding:0; margin:0; }
.services li { border-top:1px solid #bbb; padding:1.1rem 0; display:flex; justify-content:space-between; font-size:1.1rem; }
.services li:last-child { border-bottom:1px solid #bbb; }
.services li span { font-size:.7rem; color:#777; }
.deliverables-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:clamp(4rem,8vw,8rem); background:#bbb; border:1px solid #bbb; }
.deliverables-grid article { background:var(--white); padding:2rem; }
.deliverables-grid article>span { color:#777; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; }
.deliverables-grid h3 { font-family:"Barlow Condensed"; font-size:clamp(2rem,3.2vw,3.2rem); line-height:.95; text-transform:uppercase; margin:3.5rem 0 1.25rem; }
.deliverables-grid p { margin:0; color:#555; }
.equipment-visual { margin-top:1px; padding:clamp(2rem,5vw,5rem); background:var(--black); color:var(--white); }
.equipment-visual .expertise-label { margin:0 0 2rem; }
.equipment-images { display:grid; grid-template-columns:1.35fr 1fr; align-items:center; gap:1rem; }
.equipment-images img { display:block; width:100%; height:auto; mix-blend-mode:screen; }
.equipment-list { margin:2rem 0 0; padding-top:1.25rem; border-top:1px solid var(--line); color:#aaa; font-size:.78rem; letter-spacing:.12em; line-height:1.9; text-transform:uppercase; text-align:center; }
.content-categories { margin-top:clamp(4rem,8vw,8rem); border-top:1px solid #bbb; padding-top:1.5rem; }
.content-categories .expertise-label { margin:0 0 2rem; }
.category-list { display:flex; flex-wrap:wrap; gap:.7rem; }
.category-list span { border:1px solid #aaa; border-radius:999px; padding:.62rem 1rem; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; }
.category-note { max-width:720px; margin:2rem 0 0 auto; font-size:clamp(1.2rem,2vw,1.8rem); line-height:1.4; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.steps div { background:var(--black); padding:2rem; min-height:260px; }
.steps b { color:var(--accent); }
.steps h3 { font-family:"Barlow Condensed"; font-size:2.25rem; text-transform:uppercase; margin:4rem 0 .5rem; }
.steps p { color:#aaa; }
.contact { text-align:center; }
.contact .section-number { text-align:left; }
.contact h2 { font-size:clamp(5rem,12vw,11rem); }
.email { display:inline-block; border-bottom:2px solid var(--black); font-size:clamp(1rem,2vw,1.5rem); padding:.5rem 0; }
.creator-links { display:grid; grid-template-columns:repeat(3,1fr); margin-top:clamp(4rem,7vw,7rem); border-top:1px solid #bbb; }
.creator-links a { display:flex; flex-direction:column; gap:1.1rem; text-align:left; padding:1.5rem; border-right:1px solid #bbb; transition:background .2s,color .2s; }
.creator-links a:last-child { border-right:0; }
.creator-links a:hover { background:var(--black); color:var(--white); }
.creator-links span { color:#777; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; }
.creator-links strong { font-family:"Barlow Condensed"; font-size:clamp(1.55rem,2.5vw,2.4rem); text-transform:uppercase; }
.social { margin-top:6rem; display:flex; justify-content:space-between; text-transform:uppercase; font-size:.78rem; letter-spacing:.12em; }
footer { padding:1.5rem clamp(1.5rem,6vw,7rem); background:var(--black); color:#999; display:flex; justify-content:space-between; gap:1.5rem; font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; }
.legal-links{display:flex;gap:1.5rem}.legal-links a:hover{color:#fff}.legal-page{background:var(--white)}.legal-header{position:static;background:var(--black);color:#fff}.legal-content{max-width:900px;margin:0 auto;padding:clamp(5rem,10vw,9rem) 1.5rem}.legal-content h1{font-family:"Arial Narrow",Impact,sans-serif;font-size:clamp(4rem,10vw,8rem);line-height:.9;text-transform:uppercase;margin:0 0 4rem}.legal-content h2{font-size:1.15rem;margin:2.5rem 0 .5rem}.legal-content a{text-decoration:underline}.legal-note{margin-top:3rem;color:#666;font-size:.9rem}
@media(max-width:1000px) { .video-grid{grid-template-columns:repeat(3,1fr)} }
@media(max-width:820px) {
  .hero{align-items:flex-end;padding-bottom:7rem;background:#0a0a0a}.hero::before{inset:4.5rem 0 auto;height:calc(100vw * .5625);background-image:url("cennet-hero-wide.jpg");background-size:contain;background-position:center top;background-repeat:no-repeat}.hero::after{background:linear-gradient(0deg,rgba(0,0,0,.54) 0%,rgba(0,0,0,.08) 72%,rgba(0,0,0,.04) 100%)}.hero-copy,.scroll{z-index:1}
  .nav-links{display:none;position:absolute;top:4.5rem;left:1.5rem;right:1.5rem;background:#111;padding:1.5rem;flex-direction:column}.nav-links.open{display:flex}.nav-links .lang-switch{display:none}.menu{display:block}.hero-language{top:4.9rem;left:1.5rem}.legal-header{display:flex}.legal-page footer{flex-wrap:wrap}
  .about-grid,.services-grid,.case,.work-heading{grid-template-columns:1fr}.work-heading>p{margin:0}.video-grid{grid-template-columns:repeat(2,1fr);gap:1rem}.work-grid,.steps,.deliverables-grid{grid-template-columns:1fr}.work-grid article{min-height:310px}.metric{font-size:42vw}.case-copy{max-width:600px}.proof-grid{grid-template-columns:repeat(2,1fr)}.equipment-images{grid-template-columns:1fr}.creator-links{grid-template-columns:1fr}.creator-links a{border-right:0;border-bottom:1px solid #bbb}.social{flex-direction:column;gap:1rem}.section-number{margin-bottom:2.5rem}
}
@media(max-width:520px) { .video-grid{grid-template-columns:1fr 1fr}.video-meta h3{font-size:1.35rem}.video-meta span{font-size:.6rem}.sticker-gallery{height:27rem}.sticker-camera{width:48%;height:58%;left:0;top:2%}.sticker-smile{width:43%;height:55%;left:49%;top:9%}.sticker-portrait{width:48%;height:56%;right:20%;top:42%}.proof-grid{gap:.75rem}.proof-grid article div{padding:.85rem}.proof-grid span{font-size:.58rem} }
