:root {
      --paper: #ececec; --paper-alt: #e4e4e4;
      --ink: #0a0a0a; --ink-soft: #1e1e1e; --text: #111111; --text-mid: #3a3a3a; --text-light: #8a8a8a;
      --white: #ffffff;
      --nav-h: 84px;
      --display: 'Kalnia', 'Bodoni Moda', serif;
      --serif: 'Libre Baskerville', Georgia, serif;
      --script: 'Pinyon Script', cursive;
      --hand: 'Dancing Script', cursive;
      --sans: 'Open Sans', Arial, sans-serif;
    }
    *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
    html { scroll-behavior:smooth; scroll-padding-top:var(--nav-h); }
    body { font-family:var(--sans); background:var(--paper); color:var(--text); overflow-x:hidden; }
    img { display:block; max-width:100%; height:auto; }
    a { color:inherit; }
    button { font:inherit; }

    /* ─── NAV ─── */
    .site-header {
      position:fixed; top:0; left:0; right:0; z-index:1000;
      background:rgba(236,236,236,0.95); backdrop-filter:blur(14px);
      border-bottom:1px solid rgba(0,0,0,0.08); transition:box-shadow .3s;
    }
    .site-header.scrolled { box-shadow:0 4px 24px rgba(0,0,0,.08); }
    .nav { height:var(--nav-h); display:flex; align-items:center; justify-content:space-between; padding:0 48px; max-width:1600px; margin:0 auto; }
    .nav-logo img { height:62px; width:auto; }
    .nav-links { display:flex; align-items:center; gap:32px; list-style:none; }
    .nav-links a {
      text-decoration:none; font-size:12px; font-weight:600; letter-spacing:2px; text-transform:uppercase;
      color:var(--ink); position:relative; padding-bottom:3px; transition:color .25s;
    }
    .nav-links a::after { content:''; position:absolute; left:0; bottom:-2px; width:0; height:1.5px; background:var(--ink); transition:width .3s; }
    .nav-links a:hover::after, .nav-links a.active::after { width:100%; }
    .nav-cta { background:var(--ink); color:var(--white) !important; padding:11px 24px !important; border-radius:10px; }
    .nav-cta::after { display:none; }
    .nav-cta:hover { background:var(--ink-soft); }

    .hamburger { display:none; flex-direction:column; gap:5px; padding:6px; background:none; border:0; cursor:pointer; }
    .hamburger span { width:26px; height:2px; background:var(--ink); border-radius:2px; transition:.3s; }
    .hamburger.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
    .hamburger.open span:nth-child(2) { opacity:0; }
    .hamburger.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }
    .mobile-menu { display:none; flex-direction:column; padding:8px 24px 24px; border-top:1px solid rgba(0,0,0,0.08); }
    .mobile-menu.open { display:flex; }
    .mobile-menu a {
      text-decoration:none; font-size:13px; font-weight:600; letter-spacing:2px; text-transform:uppercase;
      padding:15px 0; border-bottom:1px solid rgba(0,0,0,0.08);
    }

    /* ─── SECTIONS ─── */
    .section { position:relative; padding:110px 56px; max-width:1600px; margin:0 auto; }
    .section + .section { border-top:1px solid #d6d6d6; }
    .display {
      font-family:var(--display); font-weight:200; text-transform:uppercase;
      font-size:clamp(44px,5.6vw,88px); line-height:.98; letter-spacing:.01em; color:var(--ink);
      margin-bottom:44px;
    }
    .display.center { text-align:center; }
    .display.light { color:var(--white); }
    .script { font-family:var(--hand); font-weight:500; }

    /* ─── HOME / COVER ─── */
    .section-cover {
      display:grid; grid-template-columns:minmax(0,45%) 1fr; gap:56px; align-items:center;
      padding-top:calc(var(--nav-h) + 48px); padding-bottom:80px;
    }
    .cover-photo img { width:100%; aspect-ratio:1/1.035; object-fit:cover; }
    .cover-text { text-align:center; }
    .cover-logo img { width:min(440px,80%); margin:0 auto; }
    .cover-title { font-family:var(--serif); font-size:clamp(30px,3.4vw,54px); line-height:1.2; margin:40px 0 36px; color:var(--ink); }
    .cover-list {
      list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:4px 22px;
      font-family:var(--script); font-size:clamp(24px,2.2vw,33px); line-height:1.5; max-width:800px; margin:0 auto;
    }
    .cover-list li::before { content:'• '; font-family:var(--sans); font-size:.5em; vertical-align:middle; }
    .work-btn {
      display:inline-block; margin-top:40px; background:var(--ink); color:var(--white); text-decoration:none;
      font-weight:700; font-size:19px; padding:15px 0; width:min(350px,100%); text-align:center; border-radius:12px;
      box-shadow:0 4px 18px rgba(0,0,0,.2); transition:transform .25s, background .25s;
    }
    .work-btn:hover { transform:translateY(-2px); background:var(--ink-soft); }

    /* ─── TEXT SECTIONS (About, Experience) ─── */
    .body-copy { max-width:1400px; font-size:clamp(17px,1.5vw,23px); line-height:1.5; }
    .body-copy p { margin-bottom:1.4em; }
    .body-copy p:last-child { margin-bottom:0; }
    .body-copy.justify { text-align:justify; hyphens:auto; }

    /* ─── SERVICES ─── */
    .section-services .display { margin-bottom:32px; }
    .services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:44px; align-items:start; }
    .service { text-align:center; }
    .service h3 { font-size:clamp(32px,2.8vw,46px); line-height:1.1; margin-bottom:8px; }
    .service p { font-size:clamp(17px,1.5vw,23px); line-height:1.5; margin-bottom:22px; }
    .service img { margin:0 auto; width:min(100%,420px); object-fit:cover; aspect-ratio:1/1.05; }
    .service img.tall { aspect-ratio:2/3; width:min(80%,320px); }
    .service.middle { padding-top:40px; }
    .service.middle img { aspect-ratio:4/3; width:100%; margin-bottom:28px; }

    /* ─── PREVIOUS WORK ─── */
    .gallery-soon { font-size:clamp(30px,2.6vw,42px); }
    .work-more { margin-top:32px; font-size:18px; }
    .work-more a { font-weight:600; }


    /* ─── GET IN TOUCH ─── */
    .section-contact {
      display:grid; grid-template-columns:57.5% 1fr; padding:0; max-width:none;
      background:var(--ink); color:var(--white); border-top:0 !important;
    }
    .contact-left { padding:100px 40px 72px 88px; }
    .contact-left .display { font-size:clamp(56px,7vw,112px); margin-bottom:48px; }
    .contact-block { margin-bottom:34px; }
    .contact-label { font-size:clamp(22px,1.9vw,30px); margin-bottom:12px; }
    .contact-value { font-family:Arial, var(--sans); font-weight:700; font-size:clamp(16px,1.3vw,21px); text-decoration:none; word-break:break-word; }
    .contact-value:hover { text-decoration:underline; }
    .contact-icons { list-style:none; display:flex; gap:28px; flex-wrap:wrap; margin-top:64px; }
    .contact-icons a { display:flex; flex-direction:column; align-items:center; gap:14px; text-decoration:none; font-family:Arial, var(--sans); font-weight:700; font-size:clamp(16px,1.2vw,20px); transition:transform .25s; }
    .contact-icons a:hover { transform:translateY(-3px); }
    .contact-icons svg { width:72px; height:72px; }
    .collabs { margin-top:40px; font-weight:700; font-size:clamp(18px,1.6vw,24px); letter-spacing:.12em; text-transform:uppercase; color:#8a8a8a; }
    .contact-photo { position:relative; overflow:hidden; min-height:520px; }
    .contact-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 35%; }

    /* ─── FOOTER ─── */
    .footer { background:var(--ink); color:#b5b5b5; padding:64px 56px 28px; border-top:1px solid #2a2a2a; }
    .footer-inner { max-width:1600px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr; gap:48px; }
    .footer-brand img { height:84px; width:auto; margin-bottom:18px; }
    .footer-brand p { font-size:14.5px; line-height:1.7; max-width:420px; }
    .footer-col h4 { font-size:11px; letter-spacing:3px; text-transform:uppercase; color:var(--white); margin-bottom:16px; font-weight:600; }
    .footer-col a { display:block; text-decoration:none; font-size:14px; padding:5px 0; word-break:break-word; transition:color .25s; }
    .footer-col a:hover { color:var(--white); }
    .footer-copy { max-width:1600px; margin:48px auto 0; padding-top:22px; border-top:1px solid #2a2a2a; font-size:12px; letter-spacing:1px; color:#777; }

    /* ─── WHATSAPP FLOAT ─── */
    .wa-float {
      position:fixed; right:24px; bottom:24px; z-index:900; width:58px; height:58px; border-radius:50%;
      background:#25d366; color:var(--white); display:flex; align-items:center; justify-content:center;
      box-shadow:0 10px 30px rgba(0,0,0,0.25); transition:transform .3s;
    }
    .wa-float:hover { transform:scale(1.08); }
    .wa-float svg { width:30px; height:30px; }

    /* ─── FOCUS ─── */
    a:focus-visible, button:focus-visible, summary:focus-visible { outline:2px solid #6b6b6b; outline-offset:3px; }
    .section-contact a:focus-visible, .footer a:focus-visible { outline-color:var(--white); }

    /* ─── RESPONSIVE ─── */
    @media (max-width:1180px) {
      .nav { padding:0 28px; }
      .nav-links { gap:20px; }
      .nav-links a { font-size:11px; letter-spacing:1.5px; }
      .section { padding:90px 32px; }
      .section-cover { padding-top:calc(var(--nav-h) + 40px); }
      .services-grid { gap:28px; }
      .contact-left { padding-left:48px; }
    }
    @media (max-width:960px) {
      :root { --nav-h:72px; }
      .nav { padding:0 16px; }
      .nav-logo img { height:52px; }
      .nav-links { display:none; }
      .hamburger { display:flex; }
    }
    @media (max-width:820px) {
      .section { padding:64px 16px; }
      .display { margin-bottom:28px; }
      .section-cover { grid-template-columns:1fr; gap:28px; padding:calc(var(--nav-h) + 16px) 16px 64px; }
      .cover-photo img { aspect-ratio:1/1; }
      .cover-logo img { width:min(320px,78%); }
      .cover-title { margin:28px 0 24px; }
      .work-btn { width:100%; }
      .services-grid { grid-template-columns:1fr; gap:48px; }
      .body-copy.justify { text-align:left; }
      .service.middle { padding-top:0; display:flex; flex-direction:column; }
      .service.middle img { order:3; margin:0 auto; }
      .service img.tall { width:min(70%,280px); }
      .section-contact { grid-template-columns:1fr; padding:0; }
      .contact-left { padding:64px 16px 48px; }
      .contact-icons { gap:20px; margin-top:44px; }
      .contact-icons svg { width:58px; height:58px; }
      .contact-photo { min-height:0; height:70vh; }
      .footer { padding:56px 16px 96px; }
      .footer-inner { grid-template-columns:1fr 1fr; gap:36px; }
      .footer-brand { grid-column:1 / -1; }
      .wa-float { right:16px; bottom:16px; }
    }
    @media (max-width:420px) {
      .cover-list { gap:0 14px; }
      .footer-inner { grid-template-columns:1fr; }
    }
    @media (prefers-reduced-motion:reduce) {
      html { scroll-behavior:auto; }
      * { transition:none !important; }
    }