:root {
  --logo-lg: #77c800;
  --logo-dg: #156a49;
  --logo-md: #3b8f3d;
  --dark: #1f2b2a;
  --muted: #6b6b6b;
  --bg-light: #f7f8f6;
  --bg-white: #ffffff;
  --border-light: #f0f0f0;
  /* --max-width: 1100px; */
  --container-padding: clamp(12px, 2vw, 28px);
  --shadow: 0 6px 18px rgba(28,40,33,0.12);
  --shadow-soft: 0 4px 10px rgba(28,40,33,0.06);
  --fs-xxl: clamp(1.6rem, 2.6vw, 2.4rem);
  --fs-xl: clamp(1.15rem, 1.8vw, 1.4rem);
  --fs-md: 1rem;
  --fs-sm: 0.9rem;
  --radius: clamp(6px, 0.6vw, 12px);
  --focus-ring: 3px solid rgba(34,139,34,0.18);
}

body.dark-theme,
@media (prefers-color-scheme: dark) {
  --logo-lg: #8ee06a;
  --logo-dg: #79a87a;
  --logo-md: #66b36c;
  --dark: #e7efe9;
  --muted: #c1c1c1;
  --bg-light: #0f1412;
  --bg-white: #0b0e0b;
  --border-light: #111413;
  --shadow: 0 6px 18px rgba(0,0,0,0.6);
  --shadow-soft: 0 4px 10px rgba(0,0,0,0.45);
}

* { box-sizing: border-box; }
html,body {
  height:100%;
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--dark);
  background:linear-gradient(180deg,var(--bg-light),var(--bg-white));
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; height:auto; }

.container {
  max-width:var(--max-width);
  padding:var(--container-padding);
}

.card {
  background:var(--bg-white);
  border-radius:var(--radius);
  padding:clamp(14px,1.8vw,22px);
  box-shadow:var(--shadow);
  overflow:hidden;
}

.hero {
  display:flex;
  gap:clamp(12px,2vw,24px);
  align-items:center;
  flex-wrap:wrap;
}

.logo-wrap {
  flex:0 0 30%;
  min-width:200px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.logo-wrap img {
  width:100%;
  max-width: 45%;
  border-radius:calc(var(--radius) - 4px);
  background:var(--bg-white);
  padding:clamp(6px,0.8vw,10px);
  /* box-shadow:var(--shadow-soft); */
}

.hero-info {
  flex:1 1 40%;
  min-width:220px;
}

.company {
  display:flex;
  flex-direction:column;
  gap:0.4rem;
}

.company h1 {
  margin:0;
  font-size:var(--fs-xxl);
  letter-spacing:0.2px;
  color: var(--logo-dg);
}

.company .owner {
  margin-top:0.25rem;
  font-size:clamp(1rem,1.3vw,1.1rem);
  color: var(--logo-lg);
  font-weight:700;
}

.tagline {
  margin-top:0.6rem;
  font-weight:700;
  color: var(--dark);
  font-size:var(--fs-xl);
}

.subtag {
  margin-top:0.45rem;
  color:var(--logo-md);
  font-weight:700;
  font-size:clamp(0.95rem,1.2vw,1rem);
  text-align: center;
}

.contact-card {
  display:flex;
  gap:clamp(8px,1.6vw,14px);
  align-items:center;
  background:linear-gradient(180deg,rgba(247,255,247,0.9),rgba(247,255,247,0.85));
  border-radius:calc(var(--radius) - 2px);
  padding:clamp(8px,1.2vw,14px);
  border:1px solid rgba(45,155,74,0.12);
  max-width:100%;
  box-shadow:var(--shadow-soft);
}

.contact-card .phone {
  font-size:clamp(1.05rem,1.6vw,1.25rem);
  font-weight:800;
}

.contact-actions {
  margin-left:auto;
  display:flex;
  gap:0.6rem;
  align-items:center;
}

.btn {
  display:inline-block;
  padding:clamp(8px,0.9vw,12px) clamp(12px,1.2vw,16px);
  border-radius:calc(var(--radius) - 2px);
  text-decoration:none;
  font-weight:700;
  font-size:clamp(0.9rem,1.2vw,1rem);
}

.btn-call {
  background:linear-gradient(180deg,var(--logo-dg),#0c6b33);
  color:var(--bg-white);
  box-shadow:0 4px 10px rgba(12,107,51,0.08);
  border:none;
}

.btn-call:focus {
  outline:none;
  box-shadow:var(--focus-ring);
}

.btn-mail {
  background:transparent;
  border:1px dashed var(--logo-lg);
  color:var(--logo-lg);
}

.details {
  display:flex;
  gap:clamp(12px,2vw,24px);
  margin-top:clamp(12px,1.8vw,22px);
  flex-wrap:wrap;
}

.panel {
  background:var(--bg-white);
  border-radius:calc(var(--radius) - 2px);
  padding:clamp(12px,1.2vw,18px);
  border: 1px solid var(--border-light);
  width: 75%;
  margin: auto;
}

.panel h3 {
  margin:0 0 0.5rem 0;
  color:var(--logo-lg);
  font-size:clamp(1rem,1.4vw,1.1rem);
}

.panel p {
  margin:0;
  color:var(--muted);
  line-height:1.5;
  font-size:var(--fs-md);
}

.list {
  margin:0.6rem 0 0 1.1rem;
  color:var(--dark);
}

.address {
  display:flex;
  gap:clamp(12px,2vw,24px);
  margin-top:clamp(12px,1.8vw,22px);
  align-items:flex-start;
  flex-wrap:wrap;
}


.address .map {
  border-radius:calc(var(--radius) - 2px);
  overflow:hidden;
  background:var(--border-light);
}

.map iframe {
  width:100%;
  height:24vh;
  min-height:160px;
  border:0;
  display:block;
}

footer {
  margin-top:clamp(12px,1.6vw,20px);
  text-align:center;
  color:var(--muted);
  font-size:var(--fs-sm);
}

a:focus, button:focus, .btn:focus {
  outline:none;
  box-shadow:var(--focus-ring);
  border-radius:calc(var(--radius) - 2px);
}

.visually-hidden {
  position:absolute!important;
  height:1px;
  width:1px;
  overflow:hidden;
  clip:rect(1px,1px,1px,1px);
  white-space:nowrap;
}

@media (max-width:980px){
  .logo-wrap { flex:0 0 36%; }
  .hero { gap:4vw; }
}

@media (max-width:780px){
  .logo-wrap { flex:1 1 100%; }
  .logo-wrap img{ max-width: 100%; }
  .hero-info { flex:1 1 100%; }
  .contact-card { width:100%; }
  .address .map { flex:1 1 100%; }
  .panel { padding:clamp(10px,1.6vw,14px);
    width:100%; }
}

body.dark-theme {
  background:linear-gradient(180deg,var(--bg-light),var(--bg-white));
  color:var(--dark);
}

body.dark-theme .card {
  background:rgba(255,255,255,0.03);
  box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,0.03);
}

body.dark-theme .btn-mail {
  border-color:rgba(255,255,255,0.12);
  color:var(--logo-lg);
}

body.dark-theme .contact-card {
  background:linear-gradient(180deg,rgba(15,20,18,0.6),rgba(11,14,11,0.5));
  border:1px solid rgba(255,255,255,0.03);
  box-shadow:none;
}
