/*
Theme Name: Experimenta Isso Portal Limpo
Description: Tema-filho independente e reversível do Experimenta Isso Portal.
Author: Experimenta Isso
Version: 1.1.2
Template: theme-experimenta
Text Domain: experimentaisso-portal-limpo
*/

@import url("../theme-experimenta/style.css");

:root {
  --ink: #10213f;
  --muted: #5f6a7a;
  --paper: #fff8e8;
  --card: #fffdf6;
  --line: #19325c;
  --accent: #ff6b18;
  --accent-dark: #b8380f;
  --yellow: #d9ff62;
  --brand-brown: #10213f;
  --ei-blue: #2457e6;
  --ei-sky: #cfeaff;
  --ei-lilac: #e9dcff;
  --ei-lime: #d9ff62;
  --max: 1320px;
}

[data-theme="dark"] {
  --ink: #f8f2df;
  --muted: #b7c1d2;
  --paper: #101b31;
  --card: #172743;
  --line: #6f83a8;
  --accent: #ff8a45;
  --accent-dark: #ffc09a;
  --ei-blue: #7fa3ff;
  --ei-sky: #1a3758;
  --ei-lilac: #342a55;
  --ei-lime: #c6ec55;
}

body { font-family: "Avenir Next", Avenir, "Trebuchet MS", ui-sans-serif, system-ui, sans-serif; background-image: radial-gradient(circle at 1px 1px, rgba(16,33,63,.1) 1px, transparent 0); background-size: 24px 24px; }
h1, h2, h3, .brand { font-family: "Arial Rounded MT Bold", "Avenir Next", ui-sans-serif, system-ui, sans-serif; }

.site-header { top: 0; background: color-mix(in srgb, var(--paper) 92%, transparent); border-bottom: 2px solid var(--ink); box-shadow: 0 4px 0 var(--accent); }
.masthead { min-height: 82px; }
.brand { gap: 12px; letter-spacing: -.035em; }
.brand-logo { width: 50px; height: 50px; filter: drop-shadow(3px 3px 0 var(--ei-lime)); }
.main-nav { gap: 7px; font-size: .78rem; }
.main-nav a { padding: 8px 11px; border: 1.5px solid var(--ink); border-radius: 9px; background: var(--card); box-shadow: 2px 2px 0 var(--ink); transition: translate .15s ease, box-shadow .15s ease; }
.main-nav a:hover { color: var(--ink); background: var(--ei-lime); translate: 2px 2px; box-shadow: 0 0 0 var(--ink); }
.header-search .search-form input, .header-search .search-form button, .theme-toggle { border-radius: 8px; }
.header-search .search-form input { border: 1.5px solid var(--ink); }
.header-search .search-form button { background: var(--ei-blue); }
.theme-toggle { border: 1.5px solid var(--ink); box-shadow: 2px 2px 0 var(--ink); }

.discovery-cover { padding: clamp(42px,6vw,86px) 0 54px; background: var(--ei-sky); border-bottom: 2px solid var(--ink); }
.discovery-cover-inner { display: grid; gap: 34px; }
.discovery-intro { display: grid; grid-template-columns: minmax(0,.7fr) minmax(0,1.7fr); gap: 18px 50px; align-items: end; }
.discovery-intro .eyebrow { align-self: start; width: max-content; padding: 9px 13px; color: var(--ink); background: var(--ei-lime); border: 1.5px solid var(--ink); border-radius: 8px; box-shadow: 3px 3px 0 var(--ink); }
.discovery-intro h1 { margin: 0; max-width: 920px; font-size: clamp(2.5rem,5.5vw,6rem); line-height: .92; letter-spacing: -.055em; }
.discovery-intro p { grid-column: 2; max-width: 720px; margin: 0; color: var(--ink); font-size: clamp(1.05rem,1.7vw,1.35rem); }
.discovery-deck { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(340px,.85fr); gap: 20px; }
.discovery-lead, .discovery-rail article { border: 2px solid var(--ink); border-radius: 18px; background: var(--card); box-shadow: 7px 7px 0 var(--ink); overflow: hidden; }
.discovery-lead a { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(280px,.85fr); min-height: 420px; }
.discovery-image { position: relative; min-height: 100%; overflow: hidden; }
.discovery-image img { width: 100%; height: 100%; object-fit: cover; }
.discovery-number { display: grid; place-items: center; width: 42px; height: 42px; color: var(--ink); background: var(--ei-lime); border: 1.5px solid var(--ink); border-radius: 50%; font-weight: 900; }
.discovery-image .discovery-number { position: absolute; left: 16px; top: 16px; }
.discovery-copy { display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(24px,4vw,48px); background: var(--ei-lilac); }
.discovery-copy h2 { margin: 8px 0 18px; font-size: clamp(1.9rem,3.2vw,3.5rem); line-height: .98; letter-spacing: -.045em; }
.discovery-copy small { color: var(--muted); font-weight: 800; }
.discovery-rail { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.discovery-rail article a { display: grid; grid-template-rows: auto 150px 1fr; height: 100%; padding: 12px; gap: 10px; }
.discovery-rail img { width: 100%; height: 150px; border-radius: 10px; object-fit: cover; }
.discovery-rail h3 { margin: 0; font-size: clamp(.86rem,1.2vw,1.08rem); line-height: 1.1; }
.discovery-rail article:nth-child(2) { translate: 0 12px; background: var(--ei-lime); }
.discovery-rail article:nth-child(3) { background: #ffd9c2; }

.home-columns { display: block; }
.home-columns .section { padding: clamp(54px,7vw,92px) 0; }
.section-head { align-items: end; border: 0; padding: 0; margin-bottom: 28px; }
.section-kicker { display: block; margin-bottom: 8px; color: var(--ei-blue); font-size: .72rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.section-head h2 { max-width: 800px; font-size: clamp(2rem,4.3vw,4.4rem); line-height: .96; }
.section-head a { padding-bottom: 5px; color: var(--ink); border-bottom: 3px solid var(--accent); }
.home-columns .post-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.home-columns .post-grid .card { grid-column: auto; display: grid; grid-template-columns: 210px 1fr; min-height: 210px; border: 1.5px solid var(--ink); border-radius: 14px; box-shadow: 4px 4px 0 var(--ink); }
.home-columns .card-media { aspect-ratio: auto; min-height: 100%; border-right: 1.5px solid var(--ink); }
.home-columns .card-body { padding: 22px; }
.home-columns .card h2 { font-size: clamp(1.15rem,1.8vw,1.55rem); }
.home-columns .card:hover { translate: 2px 2px; transform: none; box-shadow: 2px 2px 0 var(--ink); }

.product-shelf { padding: 60px 0 72px; background: var(--ei-lilac); border-block: 2px solid var(--ink); }
.portal-block { padding: 0; }
.offer-grid { gap: 20px; }
.offer-card { border: 1.5px solid var(--ink); border-radius: 14px; box-shadow: 4px 4px 0 var(--ink); }
.offer-card img, .offer-card > img { background: #fff; }
.offer-card .button { border-radius: 8px; background: var(--ei-blue); box-shadow: 2px 2px 0 var(--ink); }

.media-hub { padding: clamp(64px,8vw,104px) 0; color: var(--ink); background: var(--ei-lime); border-bottom: 2px solid var(--ink); }
.studio-heading { display: grid; grid-template-columns: .65fr 1.35fr; gap: 10px 46px; margin-bottom: 34px; }
.studio-heading .eyebrow { width: max-content; color: var(--ink); }
.studio-heading h2 { margin: 0; max-width: 900px; font-size: clamp(2.3rem,5vw,5rem); line-height: .92; letter-spacing: -.045em; }
.studio-heading p { grid-column: 2; max-width: 700px; margin: 4px 0 0; color: var(--ink); font-size: 1.08rem; }
.media-grid { grid-template-columns: minmax(0,1.5fr) minmax(320px,.7fr); gap: 22px; }
.video-feature, .social-panel { border: 2px solid var(--ink); border-radius: 18px; box-shadow: 7px 7px 0 var(--ink); }
.video-feature { padding: 14px; background: var(--card); }
.video-label { display: flex; justify-content: space-between; gap: 20px; padding: 5px 3px 13px; font-weight: 850; }
.video-label a { color: var(--ei-blue); }
.video-frame { border: 2px solid var(--ink); border-radius: 11px; }
.social-panel { position: relative; padding: 28px; background: var(--ei-lilac); overflow: hidden; }
.social-stamp { position: absolute; right: -20px; top: -25px; display: grid; place-items: center; width: 110px; height: 110px; border: 2px solid var(--ink); border-radius: 50%; background: var(--accent); font-size: 2rem; font-weight: 950; transform: rotate(12deg); }
.media-hub .social-panel h2 { margin: 10px 70px 10px 0; font-size: clamp(1.8rem,3vw,3rem); line-height: .96; }
.media-hub .social-panel > p { color: var(--ink); }
.social-links .button { color: #fff; border: 1.5px solid var(--ink); border-radius: 8px; background: var(--ei-blue); box-shadow: 2px 2px 0 var(--ink); }
.instagram-grid { padding: 12px; border: 1.5px solid var(--ink); border-radius: 12px; background: var(--card); }
.instagram-all { color: var(--ink); }

.card, .video-card, .ei-legacy-post-card, .institutional-channel, .institutional-post-card, .article-summary, .ei-form { border-color: var(--ink); border-radius: 14px; }
.button { border-radius: 8px; }
.article-content { font-family: Charter, Georgia, serif; }
.single-post .article-summary { display: none; }

@media (max-width: 1050px) {
  .discovery-intro, .studio-heading { grid-template-columns: 1fr; }
  .discovery-intro p, .studio-heading p { grid-column: 1; }
  .discovery-deck, .media-grid { grid-template-columns: 1fr; }
  .discovery-lead a { min-height: 360px; }
}

@media (max-width: 820px) {
  .masthead { padding: 13px 0; }
  .main-nav a { box-shadow: none; }
  .discovery-cover { padding-top: 34px; }
  .discovery-lead a { grid-template-columns: 1fr; }
  .discovery-image { min-height: 330px; }
  .discovery-rail { grid-template-columns: repeat(3,minmax(220px,1fr)); overflow-x: auto; padding-bottom: 12px; }
  .home-columns .post-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .discovery-intro h1 { font-size: 2.8rem; }
  .discovery-image { min-height: 250px; }
  .discovery-copy { padding: 24px; }
  .home-columns .post-grid .card { grid-template-columns: 128px 1fr; min-height: 170px; }
  .home-columns .card-body { padding: 15px; }
  .home-columns .card h2 { font-size: 1rem; }
  .offer-grid { grid-template-columns: 1fr 1fr; }
  .studio-heading h2 { font-size: 2.65rem; }
  .social-panel { padding: 22px; }
}
