.tep-personal {
  color:var(--ink);
  font-family:Inter,system-ui,sans-serif;
  font-size:16px;
  line-height:1.6}

body.tep-personal-page site-header {
  display:block;
  min-height:101px}

.tep-personal * {
  box-sizing:border-box}
.tep-personal p {
  margin:16px 0;
  color:var(--text-muted)}

.tep-personal h1,.tep-personal h2,.tep-personal h3 {
  font-family:Inter,system-ui,sans-serif;
  font-weight:800;
  letter-spacing:-.035em;
  color:var(--ink);
  text-transform:none}

.tep-personal h1 {
  font-size:clamp(38px,4.4vw,58px);
  line-height:1.06;
  margin:22px 0}

.tep-personal h2 {
  font-size:clamp(29px,3.2vw,42px);
  line-height:1.1;
  margin:0 0 24px}
.tep-personal h3 {
  font-size:22px;
  line-height:1.2;
  margin:16px 0}

.pp-wrap {
  width:min(1180px,100%);
  margin:auto;
  padding:0 28px}
.tep-personal a {
  color:inherit;
  text-decoration:none}
.tep-personal a:hover {
  text-decoration:underline;
  text-underline-offset:4px}

.pp-section {
  padding:82px 0;
  scroll-margin-top:32px}
.pp-soft {
  background:var(--canvas-deep)}
.pp-eyebrow,.tep-personal .pp-eyebrow {
  color:var(--thread-ui);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.12em;
  margin:0 0 18px}

.pp-hero {
  padding:28px 0 64px;
  background:radial-gradient(ellipse at 85% 10%,#fff3e9,transparent 65%)}
.pp-breadcrumb {
  font-size:11px;
  text-transform:uppercase;
  font-weight:700;
  letter-spacing:.08em;
  margin:4px 0 30px;
  color:var(--thread-ui)}
.pp-breadcrumb a {
  text-decoration:underline}

.pp-hero-grid {
  display:grid;
  grid-template-columns:1.25fr 1fr;
  gap:48px;
  align-items:center}
.pp-lead,.tep-personal .pp-lead {
  font-size:18px;
  max-width:610px}
.pp-actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin:28px 0 16px}

.pp-btn {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  font:700 11px/1.4 Inter,system-ui,sans-serif;
  text-transform:uppercase;
  letter-spacing:.05em;
  padding:15px 20px;
  min-height:46px;
  border-radius:2px;
  text-decoration:none!important;
  cursor:pointer;
  border:1px solid transparent}
.pp-green {
  background:var(--whatsapp);
  color:white!important}
.pp-green:hover {
  background:var(--whatsapp-dark)}
.pp-outline {
  border:1px solid var(--ink);
  background:transparent;
  color:var(--ink)}
.pp-outline:hover {
  background:#e9edf0}

.pp-small,.tep-personal .pp-small {
  font-size:13px;
  line-height:1.6}
.pp-hero-photos {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  align-items:start}
.pp-hero-photos figure {
  margin:0;
  position:relative}
.pp-hero-photos figure+figure {
  margin-top:58px}
.pp-hero-photos img {
  display:block;
  width:100%;
  height:290px;
  object-fit:cover;
  border-radius:2px}
.pp-hero-photos figcaption {
  font-size:11px;
  font-weight:600;
  margin-top:9px}
.pp-hero-photos>p {
  grid-column:1/-1;
  text-align:right;
  font-size:11px;
  margin:0;
  color:var(--text-muted)}

.pp-jump {
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)}
.pp-jump .pp-wrap {
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding-top:17px;
  padding-bottom:17px;
  flex-wrap:wrap}
.pp-jump a {
  font-size:12px;
  font-weight:700}

.pp-heading {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:50px;
  margin-bottom:34px}
.pp-heading h2 {
  margin-bottom:0}
.pp-heading>p {
  max-width:365px;
  margin:0;
  font-size:15px}
.pp-gallery {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px}
.pp-gallery figure {
  margin:0}
.pp-photo {
  display:block;
  position:relative;
  background:#e7e7e7;
  overflow:hidden;
  border-radius:2px}
.pp-photo img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/5;
  object-fit:cover;
  transition:transform .2s}
.pp-photo:hover img {
  transform:scale(1.025)}
.pp-photo>span {
  position:absolute;
  right:8px;
  bottom:8px;
  background:white;
  padding:5px 10px;
  font-size:11px;
  font-weight:700}
.pp-gallery figcaption {
  padding-top:14px;
  font-size:12px;
  color:var(--text-muted)}
.pp-gallery figcaption strong {
  display:block;
  font-size:16px;
  margin-bottom:4px;
  color:var(--ink)}

.pp-tech-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px}
.pp-tech {
  background:white;
  border:1px solid var(--line);
  padding:28px;
  border-top:3px solid var(--thread)}
.pp-number {
  font-size:12px;
  font-weight:800;
  color:var(--thread-ui)}
.pp-tech h3 {
  font-size:30px}
.pp-tech p {
  font-size:14px}
.pp-link {
  display:block;
  font-size:12px;
  font-weight:700;
  margin-top:16px;
  color:var(--ink);
  text-decoration:underline!important;
  text-underline-offset:4px}
.pp-tech .pp-link:last-child {
  color:var(--whatsapp)}

.pp-table-wrap {
  overflow-x:auto;
  margin:36px 0 0;
  background:white;
  border:1px solid var(--line)}
.pp-table-wrap table {
  width:100%;
  min-width:640px;
  border-collapse:collapse;
  font-size:13px;
  text-align:left}
.pp-table-wrap caption {
  text-align:left;
  padding:18px 20px;
  font-weight:700;
  font-size:15px;
  color:var(--ink)}
.pp-table-wrap th,.pp-table-wrap td {
  padding:16px 18px;
  border-top:1px solid var(--line);
  vertical-align:top;
  width:25%}
.pp-table-wrap thead {
  background:var(--ink);
  color:white}
.pp-table-wrap tbody th {
  font-weight:600}
.pp-advice {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  margin-top:28px}
.pp-advice h3 {
  font-size:19px;
  margin:0}
.pp-advice p {
  font-size:14px;
  margin:8px 0 0}
.pp-advice .pp-btn {
  flex-shrink:0}

.pp-split {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px}
.pp-prendas {
  list-style:none;
  padding:0;
  margin:26px 0}
.pp-prendas li {
  border-top:1px solid var(--line);
  padding:13px 0;
  font-size:14px}
.pp-prendas li:before {
  content:'↳';
  color:var(--thread-ui);
  margin-right:14px}
.pp-audience {
  padding:32px;
  background:var(--canvas-deep);
  border-left:3px solid var(--thread)}
.pp-audience article+article {
  border-top:1px solid var(--line);
  padding-top:8px}
.pp-audience h3 {
  font-size:19px}
.pp-audience p {
  font-size:14px}

.pp-navy {
  background:var(--ink);
  color:var(--text-on-ink)}
.pp-navy h2,.pp-navy h3 {
  color:var(--text-on-ink)}
.tep-personal .pp-navy p {
  color:#d9dfeb}
.tep-personal .pp-navy .pp-eyebrow {
  color:#ffa14c}
.pp-steps {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px;
  list-style:none;
  padding:0;
  margin:44px 0 24px}
.pp-steps li {
  border-top:1px solid #52667a;
  padding-top:20px}
.pp-steps span {
  font-size:12px;
  color:#ffa14c;
  font-weight:700}
.pp-steps h3 {
  font-size:20px}
.pp-steps p {
  font-size:14px}
.tep-personal .pp-conditions {
  border-top:1px solid #52667a;
  padding-top:20px;
  font-size:13px}

.pp-faq details {
  border-top:1px solid var(--line)}
.pp-faq details:last-child {
  border-bottom:1px solid var(--line)}
.pp-faq summary {
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  padding:20px 26px 20px 0;
  list-style:none;
  position:relative}
.pp-faq summary:after {
  content:'+';
  position:absolute;
  right:0;
  font-size:20px;
  top:15px;
  color:var(--thread-ui)}
.pp-faq details[open] summary:after {
  content:'−'}
.pp-faq details p {
  font-size:14px;
  margin:0 0 24px}
.pp-faq a {
  text-decoration:underline}
.pp-guides {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin-top:34px}
.pp-guide {
  background:white;
  padding:28px;
  border:1px solid var(--line)}
.pp-guide h3 {
  font-size:21px}
.pp-guide:hover {
  border-color:var(--thread-ui);
  text-decoration:none!important}

.pp-contact-details {
  margin-top:24px;
  font-size:13px}
.pp-contact-details a {
  display:block;
  padding:6px 0;
  font-weight:600;
  text-decoration:underline}
.pp-form-card {
  padding:32px;
  border:1px solid var(--line);
  background:var(--canvas-deep)}
.pp-form-card h3 {
  margin-top:0}
.pp-form-card>p {
  font-size:14px}
tep-personal-page {
  display:block}

.pp-skip {
  position:absolute;
  top:-100px;
  left:20px;
  z-index:10000;
  background:white;
  color:var(--ink);
  padding:14px}
.pp-skip:focus {
  top:10px}

.tep-personal :focus-visible,.pp-skip:focus-visible {
  outline:3px solid var(--thread-ui);
  outline-offset:4px}

@media(max-width:960px) {
  .pp-hero-grid {
  gap:28px;
  grid-template-columns:1.2fr .85fr}
.pp-hero-photos {
  grid-template-columns:1fr}
.pp-hero-photos figure+figure {
  display:none}
.pp-hero-photos img {
  height:350px}
.pp-hero-photos>p {
  text-align:left}
.pp-split {
  gap:40px}
.pp-tech {
  padding:22px}
.pp-tech .pp-small {
  min-height:90px}
.pp-heading {
  gap:32px}
}

@media(max-width:680px) {
  .pp-wrap {
  padding:0 20px}
.pp-section {
  padding:56px 0}
.pp-hero {
  padding-top:20px;
  padding-bottom:40px}
.pp-breadcrumb {
  margin-bottom:24px}
.pp-hero-grid,.pp-split {
  grid-template-columns:1fr;
  gap:32px}
.tep-personal h1 {
  font-size:40px}
.pp-hero-photos {
  grid-template-columns:1fr 1fr;
  gap:10px}
.pp-hero-photos figure+figure {
  display:block;
  margin-top:30px}
.pp-hero-photos img {
  height:220px}
.pp-hero-photos>p {
  font-size:10px;
  text-align:right}
.pp-hero-photos figcaption {
  font-size:10px}
.pp-lead,.tep-personal .pp-lead {
  font-size:16px}
.pp-actions {
  gap:10px}
.pp-actions .pp-btn {
  flex:1 0 100%}
.pp-jump .pp-wrap {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px}
.pp-jump a {
  font-size:11px}
.pp-heading {
  display:block;
  margin-bottom:26px}
.pp-heading>p {
  margin-top:20px}
.pp-gallery {
  grid-template-columns:1fr 1fr;
  gap:24px 14px}
.pp-gallery figcaption strong {
  font-size:15px}
.pp-gallery figcaption span {
  font-size:11px}
.pp-photo>span {
  font-size:10px;
  padding:4px 6px}
.pp-tech-grid,.pp-guides {
  grid-template-columns:1fr;
  gap:16px}
.pp-tech .pp-small {
  min-height:0}
.pp-tech h3 {
  font-size:28px}
.pp-table-wrap:before {
  content:'Desliza para comparar →';
  display:block;
  font-size:11px;
  padding:12px 16px;
  background:#fff0e4;
  color:var(--thread-ui);
  font-weight:700}
.pp-advice {
  display:block}
.pp-advice .pp-btn {
  margin-top:20px}
.pp-audience,.pp-form-card {
  padding:24px}
.pp-steps {
  grid-template-columns:1fr 1fr;
  gap:24px 18px}
.pp-steps h3 {
  font-size:18px}
.pp-steps p {
  font-size:13px}
.pp-guide {
  padding:24px}
}

@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto}
.pp-photo img {
  transition:none}
}


/* Integración con la base compartida y continuidad visual de Inicio/Yazbek. */
.tep-personal { --pp-warm: #fcf9f5; }
.pp-soft { background: var(--pp-warm); }
.pp-hero { background: linear-gradient(125deg, #fffaf6, #fff 62%); }
.tep-personal .pp-jump a, .tep-personal .pp-link { display: inline-flex; align-items: center; min-height: 44px; }
.tep-personal .pp-tech .pp-link { display: flex; }
.tep-personal .pp-contact-details a { min-height: 44px; padding-block: 10px; }
.tep-personal .pp-guide { display: flex; flex-direction: column; }
.tep-personal .pp-guide .pp-link { margin-top: auto; padding-top: 16px; }
.tep-personal .pp-form-card { background: var(--white); border-radius: 4px; }
.tep-personal .pp-form-card .quick-form { gap: 16px; margin-top: 24px; }
.tep-personal .quick-form-field label { color: var(--ink); font-size: 12px; }
.tep-personal .quick-form-field :is(input, textarea) { background: var(--white); color: var(--ink); border-color: #99a4b5; border-radius: 2px; }
.tep-personal .quick-form-field :is(input, textarea)::placeholder { color: #68758a; }
.tep-personal .pp-form-card .quick-form-help { margin: 0; font-size: 12px; }
.tep-personal .pp-form-card .quick-form .alt { margin: 0; color: var(--text-muted); font-size: 12px; }
.tep-personal .quick-form .alt a { color: var(--whatsapp); border-color: currentColor; }
.tep-personal .quick-form button { width: 100%; justify-content: center; min-height: 48px; background: var(--whatsapp); color: var(--white); font-size: 12px; }
.tep-personal .quick-form-status.is-error { color: #9f1d1d; background: #fff1f1; }
.tep-personal .quick-form-status.is-success { color: #075c2b; background: #effaf1; }
.tep-personal-page .contact-bar a { min-height: 44px; }
.tep-personal-page .contact-bar .icon-only { min-width: 44px; justify-content: center; }
@media (max-width: 680px) { .tep-personal-page site-header { min-height: 101px; } }
