/* =========================================================
   RESET
   ========================================================= */

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { background: #fff; color: #111; font-family: "Cormorant Garamond", Georgia, serif; }

/* =========================================================
   HEADER
   ========================================================= */
.site-header { width: 100%; padding: 22px 48px 0; display: flex; align-items: flex-start; justify-content: space-between; }
.logo-link { display: block; flex: 0 0 auto; }
.logo-link img { display: block; width: 150px; height: auto; }
.main-nav { display: flex; align-items: center; justify-content: flex-end; gap: 25px; padding-top: 10px; }
.main-nav a { color: #111; text-decoration: none; font-family: Arial, Helvetica, sans-serif; font-size: 11px; line-height: 1; white-space: nowrap; }
.main-nav a:hover { text-decoration: underline; }

/* =========================================================
   MAIN
   ========================================================= */
main { width: 100%; }

/* =========================================================
   HERO
   ========================================================= */
.hero { width: 100%; max-width: 1200px; margin: 75px auto 0; padding: 0 40px; }
.hero h1 { margin: 0 0 58px; font-family: "Cormorant Garamond", Georgia, serif; font-weight: 500; font-size: 42px; line-height: 1.05; letter-spacing: -1.5px; }
.hero-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 110px; align-items: start; }
.hero-left { min-width: 0; }
.intro-copy { max-width: 500px; }
.intro-copy p { margin: 0; font-size: 21px; line-height: 1.35; }
.swan-drawing {
  margin: 65px 0 0;
  max-width: 320px;
}

.swan-drawing img {
  display: block;
  width: 100%;
  height: auto;
}

.arrow-drawing {
  margin: 45px 0 0;
  max-width: 280px;
  transform: translate(-8.1cm, -4.5cm);
}

.arrow-drawing img {
  display: block;
  width: 100%;
  height: auto;
}
.hero-right { min-width: 0; }
.services-block {
  max-width: 420px;
  margin-top: 2.5cm;
}
.services-block h2 { margin: 0 0 22px; font-family: "Cormorant Garamond", Georgia, serif; font-weight: 500; font-size: 28px; line-height: 1.1; }
.services-block ul { margin: 0; padding-left: 22px; }
.services-block li { margin: 0 0 8px; font-size: 19px; line-height: 1.3; }

/* =========================================================
   TRANSITION LINE
   ========================================================= */
.transition-line { width: 100%; max-width: 1200px; margin: 115px auto 42px; padding: 0 40px; font-family: "Caveat", cursive; font-size: 38px; line-height: 1.1; text-align: center; }

/* =========================================================
   PRODUCT GRID
   ========================================================= */
.product-grid { width: calc(100% - 80px); max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 35px; }
.product-item { margin: 0; padding: 0; min-width: 0; }
.product-item img { display: block; width: 100%; height: auto; object-fit: contain; }

/* =========================================================
   DESKTOP
   ========================================================= */
@media (min-width: 1200px) {
  .site-header { padding-left: 48px; padding-right: 48px; }
  .hero { margin-top: 85px; }
  .hero h1 { font-size: 45px; }
  .hero-columns { column-gap: 140px; }
  .product-grid { gap: 40px; }
}

/* =========================================================
   TABLET
   ========================================================= */
@media (max-width: 900px) {
  .site-header { padding-left: 30px; padding-right: 30px; }
  .main-nav { gap: 14px; }
  .hero { padding: 0 30px; }
  .hero-columns { column-gap: 60px; }
  .product-grid { width: calc(100% - 60px); grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 650px) {
  .site-header { display: block; padding: 20px; }
  .main-nav { margin-top: 25px; flex-wrap: wrap; justify-content: flex-start; gap: 12px 18px; }
  .hero { margin-top: 55px; padding: 0 20px; }
  .hero h1 { font-size: 36px; margin-bottom: 45px; }
  .hero-columns { grid-template-columns: 1fr; row-gap: 55px; }
  .intro-copy p { font-size: 20px; }
  .swan-drawing { margin-top: 45px; }
  .transition-line { margin-top: 80px; padding: 0 20px; font-size: 32px; }
  .product-grid { width: calc(100% - 40px); grid-template-columns: 1fr; gap: 28px; }
}


/* FINAL SITE-WIDE MENU — desktop normalization; no page-content changes. */
@media (min-width: 901px) {
  .site-header .main-nav { gap: 26px; flex-wrap: nowrap; white-space: nowrap; justify-content: flex-end; }
  .site-header .main-nav a { font-family: Arial, Helvetica, sans-serif; font-size: 9px; line-height: 1; font-weight: 400; letter-spacing: 0; text-transform: uppercase; }
}


@media(max-width:650px){
  .site-header{padding:20px !important;display:flex !important;align-items:flex-start !important;gap:16px !important;}
  .logo-link img{width:72px !important;}
  .main-nav{margin-top:0 !important;flex:1 !important;justify-content:flex-end !important;gap:9px 14px !important;}
  .main-nav a{font-size:8px !important;letter-spacing:0 !important;}
}


/* RESPONSIVE SAFEGUARDS — mobile only */
@media (max-width: 650px) {
  html, body { width:100%; max-width:100%; overflow-x:hidden; }
  .site-header { width:100% !important; max-width:100%; padding:20px !important; display:flex !important; align-items:flex-start; gap:14px; }
  .logo-link { width:68px; flex:0 0 68px; }
  .logo-link img { width:100% !important; height:auto; }
  .main-nav { min-width:0; flex:1 1 auto; margin:0 !important; padding:0 !important; display:flex; flex-wrap:wrap !important; justify-content:flex-end !important; gap:8px 11px !important; }
  .main-nav a { font-size:8px !important; line-height:1.2; white-space:normal; letter-spacing:0 !important; }
  .hero { width:100%; max-width:100%; margin:38px auto 0 !important; padding:0 20px !important; }
  .hero h1 { max-width:100%; font-size:clamp(32px,9.5vw,38px) !important; line-height:1.08; margin:0 0 28px !important; overflow-wrap:anywhere; }
  .hero-columns { display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:30px !important; }
  .hero-left, .hero-right, .intro-copy, .services-block { width:100%; max-width:100%; min-width:0; }
  .intro-copy p { font-size:18px !important; line-height:1.45; }
  .swan-drawing, .arrow-drawing { display:block; width:100%; max-width:100%; height:auto; margin:28px 0 0 !important; }
  .transition-line { margin:48px 0 28px !important; padding:0 20px !important; font-size:clamp(26px,7.5vw,32px) !important; line-height:1.15; overflow-wrap:anywhere; }
  .product-grid { width:calc(100% - 40px) !important; max-width:100%; margin:0 20px; display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:26px !important; }
  .product-item { width:100%; min-width:0; margin:0; }
  .product-item img { display:block; width:100% !important; max-width:100% !important; height:auto !important; object-fit:contain !important; }
  .product-item h2, .product-item p { overflow-wrap:anywhere; }
}

/* V8 targeted refinements */

@media (max-width:800px){
  .site-header{flex-wrap:wrap !important;align-items:center !important;gap:10px 12px !important;}
  .site-header nav,.site-header .main-nav{order:2;display:flex !important;flex:0 0 100% !important;width:100% !important;max-width:100% !important;min-width:0 !important;flex-wrap:nowrap !important;justify-content:flex-start !important;gap:0 13px !important;overflow-x:auto !important;overflow-y:hidden !important;white-space:nowrap !important;padding:5px 0 8px !important;scrollbar-width:none;}
  .site-header nav::-webkit-scrollbar,.site-header .main-nav::-webkit-scrollbar{display:none;}
  .site-header nav a,.site-header .main-nav a{flex:0 0 auto !important;white-space:nowrap !important;font-size:8px !important;line-height:1.2 !important;letter-spacing:0 !important;}
}