*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#10100f;color:#f5f1e9;font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}img{display:block;width:100%;height:100%;object-fit:cover}.topbar{position:absolute;z-index:10;top:0;left:0;width:100%;height:74px;padding:20px 5.5%;display:grid;grid-template-columns:1fr 2fr 1fr;align-items:start;color:#fff;font-size:12px}.brand{font:22px Georgia,serif;letter-spacing:3px}.brand small{display:block;font:6px Arial,sans-serif;letter-spacing:8px;text-align:center;margin-top:3px}.topbar nav,footer nav{display:flex;justify-content:center;gap:34px}.topbar nav a:first-child{border-bottom:1px solid #fff;padding-bottom:10px}.lang{text-align:right}.lang span{opacity:.5}.hero{height:760px;min-height:680px;position:relative;overflow:hidden;background:#27221d}.hero-photo{position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(22,20,18,.98) 0%,rgba(22,20,18,.84) 26%,rgba(22,20,18,.18) 53%,rgba(22,20,18,.05) 100%),url("hero.webp");background-size:cover;background-position:center}.hero-copy{position:absolute;z-index:2;left:5.5%;top:245px}.hero h1{font:110px/0.9 Georgia,serif;letter-spacing:2px;margin:0 0 18px}.sub,.kicker{font-size:10px;letter-spacing:5px}.rule{width:84px;border-top:1px solid #d7d0c5;margin:26px 0}.traits{font-size:11px;line-height:1.9;letter-spacing:4px;color:#d0cbc2}.btn{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;margin-top:22px;padding:16px 22px;border:1px solid;font-size:9px;letter-spacing:2px}.quote{position:absolute;right:7%;top:300px;font:italic 26px Georgia,serif;transform:rotate(-8deg)}.scroll{position:absolute;right:5%;bottom:35px;font-size:8px;letter-spacing:3px}.section-light{background:#f2efe9;color:#171716}.portfolio{min-height:690px;padding:28px 5.5%;display:grid;grid-template-columns:23% 77%;gap:18px}.portfolio-intro{padding-top:50px;display:flex;flex-direction:column;align-items:flex-start}.kicker{font-size:8px;letter-spacing:4px}.portfolio h2,.about h2,.media h2,.instagram h2,.contact h2{font:54px/1.08 Georgia,serif;margin:22px 0}.portfolio p,.media p,.instagram p,.contact p{font-size:12px;line-height:1.6}.textlink{margin-top:auto;margin-bottom:32px;font-size:8px;letter-spacing:1.5px;border-bottom:1px solid #c9c4bc;padding-bottom:10px}.mosaic{display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:8px}.mosaic .p1{grid-row:1/3}.mosaic img{min-height:0}.about{height:590px;display:grid;grid-template-columns:27% 47% 26%;position:relative;overflow:hidden;background:#0d0d0c}.about-copy{padding:72px 0 40px 5.5%;z-index:2}.about-copy p{font-size:11px;line-height:1.6;max-width:300px;color:#ddd8d0}.about-photo{overflow:hidden}.about-photo img{object-position:center 30%}.stats{margin:48px 5.5% 45px 0;border-left:1px solid #777;padding:18px 0 0 48px;display:flex;flex-direction:column;justify-content:space-around}.stats strong{display:block;font:24px Georgia,serif}.stats small{font-size:7px;letter-spacing:1px}.darkbtn{border-color:#aaa}.media{padding:30px 5.5%;display:grid;grid-template-columns:25% 1fr 1fr 1fr;gap:14px;min-height:330px}.media-intro{padding-top:15px}.media h2{font-size:48px;margin:15px 0}.outline{border-color:#333}.media-card{font-size:8px;letter-spacing:1.5px;color:#555}.media-card img,.video-img{height:220px}.media-card span{display:block;padding:12px 4px}.video-img{position:relative}.video-img i{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:42px;height:42px;border:1px solid white;border-radius:50%;display:grid;place-items:center;color:white;font-style:normal}.instagram{padding:35px 5.5%;display:grid;grid-template-columns:27% 73%;gap:25px;background:#111}.instagram h2{font-size:42px;margin:15px 0}.insta-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.insta-grid img{height:210px}.contact{padding:55px 5.5% 70px;display:grid;grid-template-columns:1.4fr 1fr .8fr;gap:50px;position:relative;overflow:hidden}.contact:before{content:"";position:absolute;width:350px;height:350px;left:-100px;top:-140px;background:radial-gradient(ellipse,rgba(60,70,45,.13),transparent 65%);filter:blur(15px)}.contact h2{font-size:52px;margin:15px 0}.contact-data{padding-top:45px}.contact-script{font:italic 27px Georgia,serif;line-height:1.3;transform:rotate(-7deg);padding-top:35px}footer{background:#f2efe9;color:#171716;padding:28px 5.5%;display:grid;grid-template-columns:1fr 2fr 1fr;align-items:center;font-size:8px;position:relative}footer small{grid-column:1/-1;margin-top:20px;color:#777}.dark-brand{font-size:18px}

@media(max-width:900px){
 .topbar{grid-template-columns:1fr auto}.topbar nav{display:none}.hero{height:720px}.hero-photo{background-position:62% center}.hero-copy{top:300px}.hero h1{font-size:70px}.quote{display:none}
 .portfolio{grid-template-columns:1fr;padding-top:55px}.portfolio-intro{padding:0}.textlink{margin:15px 0 25px}.mosaic{min-height:600px}
 .about{height:auto;grid-template-columns:1fr 1fr}.about-copy{padding:60px 7%}.about-photo{min-height:480px}.stats{grid-column:1/-1;margin:0;padding:35px 7%;border-left:0;border-top:1px solid #555;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
 .media{grid-template-columns:1fr 1fr}.media-intro{grid-column:1/-1}.instagram{grid-template-columns:1fr}.contact{grid-template-columns:1fr 1fr}.contact-script{display:none}footer{grid-template-columns:1fr auto}footer nav{display:none}
}
@media(max-width:600px){
 .hero{height:650px}.hero-photo{background-position:68% center}.hero-copy{left:7%;top:285px}.hero h1{font-size:55px}.sub{font-size:7px}.portfolio{padding:45px 6%}.portfolio h2{font-size:44px}.mosaic{grid-template-columns:1fr 1fr;grid-template-rows:300px 210px 210px}.mosaic .p1{grid-row:1/2;grid-column:1/3}.about{grid-template-columns:1fr}.about-photo{min-height:420px}.stats{grid-template-columns:1fr 1fr}.media{grid-template-columns:1fr;padding:40px 6%}.media-card img,.video-img{height:340px}.instagram{padding:45px 6%}.insta-grid{grid-template-columns:repeat(2,1fr)}.insta-grid img{height:230px}.insta-grid img:last-child{display:none}.contact{grid-template-columns:1fr;padding:50px 6%}.contact-data{padding-top:5px}
}


/* v2 - fixed desktop proportions, prevent ultra-wide stretching */
body{
  background:#0b0b0b;
}

main,
footer{
  width:min(100%, 1440px);
  margin-inline:auto;
}

.topbar{
  width:min(100%, 1440px);
  left:50%;
  transform:translateX(-50%);
}

@media (min-width:901px){
  .hero{
    height:820px;
    min-height:820px;
  }

  .hero-photo{
    background-size:auto 100%;
    background-repeat:no-repeat;
    background-position:right center;
    background-color:#27221d;
  }

  .hero-copy{
    left:5.5%;
    top:270px;
  }

  .hero h1{
    font-size:104px;
  }

  .portfolio{
    min-height:720px;
  }

  .about{
    height:610px;
  }
}

@media (min-width:1441px){
  main,
  footer{
    box-shadow:0 0 0 1px rgba(255,255,255,.02);
  }
}


/* v3 - clean hero image with no baked-in text */
.hero{
  background:
    linear-gradient(90deg,#171511 0%,#171511 42%,#211d18 63%,#171511 100%);
}

.hero-photo{
  inset:0 0 0 auto;
  width:66%;
  background-image:
    linear-gradient(90deg,#171511 0%,rgba(23,21,17,.93) 10%,rgba(23,21,17,.28) 28%,rgba(23,21,17,0) 50%),
    url("hero-clean.webp") !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
}

@media (min-width:901px){
  .hero-copy{
    z-index:3;
  }
  .hero h1{
    font-size:96px;
  }
}

@media (max-width:900px){
  .hero-photo{
    width:100%;
    opacity:.72;
    background-position:58% center !important;
  }
}


/* v4 - hero replaced with user's supplied Renata photo */
.hero{
  background:#17191a;
}

.hero-photo{
  inset:0 0 0 auto !important;
  width:68% !important;
  opacity:1 !important;
  background-image:
    linear-gradient(90deg,#17191a 0%,rgba(23,25,26,.92) 9%,rgba(23,25,26,.35) 22%,rgba(23,25,26,0) 40%),
    url("hero-renata.webp") !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:42% center !important;
}

@media (min-width:901px){
  .hero-copy{
    left:5.5% !important;
    top:255px !important;
  }
  .hero h1{
    font-size:96px !important;
  }
}

@media (max-width:900px){
  .hero-photo{
    width:100% !important;
    background-position:39% center !important;
    opacity:.78 !important;
  }
}


/* v5 - header alignment and navigation sizing */
@media (min-width:901px){
  .topbar{
    padding-left:5.5%;
    padding-right:3.2%;
    grid-template-columns:280px 1fr 180px;
    align-items:start;
  }

  .topbar .brand{
    justify-self:start;
    margin-left:0;
  }

  .topbar nav{
    justify-self:center;
    gap:42px;
    font-size:14px;
  }

  .topbar nav a{
    padding-bottom:10px;
  }

  .topbar .lang{
    justify-self:end;
    text-align:right;
    font-size:13px;
    padding-top:1px;
  }

  .hero-copy{
    left:5.5% !important;
  }
}

@media (min-width:1200px){
  .topbar{
    padding-left:5.5%;
    padding-right:2%;
  }

  .topbar nav{
    gap:46px;
    font-size:15px;
  }

  .topbar .lang{
    font-size:14px;
  }
}


/* v6 - exact desktop header positioning */
@media (min-width:901px){
  .topbar{
    display:block !important;
    position:absolute !important;
    top:0 !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    width:min(100%, 1440px) !important;
    height:78px !important;
    padding:20px 0 0 !important;
  }

  /* Logo aligned exactly with H1 left edge */
  .topbar .brand{
    position:absolute !important;
    left:5.5% !important;
    top:20px !important;
    margin:0 !important;
    justify-self:auto !important;
  }

  /* Menu centered to the full page, not to the remaining grid space */
  .topbar nav{
    position:absolute !important;
    left:50% !important;
    top:20px !important;
    transform:translateX(-50%) !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    gap:48px !important;
    width:max-content !important;
    font-size:15px !important;
    margin:0 !important;
  }

  /* Language selector anchored to the top-right corner */
  .topbar .lang{
    position:absolute !important;
    right:2.2% !important;
    top:21px !important;
    margin:0 !important;
    text-align:right !important;
    font-size:14px !important;
  }

  .hero-copy{
    left:5.5% !important;
  }
}

/* v7 - standalone navigation pages */
.subpage{min-height:100vh;background:#f2efe9;color:#171716;padding-top:78px}
.subpage-topbar{position:absolute!important;background:#111;color:#fff}
.subpage-hero{min-height:calc(100vh - 78px);padding:13vh 7%;display:flex;flex-direction:column;justify-content:center}
.subpage-hero h1{font:clamp(64px,9vw,140px)/.95 Georgia,serif;margin:22px 0 28px}
.subpage-hero p{max-width:620px;font-size:17px;line-height:1.7}

/* panel-v1 subpage content */
.admin-gallery{margin-top:45px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.admin-gallery img{aspect-ratio:3/4;object-fit:cover}
.about-page-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.about-page-grid img{max-height:620px;object-fit:cover}
.measure-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}.measure-grid div{border-top:1px solid #aaa;padding:20px 0}.measure-grid b{display:block;font:32px Georgia,serif}.measure-grid span{font-size:9px;letter-spacing:2px}.video-cover{margin-top:35px;max-width:760px;max-height:500px;object-fit:cover}.contact-page-data{margin-top:35px;font-size:18px}
@media(max-width:700px){.admin-gallery{grid-template-columns:1fr 1fr}.about-page-grid{grid-template-columns:1fr}.measure-grid{grid-template-columns:1fr 1fr}}


/* panel-v3 - larger hero supporting text */
@media (min-width:901px){
  .hero .sub{
    font-size:13px !important;
    letter-spacing:5.5px !important;
    line-height:1.5 !important;
  }

  .hero .traits{
    font-size:15px !important;
    line-height:2 !important;
    letter-spacing:5px !important;
  }

  .hero .btn{
    font-size:12px !important;
    letter-spacing:2.2px !important;
    padding:18px 24px !important;
    min-width:250px;
  }

  .hero .rule{
    width:100px;
    margin:28px 0 22px;
  }
}