/* Digutils edit2: page and mailbox layout, loaded after site.css. */
/* Approved landing and temporary-mail layout; all tones inherit the active theme. */
.search-intro { margin-right:.26em; }
.hero-stage .hero-photo { object-position:center 35%; }
.hero-stage .hero-art { top:-20px; bottom:-32px; }
.hero-carousel .hero-slide { min-height:354px; padding-bottom:54px; }
.hero-stage > .search-row { margin-top:-34px; }
.hero-controls { bottom:18px; }

.mail-widget {
  flex-direction:column; align-items:flex-start; justify-content:center; gap:0;
  min-height:0; margin-top:16px; padding:22px 30px;
}
.mail-promo-copy { max-width:68%; }
.mail-widget h2 { font-size:clamp(21px,2.5vw,29px); line-height:1.22; margin:0 0 8px; }
.mail-widget h2 span { color:var(--blue); }
.mail-widget p { font-size:var(--font-caption); line-height:1.55; }
.mail-widget .mail-promo-cta {
  align-self:flex-start; margin-top:13px; padding:11px 16px;
  font-size:var(--font-caption); border-radius:10px; background:var(--button);
  color:var(--button-text);
}
.mail-widget .mail-promo-cta:hover { background:var(--blue-hover); }
/* Anchor the decorative inbox to the right. Fixed column spacing prevents
   its folder from overlapping the message rows at intermediate widths. */
.mail-ghost {
  left:auto; right:24px; top:16%; bottom:12px;
  width:min(42%,520px); opacity:.14;
}
.mail-ghost-heading {
  left:210px; right:0; gap:10px; white-space:nowrap; overflow:hidden;
}
.mail-ghost-heading > span {
  flex:0 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis;
}
.mail-ghost-folder { left:0; width:190px; overflow:hidden; white-space:nowrap; }
.mail-ghost-folder svg { flex:none; }
.mail-ghost-rows { left:210px; right:0; padding-left:14px; overflow:hidden; }
.mail-ghost-rows > span { max-width:calc(100% - 52px); margin-left:20px; }
.mail-ghost-rows > span::before { left:-20px; }
@media(max-width:1200px) {
  .mail-ghost { width:min(40%,420px); }
  .mail-ghost-heading { left:166px; }
  .mail-ghost-heading > span { display:none; }
  .mail-ghost-folder { width:150px; gap:10px; padding-inline:10px; }
  .mail-ghost-rows { left:166px; padding-left:12px; }
}
@media(max-width:900px) {
  .mail-ghost { display:none; }
}

.quick-links { display:flex; flex-wrap:wrap; gap:9px; }
.quick-links > span { flex:0 0 100%; }
.quick-links a {
  display:flex; align-items:center; justify-content:center; min-width:0;
  flex:1 1 180px; text-align:center; padding:9px 12px;
}

/* Slide two: a simple mailbox product preview, not a dark-only baked image. */
.hero-mail-art {
  position:absolute; right:0; top:12px; bottom:44px; width:53%;
  display:flex; align-items:center; justify-content:flex-end; pointer-events:none;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 14%,#000);
  mask-image:linear-gradient(to right,transparent,#000 14%,#000);
}
.hero-mail-window {
  width:92%; background:var(--panel); border:1px solid var(--line);
  color:var(--ink); border-radius:17px; padding:20px 22px;
  box-shadow:var(--shadow); transform:rotate(-1deg);
}
.hero-mail-top { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:var(--font-caption); }
.hero-mail-status { color:#208b6d; white-space:nowrap; font-size:12px; }
.hero-mail-address { padding:10px 12px; margin:12px 0; background:var(--soft-blue);
  border:1px solid var(--line); border-radius:9px; font-weight:650; }
.hero-mail-caption { font-size:var(--font-caption); font-weight:700; margin:3px 0; }
.hero-mail-line {
  display:grid; grid-template-columns:1fr 1.1fr auto; gap:8px;
  align-items:center; border-bottom:1px solid var(--line); padding:8px 2px;
  font-size:12px;
}
.hero-mail-line strong,.hero-mail-line span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hero-mail-line span,.hero-mail-line time { color:var(--muted); }
.hero-mail-code {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-top:12px; padding:10px 12px; border-radius:10px;
  background:var(--soft-blue); color:var(--ink); font-size:var(--font-caption);
}
.hero-mail-code strong { color:var(--blue); letter-spacing:.08em; white-space:nowrap; }

.mailbox { padding:24px; }
.mail-consent { display:grid; gap:10px; margin:12px 0 16px; padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.mail-consent-warning { margin:0; line-height:1.5; }
.mail-consent label { display:flex; align-items:flex-start; gap:10px; line-height:1.5; flex-wrap:wrap; }
.mail-consent input[type="checkbox"] { flex:none; margin-top:4px; width:18px; height:18px; accent-color:var(--blue); }
.mail-consent a { color:var(--blue); text-decoration:underline; }

.mailbox-address { margin:14px 0; }
.mailbox-address input { margin-bottom:0; }
.mailbox-actions { gap:10px; margin:14px 0; }
.mailbox-actions button {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:46px; padding:10px 14px; margin:0; border-radius:11px;
  font-size:var(--font-caption); font-weight:600;
}
.mailbox-actions .copy-button,.mailbox-actions .reset-button {
  background:var(--panel); border:1px solid var(--line); color:var(--blue);
}
.mailbox-actions .reset-button { color:var(--ink); }
.mailbox-actions .copy-button:hover,.mailbox-actions .reset-button:hover { border-color:var(--blue); }
.mailbox-workspace {
  display:grid; grid-template-columns:minmax(0,.86fr) minmax(0,1.34fr);
  gap:12px; margin:22px 0;
}
.mailbox-workspace > section {
  min-width:0; min-height:365px; padding:16px;
  background:var(--bg); border:1px solid var(--line); border-radius:14px;
}
.mailbox-workspace h2 { font-size:var(--font-card); margin:0 0 14px; }
.mail-list-head,.mail-item {
  display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto;
  align-items:center; gap:10px;
}
.mail-list-head {
  color:var(--muted); font-size:12px; padding:9px 10px;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.mail-item {
  margin:0; width:100%; min-height:56px; padding:9px 10px; text-align:left;
  border:0; border-bottom:1px solid var(--line); border-radius:0;
  background:transparent; font-size:var(--font-caption);
}
.mail-item strong,.mail-item span,.mail-item small {
  overflow:hidden; white-space:nowrap; text-overflow:ellipsis;
}
.mail-item small { font-size:12px; }
.mail-item:hover,.mail-item.is-selected { background:var(--soft-blue); }
.mail-item.is-selected { box-shadow:inset 3px 0 var(--blue); }
.mail-message-empty { color:var(--muted); font-size:var(--font-caption); }
#mail-message { border-top:1px solid var(--line); padding-top:16px; }
#mail-message h2 { overflow-wrap:anywhere; }
.mail-message-meta { color:var(--muted); font-size:var(--font-caption); margin-bottom:8px; }
#mail-message .mail-body { border-top:1px solid var(--line); padding:16px 0; }
@media(max-width:900px) {
  .mail-promo-copy { max-width:75%; }
  .mailbox-workspace { grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); }
  .mail-list-head,.mail-item { grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto; gap:6px; }
}
@media(max-width:640px) {
  .hero-carousel .hero-slide { min-height:0; padding-bottom:30px; }
  .hero-stage > .search-row { margin-top:-8px; }
  .hero-stage .hero-art { top:auto; bottom:auto; }
  .hero-mail-art { position:relative; top:auto; right:auto; bottom:auto; width:100%; height:260px; margin-top:22px; }
  .hero-mail-window { width:100%; padding:14px; }
  .hero-mail-line { font-size:11px; }
  .mail-widget.mail-widget { padding:19px 20px; }
  .mail-promo-copy { max-width:100%; }
  .mail-widget h2 { font-size:23px; }
  .mail-widget .mail-promo-cta { margin-top:14px; font-size:var(--font-caption); }
  .mail-ghost { display:none; }
  .quick-links a { flex-basis:135px; }
  .mailbox { padding:16px; }
  .mailbox-actions button { flex:1 1 46%; }
  .mailbox-workspace { grid-template-columns:1fr; }
  .mailbox-workspace > section { min-height:210px; padding:12px; }
}
@media(prefers-reduced-motion:reduce) { .hero-mail-window { transform:none; } }

.mail-create-hint { display:inline-flex; cursor:not-allowed; }
.mail-create-hint button:disabled { opacity:.5; cursor:not-allowed; pointer-events:none; }
